App.js

import React, { Component } from "react";
import "./App.css";

class App extends Component {
  state = {
    newTodo: "",
    todos: [
      {
        id: 1,
        name: "Todo 1",
        dueDate: new Date()
      },
      {
        id: 2,
        name: "Todo 2",
        dueDate: new Date()
      },
      {
        id: 3,
        name: "Todo 3",
        dueDate: new Date()
      },
      {
        id: 4,
        name: "Todo 4",
        dueDate: new Date()
      }
    ]
  };

  // Si votre state dépend des props, vous devez l'initialiser comme ceci,
  // sinon préférez l'approche du dessus, qui est plus recommandée
  // constructor (props) {
  //     super(props)
  //     this.state = {
  //     }
  // }

  render() {
    return (
      <div className="App">
        <p className="my-component">Je suis mon premier composant</p>
        <ul>
          {this.state.todos.map(todo => (
            <li key={todo.id}>
              {todo.name} - {todo.dueDate.toLocaleString()}
            </li>
          ))}
        </ul>
      </div>
    );
  }
}

export default App;