Pourquoi je n'utilise pas CREATE-REACT-APP (et tu devrais aussi) | React 2024

🗞 Apprendre React ici codelynx.dev/sub-beginreact
Où rejoint juste ma newsletter ici : codelynx.dev/emails
Thumbnail credits to ‪@developedbyed‬
00:00 - Intro
01:33 - SSR vs CSR
05:00 - Création d'une app create-react-app vs ViteJS
04:45 - Écris du code qui répond à ton besoin
12:23 - Outro 👋
N’hésite pas à proposer le sujet de la prochaine vidéo en commentaire.
▶ VIDÉO
CREATE-REACT-APP est mort ! C'est Vite.JS qu'il faut utiliser.
React est bien meilleur et plus optimiser avec Vite.JS.
Ton ordi me remerciera !
▶ ME SUIVRE
🐦 Mon Twitter : / melvynxdev
🖥 Mon GitHub : github.com/Melvynx
📑 Mon Blog : codelynx.dev
💌 Ma Newsletter : melvynx.com/emails
▶ QUI SUIS-JE ?
Je m'appelle Melvyn et je suis passionné par le développement depuis mes 14 ans.
J'ai commencé par le développement WEB, avec HTML / CSS. J'ai ensuite créé un petit backend en PHP.
J'ai la chance de pouvoir gagner ma vie grâce à ma passion depuis maintenant 3 ans. En dehors de ça, j'ai eu l'occasion de réaliser différents sites web pour plusieurs petits projets.
Je veux partager ma passion avec toi et te permettre de ressentir les mêmes émotions incroyables que procure l'apprentissage du dev, c'est pourquoi je serais extrêmement heureux que mes mails t'aident à prendre la bonne voie. J'y consacre plusieurs heures par semaines et je suis fière que tu participe à la communauté de CodeLynx.
14/08/2022
#javascript #developper #dev #code #conseils
===MUSIC===
poem
Music from Uppbeat (free for Creators!):
uppbeat.io/t/soundroll/poem
License code: XWRSH6NKIY8TXGM6
THRE STREET MARKET
Music from Uppbeat (free for Creators!):
uppbeat.io/t/danger-lion-x/th...
License code: OWDURG6MJEED3HSM

[@tariklancelot6748]

Super rigolo, le timelapse pq. Merci pour cette vidéo instructive ! En revanche, on a toujours un gros sentiment de solitude quand on nous dit que l'outil qu'on utilise est en fait pas bon en comparaison d'un autre. J'utilisais jusqu'à maintenant create-react-app et je pensais qu'il s'agissait du dispositif le plus optimisé pour React. Je crois que c'est bien d'avoir une vision d'ensemble et d'avoir plusieurs options. Je vais donc m'intéresser de plus près à vite. Je ne te connaissais, je te découvre . Merci pour ce partage :)

[@melvynxdev]

Ahah je comprend, merci pour ton message

[@aurelienpops5684]

Merci pour la vidéo :D

[@melvynxdev]

Merci :D

[@mosdev2091]

Abonné direct 🤣

[@gloriameli5482]

Merci beaucoup j'ai beaucoup aimé la vidéo je vais adopter pour vite dès aujourd'hui 😊

[@melvynxdev]

Ah génial !!

Dans le SSR, les étapes que tu décris dans le CSR sont faites. Mais côté serveur. Le SSR n'est pas mieux ou moins bien, le choix de l'un ou de l'autre dépend du besoin (application métier, site statique etc.). S'agissant du CRA, il permet de démarrer rapidement un projet. Under the hood c'est une base code webpack, eslint, prettier que l'on expose en ejectant son application. Le triptique est assez classique en entreprise. Webpack a un nombre de plugins énorme, qui permet de faire absolument ce que l'on veut pour le bundle (je ne parle pas du devserver) et qui est bon de maîtriser quand on a des bases code complexes. Alors dire que c'est de la merde, je ne suis pas du tout convaincu. L'argument de la taille du node_modules je m'en fiche. Ce qui m'importe c'est la taille de mon bundle final. Et ça, avec webpack, je garde la main dessus et ce n'est pas lié à la taille du node_modules qui inclut surtout, dans le CRA, des librairies non embarquées au runtime. L'argument des update rapides ne me convainc pas non plus. Je code avec le code sous les yeux et non avec l'application sous les yeux, mais certainement que lorsque l'on tatonne au début l'argument fait sens.

[@melvynxdev]

si tu veux perdre du temps : kzbin.info/www/bejne/bZ6UZZlmj9-Ar7s

@@melvynxdev La vidéo propose d'utiliser des frameworks. Le CRA n'en est pas un. En industrie on est souvent frileux de s'enfermer dans un framework.

[@gantoin]

Elle est cool ta vidéo

[@melvynxdev]

Merci :D

[@adnane331]

Très bonne vidéo :) Moins de langage cru ça serai cool afin de pouvoir la partager en entreprise par exemple :)

[@melvynxdev]

Ahahaha les entreprises n'ont pas un langugae cru ?

[@adriendridri8231]

Salut, j'ai bien aimé ta vidéo, très instructive merci ! J'aurais une question dessus, j'ai l'habitude d'utiliser CRA pour mes projets, maintenant, je vais sûrement utiliser ViteJS (principalement grâce à ton analyse !), toutefois, je m'interroge sur la différence de performances entre ViteJS et NextJS. J'ai eu beau chercher sur internet/KZbin, je suis tombé uniquement sur des comparatifs CRA vs Vite ou CRA vs Next, mais pas de Vite vs Next clair. Vu que Next et Vite utilisent tous les deux du SSR, j'en déduis qu'ils permettent tous les deux un bon SEO, quelle serait pour toi la différence majeure entre Next et Vite ? En te souhaitant une bonne continuation et encore merci pour tes vidéos !

[@melvynxdev]

Hello ! Next à pour moi aucun rapport avec Vite, c'est pour ça que tu ne trouves pas d'information ! Vite permet de créer surtout des petites app, pas de grosse application comme Next. Next gère le routing etc...

[@adriendridri8231]

@@melvynxdev ça marche, je te remercie !

[@jlnko]

Salut je suis actuellement en formation intégrateur web avec open classroom, la formation a été refaite récemment et on nous apprend les bases de react, je n'en suis pas encore la dans ma formation mais après avoir vu ta video j'ai été checker les projets react et il utilise create-react-app ....Tu crois que c'est parce que c'est plus simple à comprendre pour les débutants?

[@melvynxdev]

Non c’est car open class room c’est pas non plus ultra à jour, des feedback que j’ai eu

[@jlnko]

@@melvynxdev oui c'est ce que je me disais, de toute façon quand j'aurai fini cette formation je pense que je ferai celle que tu proposes pour react, merci pour les vidéos 🙏

[@gloriameli5482]

Salut salut excuse moi j'aimerais que tu m'accorde un peu de ton temps pour répondre à cette petite préoccupation J'ai commencé à utiliser viteJs pour un projet de site web et donc vu que c'est un site full stack j'ai décidé d'organiser mes fichiers en 2 dossier : app et server le bail c'est que quand je déplace certains fichiers comme main JS ou index je et que je veux run le projet j'ai des erreurs comme fichier tels introuvable j'ai essayé de chercher comment faire sur stack overflow et on a expliqué qu'il faillait aller dans le vite.config.js pour paramétrer tout ça mais c'était pas vraiment clair pour moi donc s'il-te-plaît j'ai besoin de ton aide 🥺

[@melvynxdev]

hello, je te conseil d'utiliser des monorepo dans ce cas

[@aminbe3960]

petite correction: vitejs utilise rollup (écrit en go lang) Sinon, contenu super intéressant, merci :) :)

[@melvynxdev]

je me suis rendu compte avec la vitejs conf xD

[@walidbelliliseixas7421]

Yep ! C'est pas le le bonhomme qui a crée vue js qui a crée vite aussi ? Bref, j'espère que t'as été green friendly et que tu n'as pas jeté ces 7 feuilles de PQ qui valait de l'or en temps de covid, man Sinon, top la vidéo bien expliqué preuve à l'appui le network ne ment pas ! Thank's

[@melvynxdev]

Merci haha non tkt je l'ai réutilise dans mes fleures

[@thonycreateur]

Super vidéo 😂😂😂😂 partage avec ton ex aussi

[@melvynxdev]

mdrrrr elle est vieille

[@simoben3546]

Merci, merci pour cette video intéressante, j'aime bien ton schéma est-ce que tu peux le mettre dans la description stp :)

[@melvynxdev]

va falloir moyenné son mail

[@mykus1000]

Mdr et moi qui suis en Afrique create react ola ça fait au moin 10 minutes ou plus toute en retant 2 à 3 fois. On a pas un superconnection internet j'avoue mais suffisant pour regarde une vidéo 720p KZbin.

[@melvynxdev]

Ahaha oui encore plus chez toi, CRA à la poubelle

[@dracophil7]

Convaincu

[@melvynxdev]

Heureusement :troll:

[@CAnvaartstory]

J'en peux plus de toi 🤣🤣🤣🤣

[@melvynxdev]

🤣

[@PhilippeLACOUR]

324/41=7.9... C'est donc presque 8 feuilles de PQ et pas 6

[@melvynxdev]

Omg mais tu as raison, c'est encore plus honteux 🤯

[@sephyroth5559]

cra il fait aussi du css éclaté obsolete lol

[@melvynxdev]

totalement

[@rhodler_]

Tu dis trop de gros mots 😩

[@melvynxdev]

et encore ?

[@rhodler_]

@@melvynxdev Une réponse douce apaise la colère, mais une parole blessante excite l'irritation. Celui qui enseigne avec sagesse rend le savoir attrayant, mais la bouche des sots ne répand que des sottises.