As the name implies, functional components are really just functions. If a component doesn't require any state, lifecycle hooks, or basically any class-specific behavior or state, it is preferable to implement it as a functional component. Previously, you implemented the header component as a class component. The header implements nothing but the render method, a definite clue that it can be a functional component instead.
Now, implement the header component as a functional component by replacing the entire content of Header.js with the following:
import React from 'react';import './Header.css';import headerLogo from '../../../assets/logo.png'; const Header = (props) => ( <header className="app-header app-bg"> ...
