3.14 Diviser les composants en plusieurs composants

Pour la suite du coup on va aller dans le components et on va créer un nouveau fichier on va l'appeler pareil dépenses.date.js Et ensuite après ça on va écrire fonction ... dépense date du coup la fonction depenses dates et en dessous et en dessous comme toujours on va mettre export dépenses dates voilà où l'avait juste ici c'est parfait, ça c'est nickel ensuite ce qu'on va faire on va aller dans le ... dépenseItem.js on va prendre tout ce qu'on a écrit. Prenez du const au dernier const On va le mettre ici dans le dépense date ensuite ici vous marquez props et aussi je fais une petite ... une petite erreur sur la dernière vidéo ici vous vous me manquez pas toLocalestring vous marquez getfullYear. Du coup on va retourner dans le dépense item et ici du coup on va supprimer. on va tout supprimer tous les const ça ne sert à rien de les garder vous allez comprendre pourquoi ensuite ce que vous faites

Pour le const vous copiez ça vous le supprimez on va dans depenses date et là toujours pareil ici par contre là avant de le coller vous marquez return. Et là on mes le div et par contre en haut ça j'ai oublié de le mettre vous mettez quand même div ici et si vous mettez un point virgule et ensuite toujours ici dans dépense item ce qu'on va faire on va importer parfait comme si c'est normal ça va le mettre directement si vous avez l'écriture automatique en fait c'est pour relier les deux pages du coup on va importer depense date d'accord c'est toujours la même utilité différente façon ce qu'on va faire maintenant on va supprimer le dernier dépenses date vous rajouter un slash un espace slash est-ce qu'on va faire maintenant on va aller dans le hall

Tout en bas où vous avez dépense.item ce qu'on va. C'est exactement pareil on va supprimer ça et en fait au début ça ne va pas nous mettre d'erreur ça ne va pas nous mettre d'erreur dehors et ensuite après ça c'est parfait vous sauvegarder et ensuite ce qu'on va faire c'est avec le dépenseDate ici on va rajouter date est égal props.date On va crée toujours dans le component un fichier qui va s'appeler dépensesDate.css Comme ceci ensuite dans le dépenseDate vous pouvez rentrer ce code là du coup je vais vous laisser recopier. On a aussi pour Le dépense des mois dépense des années et depense des jours. Je vous laisse recopier

Ensuite dans le dépensedate de ce qu'on va faire c'est tout en haut on va marquer import Slash dépenses Item. Point CSS on va aller dans le return ici et ce qu'on va faire c'est qu'on va effacer tous à rentrer dans la div. et dans la Dive on va mettre la classe. Name avec un N majuscule dépenses. N'oubliez pas aussi de mettre le mois. L'année et le jour. Aussi entre les div. Normalement après ça c'est parfait on se retrouve pour le prochain cours.