App Academy: Week 8, Day 2
Today was our second day with React and our first day integrating React with Rails.
Rather than rending React elements with hard-coded props and state today, we instead built stores for each model in our Rails app from which React components could acquire state. Then, our topmost component could pass down props to its children based on that state, allowing our whole React frontend to dynamically reflect the state of our entire app.
To achieve this, we gave our stores a fetch method that would fetch all of the objects of its type from an API that we wrote for that type using a Rails controller. Furthermore, this fetch method would trigger a call to any "handle change" callbacks that our React components added to our store when those components mounted. In these callbacks, our components would update their state based on the new state of the store, thereby causing them to re-render if their state changed based on the newly acquired data in the store. In this way, we ensured that nothing would change in our store's data without that change being reflected in our components if that data is relevant to what those components should render.
In addition to these new concepts, I acquired a greater sense of familiarity and comfortability with React by building-up a more unified React app today.