React

Une nouvelle section sur mon site !

Nouvel Eden

Au début de l’année, je devais attaquer des formations et des découvertes sur trois technologies hyper sexy que sont Git, Docker et Ionic. Et si tu m’as un peu suivi, tu as sans doute pu voir pas mal d’articles sur Git et Docker mais aucun sur Ionic et ce n’est pas par hazard.

J’avais pour objectif de refaire Advance Wars avec un framework front-end robuste qui me permettrait de maintenir le code à long terme (fichiers séparés, composants, classes, etc.). Lors de mes recherches, je suis tombé sur Webpack qui répondait en partie à mes besoins et j’ai pu faire pas mal de trucs avec. C’est plus ou moins à ce moment-là que je suis tombé sur React.

J’ai donc commencé à faire du React pour un voir un peu ce que ça disait et franchement, sans déconner, c’est de la balle ! Ce qu’il m’arrive est une pure dinguerie, car depuis que j’ai commencé à faire du React, et bien je n’ai jamais arrêté ! La preuve, c’est que j’ai même ouvert une chaîne Youtube consacrée presque qu’uniquement à ça et cela doit faire maintenant un petit mois que je code et recode du React et j’adore ça !

Facile à prendre en main

L’une des raisons pour laquelle j’adore faire du React, c’est qu’il est vraiment facile à utiliser et que l’on peut très rapidement créer un projet sans avoir une grande maîtrise de cette techno. Il faut, bien sûr, quelques bases en HTML (et encore) et évidement une bonne connaissance du JavaScript étant donné que, ben oui, c’est un framework/bibliothèque JS. Outre cela, il est vraiment facile de rentrer dedans. Pour ma part, visionner quelques vidéos Youtube m’aura permis de créer une one page, de faire deux ou trois trucs marrants et de découvrir les premiers concepts.

En 2 minutes tu peux faire du React

Si comme moi, tu es développeur web et que tu as node installé sur ta machine, tu peux véritablement commencer à faire du React en même pas deux minutes. Je ne vais pas entrer dans les détails, mais starter un projet React se fait en une seule commande à taper dans la console, et ça te monte un serveur de dev avec une config Webpack aux oignons, donc pas de prise de tête.

JSX

En React, quand tu codes des composants, tu utilises un truc magique qui s’appelle le JSX. C’est une sorte de language JavaScript amélioré dans lequel tu peux mélanger du code HTML et du code JS. Et, même si dit comme cela ça n’a l’air de rien, en réalité, c’est très agréable, car on à l’impression qu’on peut vraiment tout faire. En regardant quelques exemples qui trainent sur le web, tu peux rapidement piger le truc.

Why not ?

Et puis à l’heure où j’écris ces lignes, je me dis pourquoi pas ? React c’est quand même super utilisé. Ça fait maintenant partie intégrante de WordPress (block Gutenberg) et c’est utilisé par Facebook (ils l’ont créé) ainsi que par d’autres grands pontes du web. React utilise aussi le virtual Dom, en gros c’est le truc qui permet d’avoir des performances de ouf. Bon après, moi personnellement j’ai pas encore vraiment pu le constater, mais ils vendent un peu le truc comme ça, donc pourquoi pas ?

Alternative à Ionic ?

Dans la continuité, il y a aussi React native qui permet de concevoir des applications mobiles multiplateformes. Et quand je vois la facilité déconcertante à faire du React, j’aimerais me faire ma propre idée sur le développement mobile avec cette techno et la comparer avec Ionic.

Enfin

Tout ça pour dire que je vais lancer une nouvelle série d’articles intitulés « A la conquête de React » où je te donnerai un peu mon retour sur l’utilisation de la bibliothèque et comment j’aborde l’apprentissage de la techno. J’essayerai de te décrire un peu mon cheminement.

Alors, je sais qu’il y a déjà énormément d’articles sur le web à ce sujet, mais je te donnerai tous mes trucs et astuces pour faire simple et rapide avec un maximum d’exemples. De toute façon, je suis sûr que tu vas adorer. Et puis tu n’as pas le choix !

23/07/2019

Yann Vangampelaere - nouslesdevs -

Sinon jete un coup d’oeil aux autres catégories

Ma boîte aux lettres

Tu veux me demander quelque chose ?