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.
  

  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, and 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...