#8 Les 5 choses essentielles à savoir sur React JS

Qu’est-ce que React ?

React a été déployé pour la première fois sur Facebook en 2013 et est apprécié par les développeurs souhaitant construire des interfaces utilisateurs. Ce langage est récent et est utilisé pour la gestion des couches d'affichage pour les applications web et mobiles. React nous permet également de créer des composants d'interface utilisateur réutilisables.

React JS est une librairie de JavaScript open-source qui a été créée par Jordan Walke, un développeur travaillant pour Facebook. Il est également exploité pour créer des applications à destination du Web exclusivement. De plus il mêle également HTML et XML dans un même fichier de code.

React Native est une plateforme open-source créée en 2015 par Jordan Walke également. React native est utilisé principalement pour les applications mobiles IOS et Android.

Quels sont les 5 choses essentielles à savoir sur React JS?

1. Components (composants)
   L’idée est de créer des ”bloc de codes” réutilisables, c’est à dire, qu’une partie de ce code peut être implantée à plusieurs endroit sans développement supplémentaire. L’avantage est qu’en fonction de l’endroit où le composant sera appelé, il gardera la même structure (design, couleur, placement, etc.) C’est un gain de temps important pour les développeurs.
   
   
2. JSX
   JSX est décomposé comme suit : JS pour Javascript et X pour XML

   Comme évoqué dans la définition de React, React JS mêle HTML et XML dans un même fichier. Il est très rare de trouver des fichiers où plusieurs langages de programmation sont écrits ensemble. C’est un réel avantage pour nous, les développeurs, car cela nous permet d’être plus efficace et rapide pour le développement.

3. Props & States
   - Props (propriétés) : les Props permettent de donner des propriétés à un composant, par exemple, lui donner une taille ou une couleur. Les props sont unidirectionnelles, c’est à dire que les données ne peuvent aller que des composants parents vers leurs enfants, et non l'inverse.
   - State (état) : State permet de gérer momentanément la configuration même du composant.
   
   
4. The component API (Application Programming Interface)
   Les API sont considérés comme une structure à suivre qui permet de créer des composants. Les API fonctionnent avec 4 éléments :
   
   - Render : Endroit où on place le code JSX (c’est ce code qui va rendre l’UI (design) d’un composant)
   - Constructor : Initialisation des States
   - SetState : Modification d’une variable (ex. couleur d’un objet)
   - Lifecylce : gestion automatique du cycle de vie d’un composant : de la création jusqu’à sa destruction
   
   
5. Functional Component
   - Class : une classe permet de gérer les states d’un composant en utilisant les API ci-dessus.
   - Functional Component : c’est une fonction à laquelle on peut donner des propriétés comme arguments et qui nous retourne de l’HTML. Ici, on ne peut plus utiliser les API ni utiliser la méthode setState : ce qui implique qu’un functional component ne peut pas avoir de states, c’est pour cela qu’on l’appelle Stateless.

Pour plus d’information sur ces éléments, cliquez ici

React et Angular, quelles différences selon toi ?

Angular et React ont chacun leurs différences et leurs cas d'utilisation ; il est donc difficile de dire ce qui convient le mieux aux débutants. Pour ma part, j'ai trouvé que React était plus facilement abordable et rapide qu’Angular, du fait que l’on a plus de liberté.

Quel type de projet as-tu récemment développé en React ?

Actuellement, je travaille sur une plateforme qui rassemble les données du marché de l'immobilier afin que les individus puissent comparer et estimer leurs biens. Ce projet est particulièrement intéressant car pour la première fois, je travaille en pair-programming : Moi je travaille sur la partie React et Quentin, lui, sur la partie base de données.

Quelles sont tes ambitions pour l’avenir au sein de Technology Partner ?

A court terme, je souhaiterais enrichir mes connaissances en React parce que je trouve que ce langage est particulièrement passionnant et captivant. De plus j’aimerais me former sur d’autres langages.

A long terme, j’aimerais avoir un poste avec plus de responsabilités. Par exemple, la gestion d’un projet tout en conservant la partie développement.

Ecrit par Emanuel Martins & Charline Pennisi