コンパイラかく語りき

import { Fun } from 'programming'

Redux

自分なりに順を追って、Reduxを理解する(9)

Reduxのお勉強。いよいよ大詰めです。 前回は、コンテナコンポーネントで作成したpropsを、プレゼンテーションコンポーネントで利用するように追記をしました。 chuckwebtips.hatenablog.com 今回はその中でも、ページ送りのクリックイベントについて見てい…

自分なりに順を追って、Reduxを理解する(8)

引き続きReduxの勉強です。 前回はreducerを書いたので、Reduxに必要な部品は全てそろいました。 chuckwebtips.hatenablog.com 今回は、コンテナコンポーネントでpropsに変換したstateや関数を、プレゼンテーションコンポーネントに組み込んでいきます。 Pag…

自分なりに順を追って、Reduxを理解する(7)

Reduxのお勉強です。 前回はactionと、コンテナコンポーネントを作成しました。 chuckwebtips.hatenablog.com 今回は、reducerという、stateとactionを受け取ってstateを更新する処理を書きます。 qiita.com 起点となるReducerの作成 まずは全てのreducerの…

自分なりに順を追って、Reduxを理解する(6)

引続きReduxのお勉強です。 前回は、ちょっと脇道に逸れて、Webpackとスタイルについて書きました。 chuckwebtips.hatenablog.com 今回こそ、Reduxのactionを書きます。 Stateの設定 そもそも、actionを決めるにはStateを決める必要があります。 ひとまず、…

ReduxチュートリアルをWebpackでビルド

Reduxをもっと頭に定着させるため、今一度チュートリアルを写経しました。 ちなみに前回は写経したはいいものの、Webpackでのビルドが通りませんでした。 chuckwebtips.hatenablog.com 結論から言うと、bebel-preset-reactというパッケージが足りていません…

自分なりに順を追って、Reduxを理解する(4)

Reduxのお勉強の4日目です。と言っても、まだまだReactの復習でしかありませんが。 前回は、AppコンポーネントにひもづくSlideコンポーネントとPageコンポーネントを作成しました。 chuckwebtips.hatenablog.com 今回はスライドのデータを用意して、Pageが…

自分なりに順を追って、Reduxを理解する(3)

Reduxのお勉強です。 前回はすべての親要素となるAppコンポーネントを作成しました。 chuckwebtips.hatenablog.com 今回は子要素を作成したいと思います。 今回作成するものはスライドです。スライドなので、各々のページと、それを格納するスライドの親子コ…

自分なりに順を追って、Reduxを理解する(2)

Redux練習記録です。 前回は基本的なセットアップを行いました。 chuckwebtips.hatenablog.com 今回からは実際にReactを書いていきます。 Reactの基本となる、コンポーネントを作成します。 コンポーネントディレクトリ Reduxを利用する場合のコンポーネント…

自分なりに順を追って、Reduxを理解する(1)

前回までで、Reduxチュートリアルの写経が終わりました。 chuckwebtips.hatenablog.com でも、やっぱりまだ分かってなくて、というか実はReactだってまだまだ書けなくて、まとめて理解を深めるために、なんか作ります。 得意のスライドでも作ります。 今回は…

Reduxチュートリアル終了

Reduxのチュートリアルを終えました。と言ってもただの写経でしたが。。 写経したコード↓ github.com Webpackでビルドを試みましたが、ダメでした。 何か漏れがありそうです。 というわけで、動かないけど、チュートリアルは消化しました。。 所感 大枠はつ…

いい加減、Redux入門する。

します。 手始めにQiitaのそれっぽいポストを読みます。この記事は、その勉強メモになります。 1日目 Reduxとは qiita.com 背景 Reactの登場によって、Reactに非同期とDOM操作を任せられるようになった。ただし、State(状態)の管理は開発者に委ねられてい…