はじめに React.jsとReduxを理解するために簡単な電卓アプリを作成しました。 今回はWelcome to Reactから始まり、実際にReact/Reduxで電卓アプリを作るまでの手順を説明したいと思います。 特にReduxのデータフローについては言葉や図だけではよくわからないと思うので、電卓アプリを実際に作成することで少しでも理解の助けになればいいなと思っております。 今回の記事では実装がメインとなっているため、React.jsやReduxの概念などについては省略しております。基礎的な部分を理解したい方は「Reduxの電卓アプリで学ぶReact/Redux入門(基礎知識編)」を読んでからこちらの記事を読むと理解がしやすいかと思います。 電卓アプリはcreate-react-appをベースに作成し、簡単のために加算の機能のみ作ります。 create-react-appについて ま
![電卓アプリで学ぶReact/Redux入門(実装編) - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/6dacf382128f078d4cafeb7ab38e9420b9facd8f/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JUU5JTlCJUJCJUU1JThEJTkzJUUzJTgyJUEyJUUzJTgzJTk3JUUzJTgzJUFBJUUzJTgxJUE3JUU1JUFEJUE2JUUzJTgxJUI2UmVhY3QlMkZSZWR1eCVFNSU4NSVBNSVFOSU5NiU4MCUyOCVFNSVBRSU5RiVFOCVBMyU4NSVFNyVCNyVBOCUyOSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9YzE0MzJiMGVlYjZjYWM3NmEwY2I2ZjE3ZTE1ZmQxNzU%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwbmlzaGluYTU1NSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9NzI4YzUxNzIxM2EyMDRmYjJkM2JjMzkxMDM2ZjkwMzU%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3Dd4c7d4cce55f07d79be47d440263f360)