Découverte de Reactjs–Créons notre projet - Dev to be curious

Après avoir découvert ensemble Angular, nous allons partir chez la concurrence … et pas des moindres, puisque nous allons commencer à découvrir Reactjs, la fameuse librairie de Facebook !
Commençons par créer notre projet.

Buy me a coffee ! 

Mes articles te plaisent ? Achète moi un café ! :)

Au fait ReactJs, pourquoi ?

Avec la mode des SPA (Single Page Application), nous avons vu apparaître trois grands acteurs qui se tirent la bourre aujourd’hui : VueJs, Angular et Reactjs.

Avoir un ensemble de composants réutilisables, c’est le but de ReactJs.

Une commande pour nous faciliter le tout

Pour créer une application avec ReactJs, rien de plus simple que d’utiliser https://github.com/facebook/create-react-app.

Et pour celles et ceux qui se posent la question du pourquoi de npx, je vous invite à découvrir l’explication.

Un peu lente …

Bon, l’installation en local est un peu lente … Enfin installation, je veux parler de la création du dossier node_modules avec tous les packages à récupérer …

Voir sous le capot de create-react-app, pour générer un projet Reactjs

Mettons que vous souhaitez modifier le fichier webpack … comment faire avec create-react-app ?

Notre projet fonctionne comme par magie .. Or chez DevToBeCurious, on n’aime pas la magie … enfin, si, mais si on est le-la magicien-ne !

Heureusement il existe une commande qui va tout montrer (on me voit, on me voit pas) : npm run eject.

Cette commande était déjà inscrite dans le package.json, après création de notre projet !

On note que la commande npm run eject nous lance un react-scripts eject.

Après confirmation de la commande :

Nous retrouvons tous nos fichiers, avec l’apparition du fichier de configuration webpack  !

Lançons notre application Reactjs

Plus qu’à lancer notre commande : npm start et … le tour est joué !