{"componentChunkName":"component---src-components-page-template-js","path":"/3","result":{"data":{"allMarkdownRemark":{"nodes":[{"html":"<p>Week #4 of #100DaysOfCode!</p>\n<p>I spent the morning helping a friend smooth-out some CSS woes on one of his project sites. I know plenty of people who shudder at the thought of complex CSS, but honestly, CSS is one of my favorite things to get lost in — I always ending up having a blast with it, whether vanilla CSS or a framework like Bootstrap or Tailwind. Anybody else feel the same?</p>\n<p>After helping out, I shifted my attention back to my Twitch.tv clone again. Refamiliarized myself with the basic conventions of REST-ful API servers with some Medium articles, then dove into a full day of writing code.</p>\n<p>Below are some of the highlights from today:</p>\n<ul>\n<li>Creating a stream via an Action Creator</li>\n<li>Setting up an API server using json-server</li>\n<li>Using Redux's connect function with Redux Form</li>\n<li>Creating a stream with REST conventions</li>\n<li>Dispatching Actions after stream creation</li>\n<li>Key Interpolation Syntax</li>\n<li>Handling fetching, creating, updating, merging, and deleting from inside Redux</li>\n<li>Associating streams with users</li>\n<li>Intentional Navigation vs Programmatic Navigation</li>\n<li>Creating your own Browser History object</li>\n<li>Component Isolation with React Router</li>\n</ul>\n<p>View the current live version <a href=\"https://tcs-simple-twitch-clone.netlify.app/\" target=\"_blank\">here</a>.</p>\n<p>Tomorrow, the plan is to start working on React Portals + getting some actual video streaming!</p>","frontmatter":{"day":"28","title":"RESTful React Apps","publishDate":"2021-03-08","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABdUlEQVQoz41STS8DURTtL2FtQyKRTmtmiCBhhZ2NFXubLrAQEbGREFoLbfqxnDcfdEhpVIkq0iYqRTeSdqakreA3HDN9U21kErM4mfvm3XveOec9ly7y+AvNBOGseghlQmHWurWn2cyZcNkStsjMQcGDL9mNb4Vp1p17zgktVEUOlcQctqQwNoQIXk8XjH8mGe9c4a8dQ42uzmA6coHuvSd07RYxFsqgfDKLqsA07duptFVYEYfRIANIHK2Ai76gdz8HJpgHGy1BUNbxaURgZupMoXUR74RBQZ2H159Cz/YV+gL36A+WcKcuokbcxqEOCXXLskYG8SF5EBd9mNiJYSRwDHK4iYbMGnF4aSxOLNNGFpo8ivzZEh5Tq8hlw3hOr6GY9OEhuQxNGac9Ti3rhrqyMonYdRYHmQLkbBq3l36EUueQbtLQ4lNtlf9fCtd8FqadusyhofCoSSzeJLquS14aC6G9Dp5Nm7RiDFLwHetWT/vbiR8zvWaPONPkLQAAAABJRU5ErkJggg==","aspectRatio":1.7857142857142858,"src":"/static/db07651ebc8651c60ddf07a10213c699/3891b/day-28.png","srcSet":"/static/db07651ebc8651c60ddf07a10213c699/3ba9f/day-28.png 100w,\n/static/db07651ebc8651c60ddf07a10213c699/8ac63/day-28.png 200w,\n/static/db07651ebc8651c60ddf07a10213c699/3891b/day-28.png 400w,\n/static/db07651ebc8651c60ddf07a10213c699/8c332/day-28.png 600w,\n/static/db07651ebc8651c60ddf07a10213c699/bc8e0/day-28.png 800w,\n/static/db07651ebc8651c60ddf07a10213c699/54311/day-28.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>Happy Sunday! Today kicked-off with some reading about Redux and then I spent a little time setting up + refamiliarizing myself with Advanced Redux Dev Tools.</p>\n<p>PSA: If anyone else is trying to play around with Redux's DevTools, Airbnb has their Redux Store Data publicly available. Just go to airbnb.com, open your Redux DevTools, and start exploring!</p>\n<p>After I finished playing with those new toys, I shifted focus to Redux Forms.. Highlights are below!</p>\n<ul>\n<li>Installed + connected Redux Forms</li>\n<li>Customized form fields</li>\n<li>Added form validation</li>\n<li>Integrated error handling and visual error cues on form fields</li>\n</ul>\n<p>View the current live version <a href=\"https://tcs-simple-twitch-clone.netlify.app/\" target=\"_blank\">here</a>.</p>\n<p>Tomorrow, we shift focus to building out the REST-based functions of this React app.</p>","frontmatter":{"day":"27","title":"Redux Forms","publishDate":"2021-03-07","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABIklEQVQoz2N4URP7n5qYAV3gORS/qI4B089q4oA4FpVdDVIbA6UJGAgyCGbY66rI/58qQ/+/rY78/6oy8v9HIPtjdQSSYTHEu/BVdfT/Gy05/7d1Nv4/X5f9/05rzv/dHbX/99QW/X9GigtBhj2tif//qTz4/+x5i//3Tpv3v7Ju0v/yZbv+N05f9n9aTcP/p6QaCFL4qib6f8vavf97J8/9n9s293/O5jP/W6Yu+n+hJuP/u+oocFgS7WWQ4rdVEf+nL1z+v33O8v/eM/b/r1yz//+V5pz/r6qiIJFGSqSANLwEhuG9uuT/53vK/29rrPh/tC7v/4vaOLg8NsNwuhCmCRQxrysj/n+oCgfHNEwcTpOTDp+D0x4iLeIzDLuXKcQA6bBclHCE72UAAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/be250aeea035a122caea48ff2f34189a/3891b/day-27.png","srcSet":"/static/be250aeea035a122caea48ff2f34189a/3ba9f/day-27.png 100w,\n/static/be250aeea035a122caea48ff2f34189a/8ac63/day-27.png 200w,\n/static/be250aeea035a122caea48ff2f34189a/3891b/day-27.png 400w,\n/static/be250aeea035a122caea48ff2f34189a/8c332/day-27.png 600w,\n/static/be250aeea035a122caea48ff2f34189a/bc8e0/day-27.png 800w,\n/static/be250aeea035a122caea48ff2f34189a/54311/day-27.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>OAuth Authorization was the flavor of the day today!</p>\n<p>Did some early-morning reading about the differences between OAuth for Servers and OAuth for JS Browser Apps. After installing a basic OAuth implementation, I then integrated Redux on top.</p>\n<p>It's only the basic scaffoling + OAuth at the moment, but if you're interested, you can check out my Twitch.ty app <a href=\"https://tcs-simple-twitch-clone.netlify.app/\" target=\"_blank\">here</a>.</p>\n<p>A few highlights from today:</p>\n<ul>\n<li>Creating OAuth credentials</li>\n<li>Wiring up the Google API Library</li>\n<li>Updating authorization state</li>\n<li>Handling Auth Status through Redux</li>\n<li>Practice with Redux Dev Tools</li>\n</ul>\n<p>Tomorrow, we're gonna try to tackle Redux Forms!</p>","frontmatter":{"day":"26","title":"OAuth + React","publishDate":"2021-03-06","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABZ0lEQVQoz5VSTUsCURSdlZD2RYuKbBmBQejMe2ajjh+1KGnUWrTqJxgkGDGVmPaTgnYSRtBsghYua1HUNmgZaJ7uPPOTicbF5Qxnzjvv3HevxC+AgSq1wAiZ+P6GQihXgECZ8JezdKzU1g6fl4YJ1hERKmSiGm9I5q6wdXQN7fxdcKxr6sCQd5JRqkT+Fju6Dk2VsSavIJXaRvTwBvzS0jRhd1ayNSNUix/wKyFMT7qhZ3aRzu5h3O2Cb5XTv0+h6bT/j2FTpNss3GNmyoPZuXmYpol6vY4F7yJdMIZ4/g7KHyltDWV6p42TR5GOBUOoVquo1WoIRzRMeFxIHD+ISx0a0jBogmqlATmahm/JC4UF4Q8o4P5lsFgW6+WG0PCRhkIpw8YLMgcFaJEQkvEIUvs5xM5eB9bHUULWZ8pLDcROn6EZT2DFr67ZiHvYM7XQelOxf32c0DhtWQi7SVvt9kT1ODszq34AQu4vrq7ym34AAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/c32785cacf5d084e7c55afe7e1e7ab59/3891b/day-26.png","srcSet":"/static/c32785cacf5d084e7c55afe7e1e7ab59/3ba9f/day-26.png 100w,\n/static/c32785cacf5d084e7c55afe7e1e7ab59/8ac63/day-26.png 200w,\n/static/c32785cacf5d084e7c55afe7e1e7ab59/3891b/day-26.png 400w,\n/static/c32785cacf5d084e7c55afe7e1e7ab59/8c332/day-26.png 600w,\n/static/c32785cacf5d084e7c55afe7e1e7ab59/bc8e0/day-26.png 800w,\n/static/c32785cacf5d084e7c55afe7e1e7ab59/54311/day-26.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>1/4 of the way through my first #100DaysOfCode challenge — dang time flies when you're learning!</p>\n<p>I've had this plan on the backburner for a bit now, but am finally making time to tackle... A Twitch.tv clone!</p>\n<p>As a mega-nerd and lover of all things gaming and tech-related, this has been a planned side-project for awhile, and has a certain symbolism to it...</p>\n<p>It'll just be a simple-ish clone, but I'm excited to build nonetheless! The plan is to use Open Broadcaster Software to supply the video feed, build a basic Real Time Message Protocol Server, a simple server to track which streams are broadcasting, and a user interface for viewing those streams.</p>\n<p>Kicked things off on the client-side by laying the framework with React and Redux. Scaffolded components + wired-up initial routing. Added a basic Header and styling.</p>\n<p>Here are some challenges I anticipate running into along the way:</p>\n<ul>\n<li>Need to be able to navigate around to separate pages in the app (Hello, React-Router)</li>\n<li>Need to allow a user to login/logout (Google OAuth practice, probably)</li>\n<li>Need to handle forms in Redux (Let's Learn Redux Form)</li>\n<li>Need to master my CRUD operations in React/Redux</li>\n</ul>\n<p>Tomorrow, we move on to authorization using OAuth.</p>","frontmatter":{"day":"25","title":"Twitch.TY Livestream Clone","publishDate":"2021-03-05","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABb0lEQVQoz42S20sCQRTG/X9WN8iKekiIkqzHyPVWoSlqLZGYWpD5EEJB0O1Bu4iQqHtRXCkyEKIIgqgg6rmX/pKvndWFLruyDx8znPnOb845M6Y+3ou/ojmPvMrivDDzLpgbzo7kPYmRs47nf66pJ6zGYKQSgmN/XdYGhstBJdYLatK6RYU5zhNIherIuFvIuFpIsxKmCglQogo1UCExWjg3hgQ/YoscmrkPHKVvsZdso7zzgkREwCDvVzxaUA2gD1TNCftJHCmnBKn4hi3/FbbD1zjNPiA5K8Gejyse4jVUIWlpvLCKtZkGHtufyC7f4HjzDqWDJ6xMi7AXY7ptawLJsK31OUTYAsTdd7zef6F8+Izk5CWC4TMMNOZhqXqMAWn1hQUXRqsRLERziDEiAhMlBNg8bHwUVPf7KF5DFXahJNHa9MF2sYSxCot+SZ4vz/zyGP42agItt0YJjCK626YeTB/4Y5bqXgUoMR0Y0TcHRPHm8o1RAQAAAABJRU5ErkJggg==","aspectRatio":1.7857142857142858,"src":"/static/4aee9a2c450fd5375633c9e04a587471/3891b/day-25.png","srcSet":"/static/4aee9a2c450fd5375633c9e04a587471/3ba9f/day-25.png 100w,\n/static/4aee9a2c450fd5375633c9e04a587471/8ac63/day-25.png 200w,\n/static/4aee9a2c450fd5375633c9e04a587471/3891b/day-25.png 400w,\n/static/4aee9a2c450fd5375633c9e04a587471/8c332/day-25.png 600w,\n/static/4aee9a2c450fd5375633c9e04a587471/bc8e0/day-25.png 800w,\n/static/4aee9a2c450fd5375633c9e04a587471/54311/day-25.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>Shifted game plans just a little today...</p>\n<p>I was originally planning on jumping into React Router, but a week straight of working with Redux has my brain feeling fried.. So I played around with customizing some features in a custom Shopify store!</p>\n<p>A couple things I worked on:</p>\n<ul>\n<li>Custom components that can be edited from the Shopify frontend CMS</li>\n<li>Working with grids and building some columned sections</li>\n<li>Sticky headers!</li>\n<li>Hover effects for images</li>\n</ul>\n<p>Tomorrow we circle back to React!</p>","frontmatter":{"day":"24","title":"Shopify Customization","publishDate":"2021-03-04","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAAA+UlEQVQoz2PYa1z0n5qYAZfEHuNCMN5rhGDvMULIkWwgGEMN22tY9H+ffhHcgr1G5LjQCOpCoEHb7XL+b3PN/b/XAMnlpBi4xxjhmp2mef+3bq383z0r5P8Ww7z/+4yLoYaS4kKQ60yA3tQr+r8L6Lr9Z7v+1y/0+b/OJP3/AbjXC0l0IchQ85L/GzzL/28MyPu/NCL3//qQmv97rcr+7zEk0YUgxfv0Cv5v8qn6P6mo4f/03Kb//Zm1/6dXt//f7FkJjKAC0g0EeWm3WfH//dbl/3faA11lV/5/jy0Qm0KDhOQwhNGGBcDYRcJIciS7cA88xlExPhcCAH0tDW9FbGvpAAAAAElFTkSuQmCC","aspectRatio":1.7857142857142858,"src":"/static/cf72bfc5531e10d58cbdc43d6e58441c/3891b/day-24.png","srcSet":"/static/cf72bfc5531e10d58cbdc43d6e58441c/3ba9f/day-24.png 100w,\n/static/cf72bfc5531e10d58cbdc43d6e58441c/8ac63/day-24.png 200w,\n/static/cf72bfc5531e10d58cbdc43d6e58441c/3891b/day-24.png 400w,\n/static/cf72bfc5531e10d58cbdc43d6e58441c/8c332/day-24.png 600w,\n/static/cf72bfc5531e10d58cbdc43d6e58441c/bc8e0/day-24.png 800w,\n/static/cf72bfc5531e10d58cbdc43d6e58441c/54311/day-24.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>Led today with some more early-morning Liquid lessons! I've built a couple (simple) Shopify storefronts in the past, but diving into the depths of customization has been a ton of fun.</p>\n<p>After that, I returned focus to my simple Redux blog project I've been building for a couple days now.</p>\n<p>Some topics from today's learning include:</p>\n<ul>\n<li>Pure Reducers</li>\n<li>Edge cases re: mutating a Reducer's input state argument</li>\n<li>Safe State Updates in Reducers</li>\n<li>Equality of Arrays and Objects</li>\n<li>Switch Statements in Reducers</li>\n<li>Dispatching correct values</li>\n<li>Extracting logic to mapStateToProps</li>\n<li>Memoizing Functions</li>\n<li>Action Creators inside of Action Creators!</li>\n</ul>\n<p>Tomorrow we move onto React Router and maybe mess with some authentication.</p>","frontmatter":{"day":"23","title":"Redux Store Design","publishDate":"2021-03-03","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABQElEQVQoz62S3VLCMBCFeXkvvASlpICjFUFGYZz+h4iKaBGUaWmVAPVhjikErRaFCy92NpPNfnNOdnOdMsd/Ru7nBVWnoMvzdHlOcjqomq5tAX7CVNlQmcElXMQMTolnYFTNgnNp2FoBFZlVOOzDAA/1AKHl4aU9FPehbJxmwL8olI/JHFZ+jOZ+Hz0tQGR4CPQn2MoYZmECqghYKQvLKKQSZmgetKsTmKwBx7hEu9qDVRS1I6Gc+bgdhGAXrxuhWcvFOXT9GhY/xWCUx/BxD27nTKiLQasx2N0E3ZGPTiuCq2y1vCo4JIJ+7KFGbGgFBybxcd900G/VYCo9GPlwN8vpzMhC/NUM1kEk1EW4qdvoNs6F7Wew8mLHoSR/KKdM5SSTaSer5JZiEe+ieb6qq/xvhZusr/fsa8Hfvi33pt4PWBO0UeYFWRAAAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/171cbec01516771f7f47d69aff584040/3891b/day-23.png","srcSet":"/static/171cbec01516771f7f47d69aff584040/3ba9f/day-23.png 100w,\n/static/171cbec01516771f7f47d69aff584040/8ac63/day-23.png 200w,\n/static/171cbec01516771f7f47d69aff584040/3891b/day-23.png 400w,\n/static/171cbec01516771f7f47d69aff584040/8c332/day-23.png 600w,\n/static/171cbec01516771f7f47d69aff584040/bc8e0/day-23.png 800w,\n/static/171cbec01516771f7f47d69aff584040/54311/day-23.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>Keeping the Redux train rolling today! I spent my morning today doing a take-home technical interview and the afternoon learning about Asynchronous Actions with Redux Thunk!</p>\n<p>Here are the highlights:</p>\n<ul>\n<li>Redux Thunk and why we need it...</li>\n<li>Tricking Redux with Dummy Reducers</li>\n<li>Fetching data in a Redux App</li>\n<li>Making requests from an action creator</li>\n<li>Understanding (deeply) async action creators</li>\n<li>Middlewares in Redux</li>\n<li>Shortened Syntax with Redux Thunk</li>\n</ul>","frontmatter":{"day":"22","title":"Async Actions with Redux Thunk!","publishDate":"2021-03-02","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABVUlEQVQoz41Ty07CQBTlw1yIMSEy5dF2pnQGiihC1PDYyEJN1IWJKxMTjFv/wRhDTFzqR+gPsGRrUY93WmpsqcLi5Mzt49wz98xkPoXCb3xwGSC5XvQuQiYpFrFPmNI6BK11zVXAfkI4VTDWmRiiCtguQDW4rjXcGVfpO5UqOucwECMelS30HYkj4lfu4s1ycVJw0TUYHugZhIyJzjsU4Va0gxdLICs95AZnWO0fwnMlevk61lkbBbaPXL6BZ1MFoj7/w2E0Ny04NG2sdQaQl7fg59cwt1vYM5pwWAfKaGGD7eKm1AxGsIRgFfe0pZVGG8XjC+QOTmHWNtFgFrnrQbAusvkt3JVF0NxPpJ2ask51aDtwKgo1WccjNXgqc+yQO49wVSzhnea6dMpfs2DGNMuJXZklqzAhkTE1iuqlUo54KtTPj+EZlLF64TlMFU25Kf+JaXwDYTMy/j8RHAgAAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/b0452eade689f9ced59f41648082dca4/3891b/day-22.png","srcSet":"/static/b0452eade689f9ced59f41648082dca4/3ba9f/day-22.png 100w,\n/static/b0452eade689f9ced59f41648082dca4/8ac63/day-22.png 200w,\n/static/b0452eade689f9ced59f41648082dca4/3891b/day-22.png 400w,\n/static/b0452eade689f9ced59f41648082dca4/8c332/day-22.png 600w,\n/static/b0452eade689f9ced59f41648082dca4/bc8e0/day-22.png 800w,\n/static/b0452eade689f9ced59f41648082dca4/54311/day-22.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>Started my Monday off with some learning focused on Liquid, Shopify's templating language. I was really surprised how much it had in common with Ruby!</p>\n<p>Here's what I learned about Liquid in Action:</p>\n<ul>\n<li>First, a user requests a URL of a Shopify store</li>\n<li>Then, Shopify works out which store is being requested</li>\n<li>Then, Shopify selects the required Liquid template from the active theme directory</li>\n<li>After that, the Liquid placeholders are replaced with real data stored on Shopify</li>\n<li>The compiled HTML file is then sent to the browser</li>\n<li>And finally, the browser processes the HTML file and fetches all other required assets (images, JS, CSS, etc.)</li>\n</ul>\n<p>After my early-morning lessons in Liquid, my attention shifted back to Redux. Today was all about integrating React with Redux, so I wrote a simple song selector app where you can click on a song from a list and have a Display component automatically update to display the information related to that selected song.</p>\n<p>This simple build gave me an excuse to become more familiar with:</p>\n<ul>\n<li>Planning a Redux Project</li>\n<li>Named vs Default Exports</li>\n<li>Building reducers</li>\n<li>Wiring up Providers</li>\n<li>The Connect Function</li>\n<li>Configuring Connect with MapStateToProps</li>\n<li>Building a list with Redux data</li>\n</ul>","frontmatter":{"day":"21","title":"Liquid and Redux Learnin' ","publishDate":"2021-03-01","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABT0lEQVQoz4VS20rDQBDNDwv+gU/+hm+F6g9UFLF9sEQDitLalKaoCE3S0ubWvSQRTnfTZHNpgoHDTPZMJnPmrBYzigyUQOUVpJwJjoILPo0ZkqyWttbKc001Ug1JliecghGCtbuF4xwhc3lWq69GAa1IeE7wyrvjbEAoQ/FQkTv2RtWo7yrQTscmmUzfCxAEe0RRAteNYNsRPI8jDImIQb4KUl+VktyYMBVyvZ2PhbXCYDBBr2fgum/g/m4Ka7kSXNnw+F3ZQ+2wIFTDrY/R6APj8QS6PsWzYeLpxcRw+I6d4GRNp+SkMKMyuoyz2Q8eH94w1Oewrvp4vbnFp2U3ZJam8C5TeO4y2e+xXPzCmK+wvrgEOztHGISCY3UTT1xuSC6XTbLpKWOgpon4+wsxp/+7nLTcp+oVSmT8S484kVuakjWU47chbZ7lP+6qL3AALcpJxuBqD4QAAAAASUVORK5CYII=","aspectRatio":1.7857142857142858,"src":"/static/204732acbfa12aee3579d46081bd14e2/3891b/day-21.png","srcSet":"/static/204732acbfa12aee3579d46081bd14e2/3ba9f/day-21.png 100w,\n/static/204732acbfa12aee3579d46081bd14e2/8ac63/day-21.png 200w,\n/static/204732acbfa12aee3579d46081bd14e2/3891b/day-21.png 400w,\n/static/204732acbfa12aee3579d46081bd14e2/8c332/day-21.png 600w,\n/static/204732acbfa12aee3579d46081bd14e2/bc8e0/day-21.png 800w,\n/static/204732acbfa12aee3579d46081bd14e2/54311/day-21.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}},{"html":"<p>Feeling really solid about my React fundamentals, so today we step it up a notch with Redux!</p>\n<p>I've used Redux for state management in a couple of my more complicated projects, but it's still felt relatively convoluted to implement, so I'm dedicated to becoming more comfortable with the fundamentals of Redux. Today I'm kicking off some deep dives, starting with gaining a more comprehensive understanding of the Redux Cycle.</p>\n<p>Here's what I worked on along the way:</p>\n<ul>\n<li>Modeling with Redux</li>\n<li>Building Action Creators</li>\n<li>Creating Reducers</li>\n<li>Rules of Reducers</li>\n</ul>","frontmatter":{"day":"20","title":"Redux Fundamentals","publishDate":"2021-02-28","thumbnailImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABUUlEQVQoz62RzUsCURTF5/8LRNsVCS3aVsSMM5P2hUZOSpAQtGhnCIZUi6A2LaohxBI/sskiJSg3iZWaFbQ5vfdmJscZIQgXP969j8e5553LNUs+DBLOLN6udJolwVH/W9AUaF0LDF1YwCtBfyP8YvZ9Be1iz5cy6lmZ3XVuRMZLkQgT2poxpNgrbNaGw65YIy+isB9G+ShIeh+q6iSqZ1P4rsj4vJVQy8ygUxbxdSfhg5x2l5w1Pyr4cLKAi2QE6UQUNTWIWMgD//QQEhuj2Nkcw7LkwmF8HHtbXpymJvCuiU6HXXcScrsKMskosikF2sEqtmNerMy6EPa7sbY4jMi8B0rAjZDoQnx9hLm2fp+zb/hRncP98RIqhKfzgBEHGVbQl9PI86jneNLzTIhiXVBPhvSkTtsaz6A1vaNvWpacaLbW3pqjY8tOhD/p43Bw/AAnwbQBu6SW3wAAAABJRU5ErkJggg==","aspectRatio":1.7857142857142858,"src":"/static/57da8976fca9f9aaac071d83be361bed/3891b/day-20.png","srcSet":"/static/57da8976fca9f9aaac071d83be361bed/3ba9f/day-20.png 100w,\n/static/57da8976fca9f9aaac071d83be361bed/8ac63/day-20.png 200w,\n/static/57da8976fca9f9aaac071d83be361bed/3891b/day-20.png 400w,\n/static/57da8976fca9f9aaac071d83be361bed/8c332/day-20.png 600w,\n/static/57da8976fca9f9aaac071d83be361bed/bc8e0/day-20.png 800w,\n/static/57da8976fca9f9aaac071d83be361bed/54311/day-20.png 1280w","sizes":"(max-width: 400px) 100vw, 400px"}}}}}]},"site":{"siteMetadata":{"title":"Tyler's 100 Days of Code"}}},"pageContext":{"limit":9,"skip":18,"numPages":6,"currentPage":3,"pagePath":"/3"}},"staticQueryHashes":["1307492417","63159454"]}