Treeview
10 min
2 exercices
Niveau 4
Créer une arborescence de projet React
- Organisez votre projet React pour qu’il respecte la structure suivante :
src/ ├── components/ │ ├── Header.js # Composant d'en-tête │ ├── TaskList.js # Composant pour afficher une liste de tâches │ ├── Task.js # Composant pour une tâche individuelle │ └── Footer.js # Composant de pied de page ├── App.js # Composant principal └── styles.css # Styles globaux
- Implémentez chaque composant avec un contenu simple pour visualiser l’arborescence.
- Header.js : Un
<header>
contenant un titre<h1>
(par exemple : "Gestionnaire de tâches"). - TaskList.js : Un
<ul>
affichant des tâches via le composantTask
. - Task.js : Un
<li>
affichant une tâche (par exemple : "Tâche 1"). - Footer.js : Un
<footer>
avec un texte<p>
(par exemple : "© 2023 Mon Application").
- Header.js : Un
- Dans
App.js
, assemblez ces composants pour former l’arborescence complète.
Rendu attendu
Besoin d'aide ?
Rejoignez notre communauté officielle et ne restez plus seul à bloquer sur un problème !