React - for文でUsing ‘ForInStatement’ is not allowedと怒られる

JavaScript React

Reactで配列やオブジェクトをfor文で回そうとするとESLintにUsing 'ForInStatement' is not allowed.eslint(no-restricted-syntax)と怒られてしまします。 NG例: 配列をfor...inで回す const arr = [1, 2, 3, 4]; for (e in arr) { console.log(e); } // Usi…

2020-05-18

React + Reduxで簡易掲示板

JavaScript React

今回は、前回Reactで作った簡易掲示板をReduxでリプレイスします。前回同様、↑のような簡易掲示板をReduxを使って作ります。それでは、↓の手順にそって実装していきます。必要なパッケージのインストールaction作成reducer作成store作成component作成必…

2020-05-16

Reactのみで簡易掲示板

JavaScript React

Reactを用いて↓のような簡易掲示板を作ったのでメモ。コンポーネントに分けず、Stateのみを用いたパターンと、コンポーネントにわけPropsを用いたパターンの2つを実装してみました。実装今回は値の追加にformは用いていません。handleInputChangeメソッド…

2020-05-16

情報セキュリティ - CIAと３つの脅威

セキュリティ

はじめに今回は、情報セキュリティの定義や脅威についてまとめます。情報セキュリティとは情報セキュリティとは、情報の機密性、完全性、可用性を維持すること、とJIS Q 27002によって規定されています。機密性 (Confidentiality) 情報へのアクセス許可…

2020-05-14

React - propsで子コンポーネントに値を渡す

JavaScript React

Reactで子コンポーネントに値を渡すコードメモ。 propsは親コンポーネントから子コンポーネントへ値を渡す時に使い、変更不可な値(イミュータブル)。＊対してstateはコンポーネント内の状態であり、変更可(ミュータブル)。 ↓は、AppコンポーネントからUser…

2020-05-09

Metasploit - モジュールを実行するとwarning: URI.unescape is obsolete

Metasploit エラーセキュリティ

「ハッキング・ラボのつくりかた」という書籍を読み進めているのですが、第４章の権限昇格のところで以下のような大量のwarningに遭遇しました。 msf5 exploit(windows/local/bypassuac_fodhelper) > exploit [] Started HTTPS reverse handler on https://1…

2020-05-07

外部リンクtarget="_blank"の危険性 - Tabnabbing

JavaScript セキュリティ

はじめに今回は、aタグにtarget="_blank"を指定することのリスクと対処法についてまとめます。こういうやつ↓の危険性ですね。 <a href="hoge.html" target="_blank"></a> target="_blank"の危険性 target="_blank"は、リンク先のページを新しいウィンドウで開く指定をする属性ですが、リンク先とし…

2020-05-05

JavaScript - sort()を非破壊的に使う

JavaScript

はじめに今回はJavaScriptのsort()の副作用についてメモしていきます。 sort()の副作用 sort()は元の配列の順番を直接ソートします。破壊的メソッドというやつですね。 const months = ['March', 'Jan', 'Feb', 'Dec']; months.sort(); console.log(months)…

2020-05-01

React - stateの値を同期的に更新

JavaScript React

はじめに今回はReactのstateについてメモ。setState()でstateの値を更新し、同期的に取得する方法を書いていきます。結論 ↓のようにすると、同期的にstateの値を更新/取得することができます。 import React, { Component } from 'react'; class App exten…

2020-04-24

React - static propTypesとReact.PropTypes

JavaScript

はじめに ReactでpropTypesを書いている時にstatic propTypes とReact.PropTypes は何が違うのか気になったので、調べたことをメモします。 ↓の何が違うのか、ということです。 // static propTypes class App extends React.Component { static propTypes =…

2020-04-05

JavaScriptで関数型プログラミング - reduce()

JavaScript

はじめに関数型プログラミングをJavaScriptで勉強中です。今回はreduce()の使い方についてメモします。関数型プログラミングを学んでいるときに↓のようなコードを見かけました。この関数はどちらも、渡された配列要素の合計を返す関数です。 //reducerを使…

2020-04-03

React - JSXの波括弧{}

JavaScript React

JSXで出てくる波括弧の意味について調べたのでメモします。 JSX内で出てくる波括弧{}は、JavaScriptの値を取得したいときに使います。なので例えば、 <Button> title="なみかっこ" color="blue" style={{ display: 'none' }} </Button> のstyleの値部分は、内側の{}はオブジ…

2020-04-02

Mac - .bash_profileの設定が再起動後無効になる

Mac tips エラー

はじめに MacでツールをインストールしてPATHを通した後、Macを再起動するとPATHを通したはずのコマンドが使えなくなってました。その解決法メモ。 $ zsh: command not found: node 結論早速結論ですが、指定しているログインシェルの設定ファイルに設定を…

2020-04-01

JavaScript - 関数の巻き上げ

JavaScript

はじめに次にようなコードを書いていてエラーが起きたので、今回は関数の巻き上げについてメモ。 func(); //=> Hello function funcExpression(); //=> Uncaught ReferenceError: Cannot access 'funcExpression' before initialization function func () {…

2020-03-29

ReactのためのJavaScript - 論理演算子とショートサーキット評価

JavaScript React

はじめに Reactを学ぶためのモダンなJavaScriptについてまとめます。今回は論理演算子とショートサーキット評価(短絡評価)について書いていきます。論理演算子論理演算は3つ種類があります。論理積(AND) / 論理和( || ) / 否定(NOT)の3つです。それらを表…

2020-03-27

ReactのためのJavaScript – 便利な書き方(分割代入/スプレッド記法)

JavaScript React

はじめに Reactを学ぶためのモダンなJavaScriptについてまとめます。今回はECMAScript2015(ES6)から導入された、分割代入やスプレッド記法などの配列/オブジェクトに関する便利な書き方についてまとめます。まずは分割代入から。分割代入分割代入とは、…

2020-03-26

ReactのためのJavaScript – クラス

JavaScript React

はじめに Reactを学ぶためのモダンなJavaScriptについてまとめます。今回はECMAScript2015(ES6)から導入されたクラスについて書いていきます。基本的に他言語におけるクラスと同じですが、クラスの作成方法やプロパティの定義の仕方が独自ですのでまとめて…

2020-03-26

ReactのためのJavaScript – アロー関数とthis

JavaScript React

はじめに Reactを学ぶためのモダンなJavaScriptについてまとめます。今回はECMAScript2015(ES6)で導入されたアロー関数とそのthisの挙動についてまとめます。アロー関数って？アロー関数は、ES6から導入された通常の関数(function)を代替する構文です。 /…

2020-03-25

ReactのためのJavaScript – スコープと変数宣言(var/let/const)

JavaScript React

はじめに Reactを学ぶためのモダンなJavaScriptについてまとめます。この記事では、ECMScript2015(ES6)から導入された新たなスコープについて、そして変数宣言(var/let/const)についてまとめていきます。スコープスコープとは、変数の有効範囲を定義した…

2020-03-25

ReactのためのJavaScript - はじめに

JavaScript React

Reactを書籍やチュートリアルで勉強していると、見慣れないJavaScriptの記法をちらほら見かけました。調べてみると、それらはES6以降に導入されたものでした。この記事では、Reactで用いられるES6以降の仕様についてまとめていきます。 React開発で使われる…

2020-03-25

ネットワーク - gRPCについて

Network

はじめに gRPCについてちょっと調べたのでメモる。 gRPCさくっと概要 gRPCとは、RPC(Remote Procedure Call)を実現するためにGoogleにより開発されたプロトコル。そもそもRPCってなんでしょう？ RPCとは RPC( = リモートプロシージャコール)とは、プログラム…

2020-02-28

Mac - chromeでページ全体をスクショする

Mac tips

chromeでページ全体をスクショする方法メモ。デベロッパーツールを開く( command + option + i )command + shift + p ( 検索窓が開く )fullと入力しEnter ( Screenshot Caputure full size screenshot を選択 ) こうするとページ全体の画像が撮れます。

2020-02-27

AWS - NATを構築する

AWS Network

AWSでNATを構成するには、以下の2通りの方法がある。 NATインスタンスNATゲートウェイ 1. NATインスタンス NATソフトウェアがプリインストールされたAMI ( Amazon Machine Image )から起動したEC2インスタンスを用いる方法。 EC2インスタンスなので、停止が…

2020-02-27

ネットワーク - NATとは？

Network

はじめに今回は、NATについて学んでのでメモりたいと思います。 NATって？ Network Address Translationの略で、プライベートIPをパブリックIPに、またその逆を行う仕組みのことです。これを用いると、例えばプライベートなネットワークに置かれたホスト(…

2020-01-27

Mac - 外部ディスプレイが認識されない

Mac tips

自分メモ macが外付けディスプレイを認識してくれない時の対処法ケーブルをつけたままmacをスリープ状態にしばらく放置(3分くらい)スリープ解除以上でディスプレイを認識してくれる。

2019-12-02

PHP - cssのキャッシュを無効化

PHP tips

はじめに PHPでWebアプリを開発していて、CSSがキャッシュされてしまい変更の確認のたびにキャッシュクリアするのはいかがなものか、、と思い調べるといい方法があったのでメモ。問題 cssがブラウザにキャッシュされてしまい、cssの変更が確認しにくい。。 …

2019-11-24

PHP - MySQL接続で”Unknown database xxx"と怒られる

PHP

はじめに最近PHPを勉強していて、db接続周りで小ハマりしたのでその原因と解決をメモ。現象 PHPでMySQLに接続したく、PDOを用いて↓のようなコードを書いた。データベースhogeにユーザhostman, パスワードpasswordで接続したい。 $dsn = "mysql:dbname=hoge…