La meilleure façon d'apprendre le développement Web frontal

Pourquoi le développement web?

Le développement Web est un domaine qui ne va nulle part de si tôt. Le Web évolue rapidement et des améliorations régulières sont apportées aux appareils que de nombreuses personnes utilisent quotidiennement.

Les applications basées sur le cloud nous ont permis de faire le gros du travail dans le cloud et d'utiliser le navigateur comme un pont pour connecter des serveurs backend puissants avec des frontends moins performants et moins performants.

C'est le meilleur moment pour apprendre le développement Web si vous cherchez à apprendre quelque chose.

Non seulement le développement Web vous ouvre une multitude d'opportunités en tant qu'individu, mais vous pourrez également coder et déployer des projets complets de bout en bout qui peuvent être utilisés par presque tout le monde sur la planète.

Étant donné que la plupart des gens ont accès à un navigateur, chaque personne n'est qu'à une seule URL de l'application Web que vous avez codée. Si vous comparez cela à une application de bureau ou à un produit matériel, vous verrez qu'il n'est tout simplement pas aussi évolutif que le Web.

Maintenant que nous avons établi le fait que le Web est la meilleure façon de procéder maintenant, voyons comment apprendre le développement Web de la meilleure façon possible.

Le Web est vaste - commencez petit et gardez-le petit

Vous avez probablement vu un grand nombre de frameworks et de bibliothèques JavaScript tels que React, Angular, Vue, Ember, jQuery, XYZ, etc.

Certaines questions très courantes que je reçois en tant que YouTuber publiant du contenu de développement Web sont les suivantes:

Dois-je apprendre X?

X est-il meilleur que Y?

Quelle est la portée de Z?

Rappelez-vous toujours deux choses sur la technologie, en particulier sur le Web:

  1. Votre pile technologique n'a presque jamais d'importance. Si vous êtes assez bon avec votre langage / framework, vous gagnerez à chaque fois.
  2. Vous n'avez jamais besoin de tout apprendre. Jamais. Vous pouvez être un homme à tout faire, mais assurez-vous d'en maîtriser un.

Pour résumer cette section, vous devez penser très petit lorsque vous commencez . Il est super facile de se laisser emporter par ce framework chaud qui vient de sortir. N'essayez simplement pas de prendre de l'avance en abandonnant les anciennes technologies et en adaptant les nouvelles technologies sans faire des recherches appropriées.

Commencez avec HTML et CSS

Je ne peux insister assez sur ce point. Cela me fait mal de voir une tonne de personnes me poser des questions sur leurs projets React lorsque la réponse réside dans le HTML ou le CSS de base.

Au début, JavaScript n'était qu'un langage de script pour navigateur. Et bien que ce soit beaucoup plus que cela maintenant, cela ne change pas le fait que sur le Web, il complète HTML et CSS.

Avec les progrès des normes Web, vous pouvez accomplir beaucoup de choses uniquement avec CSS. Pour beaucoup de choses, JavaScript n'est même pas nécessaire.

Des animations? Tu l'as eu. Glisser déposer? HTML peut gérer cela. Mises en page? Découvrez les API CSS Flexbox ou Grid!

Il y a tellement de choses que vous pouvez apprendre sur HTML et CSS! Ne vous précipitez pas simplement dans JavaScript, car tous les enfants cool du bloc sont dans Angular. Ces bibliothèques et cadres ne mènent nulle part. Prenez votre temps .

Aller large ou aller profond?

Il existe deux approches lorsque vous apprenez le développement Web: aller large ou approfondir.

Aller large signifie que vous commencez à apprendre beaucoup de choses ensemble. Cela peut fonctionner pour certaines personnes, mais pas pour d'autres. Vous pourriez vous submerger de tutoriels, d'exercices, de vidéos et de blogs, puis éventuellement abandonner.

Aller en profondeur signifie que vous commencez à apprendre une chose et que vous essayez d'en apprendre le plus possible à ce sujet. Cela a ses propres avantages et inconvénients. Vous pourriez vous ennuyer ou abandonner parce que vous ne voyez pas de résultats.

Alors quelle est la solution? La réponse est, étonnamment, de ne faire ni l'un ni l'autre. Choisissez une petite pile technologique comme HTML / CSS / JavaScript, et approfondissez les trois. Cela présente quelques avantages:

  1. Vous ne vous ennuierez pas, car les trois ont des objectifs relativement différents et vous les écrivez différemment.
  2. Vous pouvez mélanger les trois, créer et voir rapidement quelque chose de significatif sans des mois d'efforts (ce qui est généralement requis par d'autres langages comme C / C ++). Cela vous gardera motivé pour continuer.

Ne choisissez pas React, Angular ou Vue

Lorsque les gens commencent à travailler avec JavaScript, il est urgent de choisir une bibliothèque comme React, un système d'interface utilisateur comme Material UI, et de se plonger dans la création de trucs impressionnants.

Malheureusement, cela ne mène à rien de plus que de vous tirer une balle dans le pied. Vous ne pouvez jamais, jamais, créer des projets intermédiaires à avancés avec ces frameworks si vous ne comprenez pas les bases de JavaScript. Et l'application de JavaScript prend du temps.

Notez que j'ai utilisé le mot appliquer, et non apprendre, dans la phrase précédente. Il y a une énorme différence entre apprendre quelque chose et appliquer ce que vous avez appris.

Créez un petit projet fonctionnel avec HTML / CSS / JavaScript. Et lorsque vous le faites, créez-en un de plus, puis créez un autre projet.

À chaque étape du processus, continuez à augmenter la complexité du projet, ainsi que les attentes, jusqu'à ce que votre base de code devienne ingérable. À ce stade, vous êtes arrivé à ce que j'aime appeler la limite de l'apprentissage supérieur .

Vous voyez, des cadres existent pour vous décharger du travail répétitif. Ils n'existent pas pour que vous ignoriez ce qui se passe vraiment sous le capot et que vous vous fiez au fait que tout cela est magique.

La première fois que vous choisissez un framework tel que React ou Angular pour vos projets, vous devriez être sûr que vous pouvez créer ce projet sans React ou Angular .

Maître d'un métier

Maintenant, lorsque vous maîtrisez HTML / CSS / JavaScript, il est temps de passer aux normes de l'industrie. La vérité est que, quel que soit votre niveau de développeur JavaScript, vous aurez souvent besoin de travailler avec des frameworks modernes comme React - et juste avec vos connaissances en JavaScript, vous ne pouvez pas le maîtriser immédiatement.

Il faudra du temps pour apprendre et comprendre la terminologie, les concepts et le fonctionnement de ce cadre sous le capot. Alors prenez un cadre et maîtrisez-le.

Comment, pourriez-vous demander? La réponse est simple - c'est à vous de décider. Créez un projet simple dans tous les principaux frameworks (Angular, Vue et React) et voyez lequel vibre le plus avec vous. Choisissez-en un et ne regardez pas en arrière

Ensuite, créez tous vos projets avec ce cadre. Essayez de faire quelque chose que vous ne savez pas déjà faire. C'est la meilleure façon de sortir de votre zone de confort et d'apprendre de nouvelles choses .

Mais n'oublie pas les autres

Il est également important de garder un œil sur les autres candidats. Cela implique non seulement des concurrents directs de votre framework "préféré", mais aussi des outils de développement Web dignes de ce nom.

Vous n'êtes pas obligé de «maîtriser» ces autres outils car ils nécessitent souvent une configuration unique avec une maintenance régulière. Mais c'est toujours agréable de les garder sur votre liste de contrôle des compétences.

Cela pourrait inclure plusieurs choses - comme des tests unitaires avec Jest, des tests de bout en bout avec Cypress, Webpack, Babel ou Parcel, un peu de devops, des scripts shell Linux, des déploiements de serveurs, etc.

Vous pouvez toujours apprendre rapidement les bases de ces compétences, car elles existent depuis longtemps, ils ont donc beaucoup de matériel utile à leur disposition.

Passez

Croyez-moi, c'est une sensation amusante - mais une fois que vous développez de nombreux projets et écrivez beaucoup de code avec votre pile préférée, vous commencez à avoir l'impression que vous pouvez tout faire. À ce stade, vous pouvez obtenir un emploi et continuer à faire la même chose - c'est très bien. Ou, vous pouvez améliorer vos compétences à travers le toit et passer à autre chose.

La toile. Est. Vaste.

Donc, si vous avez terminé avec HTML / CSS / JavaScript / React / Angular / Vue, passez aux serveurs. Découvrez le déploiement de serveurs, NGiNX, HAProxy, l'équilibrage de charge, la configuration de l'infrastructure cloud, les pare-feu et l'autoscaling.

Vous en avez fini avec ça aussi? Passez à WebAssembly, le langage de la prochaine itération du Web.

Vous avez fini d'apprendre WebAssembly? Euh, je ne sais pas alors. Peut-être passer à d'autres domaines de programmation ou cuisiner? :)

Conclusion

Dans le monde d'aujourd'hui, il est si facile pour vous de ne pas répéter les erreurs que j'ai commises en apprenant moi-même le développement Web. Parce que toutes ces erreurs sont désormais accessibles à tous!

Vous avez tellement de ressources à votre disposition, et j'en ai travaillé sur une pour les développeurs Web à apprendre! Voici ma chaîne YouTube où je vous apprends à programmer des choses géniales. Et voici la plate-forme codedamn - la plate-forme actuelle qui vous permet de devenir un grand développeur en mélangeant un tas de vidéos, d'articles et d'exercices.

Faites-moi savoir ce que vous pensez de cet article, et du développement Web en général, via mes poignées Twitter et Instagram. J'adorerais entrer en contact avec vous là-bas!

Paix!