React 16 Essentials - Second Edition

Creating a Collection component

You might recall that our topmost hierarchy Application component has two child components: Stream and Collection.

So far, we've discussed and implemented our Stream component and its child components. Next, we're going to focus on our Collection component.

Create the ~/snapterest/source/components/Collection.js file:

import React, { Component } from 'react'; import ReactDOMServer from 'react-dom/server'; import CollectionControls from './CollectionControls'; import TweetList from './TweetList'; import Header from './Header'; class Collection extends Component { createHtmlMarkupStringOfTweetList = () => { const { tweets } = this.props; const htmlString = ReactDOMServer.renderToStaticMarkup( <TweetList tweets={tweets} ...