3.15 Devoir 1 temps de pratique react et component basics

Très bien après tout ça nous allons continuer à crée d'autres fichiers toujours dans component on va créer cette fois le dossier seulement dépenses.js contrerement aux autres où il y a item ou date devant vous crée dépenses.js et un autre fichier ou pareil vous mettez dépenses mais cette fois vous marqué .css Et cette fois ce qu'on va faire du coup vous allez prendre tout le code ici. Qui est dans app.js et vous allez le mettre directement ici. Dans le dépense.js on va le transférer dans cette page ensuite vous allez apporter le dépense items sur la page dépense.js et vous apporter aussi le dépense. Vous rajouter ça sera toujours les mêmes utilité c'est juste dans le transfert sur l'autre page ne vous inquiétez pas ensuite on va aller dans le dépense. C'est ce qu'on vient de créer et vous mettez depenses .

Tout simplement ensuite on peut nommer une carte de composante car il s'agit d'un aspect de carte spécifique et ce n'est pas un terme on va faire carte.js oublie pas de mettre le C majuscule très important généralement cela signifie une sorte d'apparence de compteneur avec des coin arrondi. Des ombres portées c'est pourquoi j'ai choisi la carte comme nous ici du coup tout ça ça va être en forme de carte du coup nous allons commencé à écrire dedans on va faire on va mettre un return et on est dans cette div on va pouvoir mettre ce qui ne retourne c'est-à-dire il ne retourne le nom carte et comme toujours en dessous n'oublier pas de mettre export. avec un C majuscule ensuite on va crée un autres dossier qui vas être carte point css et Avant de remplir quoi que ce soit on va aller on va retourner dans le carte.js et on va importer carte.

css maintenant on va pouvoir partir sur le sur la carte. CSS il va nous falloir deux choses c'est-à-dire qui va nous falloir dans le dépense.css le box shadow et le border radius avec ces deux-là aussi on va pouvoir. Mettre notre moi on va aller dans le dépense item.js Et ici a la place de classe Name on va changer avec carte pareil pour en dessous. et entre c'est deux là on va pouvoir importer carte pour qu'il soit reconnu. On va retourner dans carte.js et normalement vous devriez vous rappeller de ça on l'a fait dans le dernier cours c'est le props.children

Alors children C'est un nom réserver d'accord nous ne mettons pas d'enfant sur cette carte j'envoie un accessoire de nom de place et en fait pour le moment cela ne fera rien mais je n'envoie pas d'accessoires pour enfants tout simplement juste ajouter un const classcarte plus props.className comme vous pouvez le voir ici la classe et souligner pour pas que ça fasse cette erreur ce qu'on va faire ça va juste supprimer le carte et dedans on va rajouter le mot class et vous pouvez voir que ça a disparu et que là notre code est bon on va maintenant retourner dans le dépense en JS et là on va importer carte from voilà exactement comme ceci normalement ça devrait se mettre. Ici comme tout à l'heure on peut enlever le div pour le rajoute. Remplacer par carte et bien évidemment il faut aussi le changer en bas. On se retrouve pour le prochain cours.