Layout components

Normally, you can use stateless components for layout components, such as headers, content, or footers, since you just need to render static markup.

Let's create a new application with create-react-app. If you run your project with npm start you will see something like this:

If you open the file located in src/App.js you will see this code:

  import React, { Component } from 'react';  import logo from './logo.svg';  import './App.css';  class App extends Component {    render() {      return (        <div className="App">          <header className="App-header">            <img src={logo} className="App-logo" alt="logo" />            <p>              Edit <code>src/App.js</code> ...

Get React Design Patterns and Best Practices - Second Edition now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.