Début d’un parcours de développement frontend – La nouvelle pile

Bonjour! Bienvenue dans le premier article d’une série de didacticiels axés sur l’apprentissage React.js. Il s’agit d’une série hebdomadaire, et après cette brève introduction, elle se concentrera sur la création d’une application de liste de tâches à partir de zéro. J’ai choisi une liste de tâches car elle comprend tous les éléments de base de l’application nécessaires à une application de base. Application CRUD.

Avant d’entrer dans ce qu’est React, voici quelques prérequis recommandés, tels que définis par Google :

• Les concepts de programmation incluent les fonctions, les objets, les tableaux et les classes.
• Connaissance pratique de JavaScript.
• Familiarité avec HTML et CSS.
• Une compréhension du DOM.

Quand j’ai appris React, je ne maîtrisais exactement aucun de ces sujets. Je ne veux induire personne en erreur, j’étais à Codesmith et appris React dans l’environnement scolaire structuré. À cette époque, j’ai étudié les algorithmes et les structures de données de base pendant environ cinq mois et j’avais une connaissance naissante des requêtes DOM et HTTP. Mon HTML était au mieux et mon CSS était un désastre. Absolument aucune div n’était centrée avant cette période.

Un dernier mot du sage (ish): Plus vous avez de connaissances pratiques avant d’explorer React, plus vous trouverez de facilité avec cela, mais personne ne peut définir à quoi ressemblera l’apprentissage pour vous. De nombreux articles et didacticiels vidéo disent “apprendre React est facile”, mais c’est en comparaison avec des bibliothèques et des frameworks frontaux plus lourds. “Facile” n’était pas mon expérience. Ne vous découragez pas si ce n’est pas le vôtre non plus. Je suis content que tu sois là et j’espère que tu resteras ! Maintenant, allons-nous?

Qu’est-ce que Réagir ?

Développeur Facebook Jordan Walk a créé la bibliothèque JavaScript frontale React.js, afin d’aider les développeurs à créer des interfaces utilisateur avec des composants. Une bibliothèque est une collection de fonctions et de codes pré-écrits qui réduisent le temps de développement et fournissent des solutions courantes aux problèmes courants.

Inspiré de XHP (une bibliothèque de composants HTML pour PHP), React a été déployé pour la première fois sur le fil d’actualités de Facebook en 2011 suivi d’Instagram en 2012. La bibliothèque a été open source à JSConf US en mai 2013.

Réagir est Open source, ce qui signifie qu’il est totalement libre d’accès. Les développeurs sont encouragés à modifier et à améliorer la bibliothèque.

React adhère au paradigme de la programmation déclarative. Les développeurs conçoivent des vues pour chaque état d’une application et React met à jour et rend les composants lorsque les données changent.

Pourquoi Learn React ?

Documentation: React dispose d’une équipe de maintenance appropriée via les ingénieurs qui travaillent activement sur React. À la suite, React.js est incroyablement professionnel. Ils ont des docs sur des docs sur des docs. Avez-vous besoin de trouver quelque chose qui ne se trouve pas dans les documents React ou voulez-vous rechercher quelque chose de super spécifique dans Google ? Eh bien, ce n’est pas un problème! Entrer Débordement de pile ou les nombreux articles de blog (bonjour) qui sont également là pour vous aider. J’ai travaillé avec des technologies qui ont une grande empreinte et celles qui en ont une très petite. Plus l’empreinte est grande, plus l’expérience de codage est simple et indépendante.

Vaste potentiel de carrière : Uber, Bloomberg, Pinterest, Airbnb et Skype ne sont que quelques entreprises qui utilisent React. La popularité augmente à mesure que de plus en plus d’entreprises et Google estiment que le revenu moyen d’un développeur React est de 119 990 $ aux États-Unis.

Longévité: Chaque fois qu’une bibliothèque est utilisée, il y a un risque que la maintenance soit interrompue. Cela arrive tout le temps. Ainsi, lors du choix d’une bibliothèque, il est préférable d’en sélectionner une avec une si grande communauté. J’espère qu’il est clair maintenant que React en a un. Les mises à jour sont toujours d’actualité après 10 ans et la popularité ne fait que croître. Les projets et les compétences sont ici en sécurité.

Pourquoi réinventer la roue ?

L’une des choses que j’apprécie le plus dans l’apprentissage de mes instructeurs chez Codesmith est qu’ils m’ont appris à utiliser les outils d’ingénierie éprouvés à ma disposition. Réagir fonctionne. Il est optimisé pour la performance et l’efficacité tout en laissant une grande place à la créativité. Certains des plus grands esprits de l’ingénierie ont fait de leur mieux pour construire cette bibliothèque. Je n’ai pas à créer mes applications à partir de zéro et je peux m’appuyer sur ces outils et bibliothèques lorsque cela convient au projet.

S’appuyer sur une bibliothèque, un framework ou un modèle n’est pas tricher. C’est de l’ingénierie solide. L’ingénierie n’emprunte pas la voie la plus difficile et la plus laborieuse à mon avis. Il s’agit de résoudre un défi de la meilleure façon possible avec la solution la plus optimisée que vous connaissiez à ce moment-là. Et maintenant, je voudrais vous présenter une machine frontale très légère, moyenne et optimisée.

Bienvenue sur Réagissez !

Dans le prochain article, je couvrirai les sujets suivants : état, composants, JSX, comment rendre JSX au navigateur, comment configurer les fichiers dans un IDE.