前回までで、Reduxチュートリアルの写経が終わりました。
でも、やっぱりまだ分かってなくて、というか実はReactだってまだまだ書けなくて、まとめて理解を深めるために、なんか作ります。
得意のスライドでも作ります。
今回はその第一弾。エントリーファイルを作成して、ビルドするところまでをやります。
環境準備
もろもろのセットアップをします。
とは言え、package.jsonとwebpack.config.jsを転用すればカンタンですね。必要なパッケージとビルド環境はひとまず整います。(前記事参照)
HTML作成
なんてことは無いですが、最初に作ります。
scriptタグで読み込んで言るbundle.jsは、Webpackによってバンドルされたエントリーファイルです。
Reactを採用しているので、今後このHTMLをいじることはないでしょう。
エントリーファイル作成
バンドルの起点となるJSファイルを作成します。
ひとまず以下のようになりました。
必要なパッケージをimportして、storeを作成して、render関数を実行しています。
コンポーネントとreducerを作成していないので、まだ抜けがあります。
バンドル
この状態でwebpackコマンドを実行すると、現時点でのバンドルファイルが作成されます。
ただし、ブラウザで確認するとこのとおり。
まだ中身は空っぽです。
というわけで、下準備が整いました。
次回はReactを書いてコンポーネントを作成します。