containers/App/index.js
Now, let's create some of the user interfaces. We'll start by creating our main container—app. So, inside app/index.js, you'll see the following code:
const AppWrapper = styled.div`
max-width: calc(768px + 16px * 2);
margin: 0 auto;
display: flex;
min-height: 100%;
padding: 0 16px;
flex-direction: column;
.btn {
line-height: 0;
}
`;
// eslint-disable-next-line
class App extends Component {
render() {
return (
<AppWrapper>
<Header />
<Switch>
<Route exact path="/" component={HomePage} />
<Route exact path="/login" component={LoginPage} />
<Route exact path="/register" component={RegisterPage} />
<Route exact path="/about" component={AboutPage} />
<Route exact path="/contact" component={ContactPage} />
<Route path="" component={NotFoundPage} />
</Switch>
<Footer />
</AppWrapper...