Day17 Redux についてちょっと調べる

【両OS対応】 React Nativeで爆速プロトタイプアプリを作ろう 2/3 【ホームタブ編】

【両OS対応】 React Nativeで爆速プロトタイプアプリを作ろう 2/3 【ホームタブ編】|川西発之 / 陳発暉|note ※※※※※本記事は2018年5月に執筆されました.当時の React Native の環境から変わっている部分もありますので,2020年5月より記事の値段を大幅値下げすると同時に,記事更新や質問等のサポートの対象外とさせて頂きます.m(_ _ )m1/3 【ウェルカム画面編】:799円 → 199円2/3 【ホームタブ編】:899円 → 299円3/3 【プラスボタン編】:999円 → 399円※※※※※
 note.mu

今日から Redux!ひたすらもくもく。ときどきメモ。
ところで Redux ってなに??

イメージとしては、データ保存場所が別で用意されており(正式名はStore)、どのページからもそこに保存されている共通データにアクセスできるという感じです。

ふーん?もう少し詳しく!

データの状態じゃなくてアプリケーションの状態って書いてあるところに???ってなっているところ。

Redux入門【ダイジェスト版】10分で理解するReduxの基礎

Redux入門【ダイジェスト版】10分で理解するReduxの基礎 - Qiita ReduxのGithubドキュメントを基に入門用記事として書いたものを、簡潔にまとめました。 もと記事はこちらです。 * [Redux入門 1日目 Reduxとは](http://qiita.com/kiita312/items/b...
 qiita.com

ちょうどこの記事の例がこれから作りたい ToDo 系の仕組みなので入ってきやすそう!
ということで読みながらメモ。

dispatch: 訳 送る
action dispatch store → Action を Store に dispatch(送る)

Reducer: 訳 (整理して)変える人

Reducer の例に使われているソースコードが state ごとに switch 文で制御してて、なんかクラス化したりとかしないのかなと思ったけど、React Native はオブジェクト指向ではないのかもしれない。(まだ調べてない)

Reduxの3原則

最後になりますが、Reduxの基本設計は以下の3つの原則に基づいて設計されています。上記のデータフローはこの原則に則っていることがよく分かると思います。

1. Single source of truthアプリケーション内でStoreは1つのみとし、Stateは単独のオブジェクトとしてStoreに保持される。

2. State is read-onlyStateを直接変更することはできず、actionをStoreへdispatchすることでしかStateは変更できない。

3. Mutations are written as pure functionsStateを変更する関数(Reducer)はpureな関数にする。

これが大事そう。

アプリケーションは、アプリ内部でこういうデータやデータの状態を保持する仕組みを持っているのはなんとなくわかりました。このデータをサーバーサイドに送ったり、サーバーサイドから送られたりする仕組みって、結構めんどくさそう。

Redux 入門の記事が全6回あったので、今のアプリサンプルの実装が終わったら座学で読もうと思う。

Redux入門 1日目 Reduxとは(公式ドキュメント和訳) - Qiita Redux初心者向けです。というか私が初心者です。 Reduxに触れてみようと思って、まずは公式のGithubのドキュメントでも読んでみるか、と自分へのメモも兼ねてざっくりとした和訳をして行きます。 [公式github](https:...
 qiita.com

もとにもどって note 記事。

ただ、この共通データ保存場所であるStoreにデータを保存するまでがまわりくどいのなんの……。

Redux による実装は結構大変っぽい印象を与えられたので、明日は法事で一日留守にするので勉強できないので、明後日からから本気出す笑

コメントする

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください