React奮闘記①

メロスと同じくReactがわからぬ。

チュートリアルと、ドットインストールは写経してみたものの、雰囲気しかわからなかった。。。

バスケットをやっているのをルール知らないで外から見ていて、「どうやらあのかごをボールが通ると点数が入るらしい」「なんか移動するときはぼーるをばうんどさせなきゃいけないらしい」くらいにしかつかめなかった。

そもそものJavaScriptが怪しかったので、progateで一通りサクッと復習しといた。

からの、

作りながら学ぶ React入門

これだ。

環境構築する。

Mac
High Sierra
10.13.5

一応もう環境はできているはずだが、改めて。

Node.jsのinstall

$ node -v
v10.5.0

→OK。すでにあった。

npmのinstall

$ npm -v
6.1.0

→OK。すでにあった。

init

# 作業用ディレクトリにて
$ npm init -y

npmパッケージinstall

npm install react react-dom
npm install webpack webpack-cli webpack-dev-server --save-dev
npm install babel-cli babel-loader babel-preset-env babel-preset-react --save-dev
npm install eslint eslint-loader eslint-plugin-react --save-dev
npm install css-loader style-loader babel-loader --save-dev

あとは別途設定ファイルを設定。 詳しくは

react_book/install_mac.md at master · yuumi3/react_book · GitHub

より。

webpackとは、、、JavaScript、cssとかのライブラリ、自分で書いたやつをまとめて一つのJSファイルにしてくれるやつ…!!? . . . 2,3時間かけて、

ようやくJSXの基本的なことはわかったような気がする。

コンポーネント - クラスコンポーネントと - 関数コンポーネントがある。

関数コンポーネントはあまり複雑なことはやらせない。

tigでvimじゃなく謎エディタnanoが開いてしまう現象解消

友人に進められシェルを魔改造zshにしたのが原因でtig(やってないけどgit commitコマンドも)のコミットメッセージ編集のところがmac標準搭載らしい謎エディタnanoになってしまっていた。

うまく保存できずにキャッシュファイル的なやつができてaddとかができなくなったりしてしまって面倒くさいので修正。

これを解消するには

git config --global core.editor 'vim -c "set fenc=utf-8"'

これだけ。