差分

このページの2つのバージョン間の差分を表示します。

この比較画面にリンクする

--- blog:2020:1206_pure_react [2020/12/12 10:32]
kijima [Hello world]
+++ blog:2020:1206_pure_react [2020/12/30 00:27] (現在)
kijima
@@ 行 1: / 行 1: @@
-{{tag>book 進行中}}
+{{tag>book}}
 ====== Pure React ======
-15 26 36 50
+15 26 36 50 60 141 150 207
 Reactはいくつものライブラリを同時に使う。
@@ 行 17: / 行 17: @@
 JSXはhtmlライクな文法？で、jsに変換される。DOMエレメントを作る。変換するために使うのがbabel。
+===== Tweet =====
 無名関数だとreturnや{}を省略できる。記法が用意されてる。arrow function
 letはmutable、varはimmutable
+すげえ…一気にできていく…。
+===== Props =====
+htmlエレメントはattributesを持つ。Reactコンポーネントはprops(=properties)を持つ。違う名前だが本質的に同じもの。
+関数が引数を持つとき、コンポートネントはpropsを持つ。
+===== Tweet With Props =====
+すごいな出来た…。
+演習で便箋も作れた。クレカもやりたかったが時間ないのでスキップ。
+childrenの説明がよくわからず。エクササイズも飛ばす。
+===== GitHubのファイルリスト =====
+GitHubのファイルリストを作る。childrenのことがなんとなくわかる。
+===== clickカウンタ =====
+はじめて状態を保存するやつだがあまりよくわかってない。
+演習ぜんぜんわからん。ヒントなさすぎでは…。
+演習3未
+===== 外からの状態変化 =====
+Accrodion自体は自身がisOpenか知る必要がない。外の状態によって変化する…。
+自動リロード
+<code>npm install -g nodemon</code>
+<code>npm install -g livereload</code>
+package.jsonのscriptに追加。
+<code>"live": "nodemon src/index.js"</code>
+<code>npm start</code>
+<code>livereload . -w 1000 -d</code>
+ブラウザのlivereloadボタンを押す。
+[[https://www.it-swarm-ja.tech/ja/node.js/nodejs%E3%82%B5%E3%83%BC%E3%83%90%E3%83%BC%E3%81%AB%E3%83%A9%E3%82%A4%E3%83%96%E3%83%AA%E3%83%AD%E3%83%BC%E3%83%89%E3%82%92%E8%BF%BD%E5%8A%A0%E3%81%99%E3%82%8B%E3%81%AB%E3%81%AF%E3%81%A9%E3%81%86%E3%81%99%E3%82%8C%E3%81%B0%E3%82%88%E3%81%84%E3%81%A7%E3%81%99%E3%81%8B/832890753/|node.js — nodejsサーバーにライブリロードを追加するにはどうすればよいですか]]
+===== 状態保存 =====
+reducerを使う。Reduxはグローバルな状態保存＋コンテキストで、また使いどころが違う…らしい。
+の演習問題。
+の演習問題。

blog/2020/1206_pure_react.1607736769.txt.gz · 最終更新: 2020/12/12 10:32 by kijima