./src/App.js Line 9: Parsing error: Unexpected token, expected

Boa noite pessoal to na aula 3 video 1, verifiquei que a forma de escrever o código da aula esta diferente da instalação do react atual o professor coloca um construtor antes do metodo return da classe' App', aí quando subo o servidor o erro é: Failed to compile ./src/App.js Line 9: Parsing error: Unexpected token, expected ";"

7 | function App() { 8 |

9 | constructor() { | ^ 10 | super(); 11 | this.state = {lista : []}; 12 | } This error occurred during the build time and cannot be dismissed.

no código da video aula é assim:

Class App extends Component{ constructor() { super(); this.state = {lista : []}; } render(){ return(

) } }

===================== meu código abaixo

import React from 'react'; import logo from './logo.svg'; import './App.css'; import './css/pure-min.css'; import './css/side-menu.css';

function App() {

constructor() {
    super();
    this.state = {lista : []};
}

return (

<a href="#menu" id="menuLink" className="menu-link">

    <span></span>
</a>

<div id="menu">
    <div className="pure-menu">
        <a className="pure-menu-heading" href="#">Company</a>

        <ul className="pure-menu-list">
            <li className="pure-menu-item"><a href="#" className="pure-menu-link">Home</a></li>
            <li className="pure-menu-item"><a href="#" className="pure-menu-link">Autor</a></li>
            <li className="pure-menu-item"><a href="#" className="pure-menu-link">Livro</a></li>


        </ul>
    </div>
</div>

    <div id="main">
        <div className="header">
          <h1>Cadastro de Autores</h1>
        </div>
        <div className="content" id="content">
          <div className="pure-form pure-form-aligned">
            <form className="pure-form pure-form-aligned">
              <div className="pure-control-group">
                <label htmlFor="nome">Nome</label> 
                <input id="nome" type="text" name="nome" value=""  />                  
              </div>
              <div className="pure-control-group">
                <label htmlFor="email">Email</label> 
                <input id="email" type="email" name="email" value=""  />                  
              </div>
              <div className="pure-control-group">
                <label htmlFor="senha">Senha</label> 
                <input id="senha" type="password" name="senha"  />                                      
              </div>
              <div className="pure-control-group">                                  
                <label></label> 
                <button type="submit" className="pure-button pure-button-primary">Gravar</button>                                    
              </div>
            </form>             

          </div>  
          <div>            
            <table className="pure-table">
              <thead>
                <tr>
                  <th>Nome</th>
                  <th>email</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>Bruno Eufrasio</td>                
                  <td>bruno10tere@gmail.com</td>                
                </tr>
              </tbody>
            </table> 
          </div>             
        </div>
      </div>

); }

export default App;