00:00Bonjour à tous et bienvenue dans cette vidéo où nous allons un peu simplifier notre système d'import dans les
00:07routeurs.
00:08Alors, encore une fois, c'est question de bonne pratique, vous n'êtes pas obligé du tout.
00:13Et d'autant plus que dans la partie publique, ce n'est pas des masses pertinents.
00:18Ça ne sera plus pertinent dans la partie admin,
00:22mais c'est déjà pour vous montrer un petit peu qu'on peut simplifier nos fichiers et puis les rendre
00:29un peu plus maintenables.
00:32Alors, mon objectif ici, vous voyez qu'ici j'ai tous mes imports,
00:37mon objectif c'est plutôt de faire quelque chose comme import layout home service contact
00:48qui viennent du dossier pages slash public.
00:53Voilà, c'est de faire quelque chose comme ça et de supprimer directement tout ça.
00:57Bon, évidemment, il me râle dessus, hein.
00:59Oh là là, je n'ai pas tout ce qu'il me faut.
01:01D'ailleurs, c'est pas... Hop, c'est layout.
01:03Tac.
01:04Alors, lui, il ne trouve pas.
01:06Ça, c'est évident.
01:07Et puis, de ce côté-là, boum.
01:09Ah tiens, tant que j'y suis.
01:11J'ai renommé, pardon, le routeur.
01:14C'était public route et là, j'ai fait public routeur.
01:17Donc, j'ai renommé la fonction, j'ai renommé l'export et dans l'app.js,
01:24j'ai modifié un peu mon import pour routeur au lieu de route et ici aussi.
01:29C'est plus parlant que public route, c'est public routeur.
01:34Le routeur de la partie publique.
01:36Ok.
01:37Donc, je suis là et moi, je veux ceci.
01:40Alors, pour faire ceci, c'est pas très compliqué.
01:42Il suffit de se cogner un petit fichier index.js.
01:47Bon, là ici, le compieur nous dit, ouais, c'est cool, il y a tout ce qu'il faut.
01:52Non, il n'y a vraiment pas tout ce qu'il faut.
01:55Le côté navigateur, ça part en cacahuète.
01:59Hop.
02:01Alors, ce qui se fait habituellement et ce qui se faisait,
02:04c'était quelque chose comme export étoile from le dossier où je suis.
02:10Le problème, voilà, c'est qu'il nous dit, bah, non, moi, je n'ai pas ce qu'il faut.
02:14Alors, on n'a pas ce qu'il faut tout simplement parce que, alors, hop, on part sur le layout.
02:19Je suis en export default.
02:22Donc, j'ai un export par défaut.
02:23Je ne peux pas faire autre chose après.
02:26Ça, c'est parce que mon générateur de code RSC, donc React Code Snipets, m'écrit mes composants comme ça.
02:34Alors, il y a une façon très simple de s'en sortir.
02:36On enlève tout ça et puis on fait un export direct.
02:41Je ne sais même pas s'il est capable de le comprendre.
02:44On va voir si je fais une petite modif.
02:48Il recompile et il nous parle toujours de layout.
02:50Bon, il n'y a pas de possibilité de s'en sortir avec ce délire.
02:56Et encore, si je fais export from layout, mince, layout, enregistrer, est-ce qu'il comprend mieux ?
03:06Oui, il comprend mieux.
03:09Donc, il ne nous parle plus de layout.
03:11Donc, si vous faites vos composants à la main comme ça, vous écrivez export const la fonction.
03:18Par contre, si vous décidez comme moi d'utiliser l'export default, là, ça ne fonctionne pas.
03:24Puis, on y retrouve.
03:25Alors, ce n'est pas des masses compliquées.
03:28Au lieu d'utiliser ce principe-là...
03:32Tiens, d'ailleurs, tant que j'y suis...
03:35Dernier petit exemple.
03:37Parce qu'on pourrait se dire, oui, tu fais un export comme ça.
03:41Puis là, tu rajoutes toutes les lignes, blablabla.
03:44En fait, on ne peut normalement parler que du dossier.
03:49Alors, si je fais public...
03:52Non, il ne le comprend pas.
03:53Si je te resitue, arrobas, slash pages, slash public...
03:59Non, il ne comprend toujours pas.
04:01Bon, je suis coincé avec mon système.
04:05Alors, je reviens comme c'était.
04:06Si vous faites comme moi, vous avez ça, export default.
04:09Ce n'est pas gênant.
04:11Donc, ici, chouk layout.
04:16En fait, ce n'est pas compliqué.
04:19Il suffit...
04:19Bon, ça fait écrire un peu plus, mais...
04:22Hop, as layout.
04:24Voilà, c'est tout.
04:26J'enregistre et il ne me casse plus les pieds.
04:28Donc, à ce moment-là, il suffit de se copier...
04:32Home, service, contact.
04:33Voilà.
04:34De modifier simplement la bestiole.
04:38Donc ça, c'est la home.
04:41Hop.
04:43Ceci, c'est service.
04:49Et ceci, c'est contact.
04:54J'enregistre...
04:58Qu'est-ce qu'il me dit ?
05:02Qu'est-ce que j'ai pétillé ?
05:04Home, service, machin, un truc, mûche.
05:07What the quoi ?
05:10Ah, voilà.
05:11Il avait un petit souci de compréhension.
05:14Je nettoie ma console.
05:17Voilà.
05:17Alors, regarde, je rafraîchis.
05:19Vous voyez que ça fonctionne impeccable.
05:22Alors, l'objectif ici...
05:25Hop.
05:27Du coup, je peux supprimer tout ça.
05:30Voilà.
05:30C'est d'avoir quelque chose de très clair,
05:33très simple et très maintenable.
05:34Et puis d'avoir un fichier de routage...
05:37Hop, pardon, j'enregistre.
05:38Voilà.
05:39Et d'avoir un fichier de routage très compréhensible.
05:42Encore une fois, sur la partie publique,
05:44ce n'est pas très impactant.
05:46Il n'y a pas tellement de besoins là-dessus.
05:50On n'avait qu'à laisser nos quatre imports
05:52et puis ça faisait la rue Michel.
05:54Autant là, il faut quand même...
05:59Autant, pardon, dans la partie admin,
06:01vous allez voir qu'il y a beaucoup plus de composants,
06:03beaucoup plus de pages,
06:04et il va falloir quand même simplifier
06:08avec cette méthode-là notre routage.
06:11On pourrait même s'amuser à se créer un dossier routeur
06:14et à y mettre tous nos routeurs,
06:16que ça fonctionnerait pareil.
06:18Bon, là, l'idée ici, elle n'est pas pertinente.
06:21Donc, je vais laisser mon dossier public tel quel.
06:24Il fonctionne.
06:26C'est tout bon.
06:27On a service, contact, etc.
06:31Je vais le laisser comme ça.
06:32De toute façon, on va voir que...
06:35On va voir que ça va être beaucoup plus pertinent
06:38sur la partie admin.
06:39D'ailleurs, tant que j'y suis,
06:41la prochaine vidéo,
06:43on va faire nos pages admin.
06:46Et là, vous allez voir que,
06:48heureusement d'ailleurs,
06:49qu'on a fait notre cro-bar,
06:52parce que lui, il va nous aider
06:53à mettre tout ça en place
06:55et à pouvoir directement générer nos composants
07:00sans forcément perdre le fil de notre applicatif.
07:03Donc, prochaine vidéo,
07:05toutes les pages,
07:06tous les composants de notre admin.
Commentaires