Decomposition
Explore how to decompose React components written in Python using Transcrypt by moving components into separate modules, handling props and state updates, and maintaining clear data flow. This lesson helps you organize front-end application structure for better scalability and maintainability.
We'll cover the following...
Shifting ListItems into another file
Up till this point, we have been using one module, or one React component, to hold our entire application. Even the ListItem and ListItems components currently have inner functions of our main App component. While there is nothing technically wrong with this, and it affords some conveniences from a scoping standpoint, as our application grows it will get more unwieldy with the more functionality we add to it.
As a simple example of how to physically break up a component once it grows too much, let’s extract the ListItems component from the App component ...