Planning your React application
There are two simple guidelines we need to follow when planning your React application:
Each React component should represent a single user interface element in your web application. It should encapsulate the smallest element possible that can potentially be reused.
Multiple React components should be composed into a single React component. Ultimately, your entire user interface should be encapsulated in one React component.
![](https://static.packt-cdn.com/products/9781787126046/graphics/B05915_05_02.jpg)
Diagram of our React components hierarchy
We'll begin with our topmost React component, Application. It will encapsulate our entire React application, and it will have two child components: the Stream and Collection components. The Stream component will be responsible for connecting to a stream of tweets, receiving, and displaying the latest tweet. The Stream component will have two child components: StreamTweet and Header. The StreamTweet component will be responsible for displaying the latest tweet. It will be composed of the Header and...