Comment devenir un développeur Web Full Stack en 2022

Les développeurs Web full stack sont les meilleurs du monde du code. Avoir cette désignation signifie que vous pouvez produire des solutions de bout en bout, ce qui est un ensemble de compétences hautement commercialisables et agiles. Mais que faut-il réellement pour atteindre ce statut ?

Que vous soyez nouveau, chevronné ou spécialisé dans une extrémité de la pile, il y a beaucoup à digérer ici. N'hésitez pas à plonger du haut ou à rebondir là où vous avez le plus besoin d'aller.

Qu'est-ce qui fait vraiment un développeur full stack ?

Quel est l'objectif à atteindre ?

Par où commencer ?

Front-End

Back-End

DevOps et le Cloud

Qu'en est-il de la conception (Design) ?

Vous ne faites que commencer ?

Aller plus loin

 

Qu'est-ce qui fait vraiment un développeur full stack ?

C'est amusant et amusant de dire que n'importe quel développeur front-end est un développeur full stack, puisqu'il peut créer des solutions de bout en bout, mais être capable de déployer un site Web sur Netlify ne vous rend pas full stack.

Ce n'est pas censé être décourageant, juste de manière réaliste, le fait d'avoir seulement cette expérience ne résistera pas bien à ce titre de poste lors de votre prochain entretien. Pendant que vous créez et déployez techniquement votre travail du début à la fin, Netlify, Zeit et d'autres fournisseurs vous donnent le pouvoir de le faire avec leurs outils magiques qui éliminent la majorité des opérations du stack de l'équation.

Cela n'enlève rien à ce que nous sommes tous capables d'accomplir maintenant en tant que développeurs front-end. Le mouvement croissant de compilation et de déploiement de sites Web statiques vient de simplifier ce processus sur la dernière moitié du stack avec des avantages à tous les niveaux.

De plus, grâce à la flexibilité des options d'outillage telles que la possibilité d'exécuter JS sur un serveur, nos compétences peuvent être transférées à plus de cas d'utilisation que jamais auparavant.

D'où nous venons

Le paysage du développement Web évolue rapidement. Wordpress est le roi des CMS depuis un petit moment déjà, représentant plus d'un tiers des sites Web qui utilisent un CMS et aidant PHP à gagner en popularité. Mais d'autres ont travaillé à partir de solutions locales.

En savoir plus ici : https://trends.builtwith.com/cms

Celles-ci représentaient un stack Web plus traditionnelle comme LAMP. Dans ces cas, vous aviez des serveurs Web exécutant généralement une sorte de système de gestion de contenu et un langage côté serveur (comme PHP) qui s'interfacerait avec les bases de données et produirait le code qui serait finalement livré au navigateur.

En plus de cela, vous pourriez avoir Javascript créant des fonctionnalités interactives avec CSS gérant l'affichage de la page. Désormais, dans certains cas, disposer d'un serveur WordPress géré est tout ce dont vous avez besoin pour certains hébergeurs Web. Mais d'autres sites plus importants nécessiteraient une autre équipe pour gérer ces services et le pipeline de déploiement pour mettre le code en production.

Où nous sommes et où nous allons

Alors que Wordpress ne va nulle part , les architectures sans serveur (serverless) et JAMstack prennent de l'ampleur. Pour ceux qui ne sont pas familiers, l'idée n'est pas qu'il n'y a littéralement pas de serveurs, mais il s'agit plutôt d'utiliser des serveurs qui sont gérés pour vous dans le cloud.

Des services comme AWS Lambda vous permettent de créer une « fonction » qui traite des entrées et des sorties simples. Attachez-le à API Gateway et vous disposez immédiatement d'un point de terminaison avec lequel vous pouvez vous connecter sans jamais avoir à gérer un serveur.

D'autres comme S3 vous permettent de vider HTML, CSS, JS, images et tout autre actif statique dans le stockage et de servir le site directement à partir de celui-ci. Rien n'est traité sur le serveur, vous servez simplement les fichiers statiques au client.

La partie brillante à ce sujet est qu'il y a beaucoup moins de frais généraux et c'est généralement beaucoup moins cher. Dans de nombreux cas, vous bénéficierez également d'une amélioration considérable des performances, où la diffusion d'un site à partir de s3 nécessitera moins de traitement pour obtenir cette première réponse au navigateur , ce qui peut directement équivaloir à une expérience utilisateur améliorée.

Bravo à une bonne expérience utilisateur !

Ce n'est pas pour vous pousser vers le JAMstack, mais pour montrer que le paradigme du full stack est en train de changer et que c'est quelque chose qui vaut la peine d'être examiné. Il y a toujours un sens traditionnel de la différence dans le travail, mais cela devient un peu différent.

Les équipes DevOps gèrent désormais les ressources cloud et les déploiements. Les développeurs backend créent désormais des API et du code qui s'interfacent avec des services à l'aide d'outils tels que les fonctions lambda. Et les développeurs frontaux travaillent principalement en Javascript pour créer des applications React ou Vue qui accèdent aux services créés par vos développeurs backend. On peut dire que cela peut inclure ou non des choses comme CSS, mais c'est une autre boîte de Pandore sur le titre qui fonctionne "officiellement" (spoiler : dépend de l'équipe).

Bien qu'il y ait toujours un sens partagé des devoirs, la ligne s'estompe et il est plus facile de répartir votre concentration.

Avant de plonger, parlons de cet objectif

Il peut être assez tentant de vouloir plonger dans le vif du sujet et de couvrir tout le spectre d'un développeur full stack, mais il y a quelque chose à dire sur la concentration. C'est la base de l'expression « touche-à-tout, maître de rien », où vous essayez d'apprendre un peu de chaque partie du full stack et de ne jamais vraiment maîtriser quoi que ce soit.

Cela peut être dangereux lorsque vous commencez à essayer de développer vos forces en tant que nouveau développeur. Essayez donc d'évaluer quel type d'apprenant vous êtes et concentrez-vous là où cela compte. Si vous êtes aux prises avec un programme étalé, cela ne vous aidera pas nécessairement à acquérir l'expérience dont vous avez besoin pour décrocher ce premier emploi ou l'emploi de vos rêves.

Une nouvelle approche, par exemple, pourrait consister à se concentrer sur l'individu, mais à développer les compétences complètes autour de cette force. Il peut s'agir d'un développeur frontal qui peut déployer ses propres applications Web et continuer à s'appuyer sur ces connaissances fondamentales.

En plus de cela, une partie d'être un développeur full stack ne consiste pas nécessairement à pouvoir dire que vous connaissez les langages x, y et z. Comprendre les concepts de conception de code et de logiciel ainsi que pouvoir relever n'importe quel défi à portée de main, empiler de côté, est ce qui fait un grand développeur.

En fin de compte, essayez de déterminer ce qui vous convient le mieux et ne laissez pas votre grande ambition vous empêcher de maîtriser votre voyage.

Par où commencer ?

Pour les besoins de cet article, nous allons nous en tenir aux points d'arrêt traditionnels de ce qui divise le stack (front end, back end, etc.). Bien que certaines personnes disent que ce n'est plus vraiment une chose , de façon réaliste, il y a des tonnes d'emplois pour les développeurs full stack et au jour le jour, ils se réfèrent aux points d'arrêt traditionnels. "Développeur Full Stack" ne va certainement nulle part.

En ce qui concerne la pile, nous allons nous appuyer sur les architectures sans serveur(serverless)/ JAMstack, car cela va continuer à croître. Et si vous les apprenez, cela ne fera que vous rendre plus commercialisable avec le nombre d'emplois qui apparaissent autour.

Comme vous le remarquerez ci-dessous, cela n'est pas censé être complet avec chaque type de base de données et chaque type de solution de rendu. Un développeur fort devrait être capable d'être flexible avec ses outils, en parvenant à comprendre les concepts de son travail plutôt que d'être déterminé et de ne pouvoir être productif que dans un seul cadre.

Bien que vous travailliez dans React et que vous soyez à l'aise dans votre travail actuel (c'est bien !), Votre prochain travail pourrait être lourd sur Vue ou "surprise!" votre chef d'équipe souhaite réécrire l'application dans Svelte . Essayez de comprendre pourquoi vous utilisez un framework d'interface utilisateur en premier lieu et comment il vous aide à résoudre le problème en question.

Maintenant, allons-y...

Le Front-End

Le frontal d'un site Web ou d'une application est généralement l'interface utilisateur avec laquelle la personne utilisant votre service interagit. Le plus grand acteur de langage dans le jeu est Javascript, où vous vous appuierez généralement sur des bibliothèques d'interface utilisateur telles que React ou Vue pour gérer les composants de votre projet.

L'utilisation de ces cadres d'interface utilisateur vous permettra de créer des "composants", essentiellement des blocs de code, qui finiront par produire du HTML avec la possibilité de créer des interactions et des états dynamiques en même temps que votre code. Cela devient vraiment puissant, et même s'il peut y avoir une petite courbe pour commencer, cela devient assez agréable à travailler une fois que vous avez compris.

Que vous soyez nouveau dans le domaine ou expérimenté, vous pourriez éventuellement rencontrer jQuery. Bien qu'il ait ses mérites et qu'il ait bien servi la communauté, les fonctionnalités natives de Javascript se sont vraiment développées et ont créé moins de demande pour les fonctionnalités que jQuery était en mesure de fournir. Désormais, les développeurs s'appuient plutôt sur les frameworks d'interface utilisateur et le Javascript natif.

Il est donc bon de comprendre ce qu'est jQuery, mais je ne recommande pas de prendre le temps de l'apprendre à ce stade. La bonne chose est que si vous décrochez un emploi qui l'utilise, vous pouvez écrire du Javascript natif avec jQuery, donc apprendre le Javascript vanilla lui-même est la bonne réponse.

Alors que dois-je apprendre ?

Si vous êtes vraiment débutant, prenez le temps d'apprendre les bases du HTML et du CSS. Ce n'est peut-être pas aussi amusant et attrayant que de creuser directement dans Javascript, mais s'appuyer sur les principes fondamentaux de ce qui fait le Web sera essentiel pour partir du bon pied.

Ensuite, apprenez Javascript. Il restera roi dans un avenir prévisible. Javascript fournira la base de tout framework ou bibliothèque sur lequel vous construisez, donc comprendre comment les éléments du langage lui-même fonctionnent vous aidera à vous propulser dans votre parcours d'apprentissage du côté frontal des choses.

Cela vous facilitera également la vie lorsque vous essayez de comprendre certaines des complexités des différents modèles et des concepts derrière les frameworks que vous utiliserez.

En parlant de frameworks, React et Vue sont probablement les meilleurs candidats compte tenu de leur popularité. React est le plus populaire du groupe et va continuer à croître. Son équipe travaille constamment à faire mûrir le framework et à produire des API qui aideront à créer des applications Web modernes et rapides.

Démarrer avec Create React App ou Gatsby vous aidera même à lancer facilement une application React et à vous mettre immédiatement dans une position où vous pourrez bricoler dans le code.

Bien qu'il y ait des avantages à faire appel à des préprocesseurs CSS et à des outils comme Sass, il existe maintenant une tonne de solutions pour CSS, y compris CSS-in-JS.

Bien que mettre CSS à l'intérieur de JS ait des avantages et des inconvénients, il n'est pas nécessairement utile de préciser ce qu'il faut utiliser comme direction particulière, car cela dépendra vraiment de l'équipe.

Comprendre les bases et la puissance de CSS et comment l'utiliser sous sa forme vanilla vous aidera à vous préparer à l'utiliser, quel que soit le framework.

Ressources

• freecodecamp.org Certification de conception de sites Web réactifs https://www.freecodecamp.org/learn
• "Mettez bas le Javascript : apprenez d'abord HTML et CSS" https://www.freecodecamp.org/news/put-down-the-javascript-learn-html-css/
• MDN Introduction à Javascript https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript
• Cours par e-mail Just Javascript https://justjavascript.com/
• Jeu d'apprentissage JSRobot https://lab.real.me/jsrobot/
• reactjs.org Introduction à React https://reactjs.org/tutorial/tutorial.html
• gatsbyjs.org Tutoriels https://www.gatsbyjs.org/tutorial/

 

Back-End

Dans le monde JAMstack, le back-end fera généralement référence aux API que nos frontaux utilisent pour créer des expériences dynamiques en interagissant avec les points de terminaison du client (comme ceux des API CRUD ). Être en mesure de faire ces demandes à partir du client supprimera la nécessité d'avoir à faire tout ce traitement avant que la page ne soit servie au navigateur.

Bien que vous ne devriez pas avoir l'impression de ne pouvoir coder que dans un seul langage, être capable d'écrire en Javascript offre ici un avantage appréciable, car vous pouvez vous familiariser avec les principes fondamentaux du travail avec l'arrière-plan des choses avec un langage familier (ou vice versa avec le Front-end).

NodeJS est un environnement d'exécution commun que vous trouverez dans la plupart des environnements cloud en option et vous offrira une expérience similaire à ce que vous attendez d'un navigateur. La principale différence est que vous n'aurez pas accès à certaines API de navigateur et qu'il n'y aura pas non plus d'objet window et les API qui lui sont associées.

Cela dit, Python est également un autre langage populaire et se développe, en particulier compte tenu de sa popularité dans la communauté de la science des données (Data science) et de l'ingénierie. PHP et Ruby, bien que les deux soient valides et vous offrent des options sur le marché du travail, ne semblent pas être aussi populaires et moins sur une tendance générale à la hausse que Javascript et Python.

Avec le langage de votre choix, votre meilleur pari sera d'apprendre à créer des services cloud avec lesquels vos applications peuvent s'interfacer.

La création d'un lambda simple avec lequel vous pouvez jouer, que ce soit dans AWS, Netlify ou tout autre fournisseur de cloud, vous donnera une bonne expérience de ce à quoi vous pouvez vous attendre lorsque vous travaillez sur le terrain.

Et même si vous ne développez pas directement dans un lambda dans le travail que vous trouvez, vous pourrez commencer à vous familiariser avec les concepts fondamentaux pour travailler avec le back-end. Et vous utiliserez finalement ces fonctions pour vous connecter à d'autres services et bases de données afin de créer vos propres services dynamiques.

Alors que dois-je apprendre ?

Si vous travaillez déjà sur l'apprentissage de Javascript du côté frontal des choses, continuez en utilisant Javascript pour votre backend. Faites tourner un lambda en utilisant les fonctions Netlify , où vous avez juste besoin de vous concentrer sur le code et Netlify s'occupe du reste (comme la construction et le déploiement de votre fonction).

Avec le langage de votre choix et votre première fonction, essayez de commencer à travailler avec d'autres services dans votre code pour acquérir de l'expérience avec des API tierces.

Créez peut-être un point de terminaison capable d'envoyer un tweet à l'aide de l'API Twitter (mais n'en abusez pas). Apprenez à créer une base de données et à configurer votre fonction pour qu'elle s'interface avec elle dans un modèle CRUD, ce qui vous donnera un cas d'utilisation plus réaliste de la façon dont une application typique peut interagir avec un backend.

Votre objectif ici devrait être de créer des services avec lesquels votre frontal interagira via un point de terminaison pour effectuer des opérations pour la personne utilisant votre application. La bonne nouvelle est donnée l'élan du cloud, vous aurez une tonne d'options, et des options ou niveaux gratuits, pour commencer à jouer avec.

Ressources

• "Démarrage super simple sans serveur" https://kentcdodds.com/blog/super-simple-start-to-serverless
• "Création d'applications CRUD sans serveur avec Netlify Functions & FaunaDB" https://www.netlify.com/blog/2018/07/09/building-serverless-crud-apps-with-netlify-functions-faunadb/

DevOps et le cloud

DevOps découle de la nécessité de pouvoir créer des solutions qui lissent et accélèrent le processus d'obtention du code des personnes qui l'écrivent jusqu'à un état déployé.

Ce travail peut aller de nombreuses responsabilités à quelques-unes, qu'il s'agisse d'écrire des scripts bash pour une solution personnalisée ou d'écrire un modèle CloudFormation qui crée toutes les ressources nécessaires à l'exécution d'une application.

Vous trouverez généralement cela inclus dans le cadre d'une orchestration plus large de workflows CI/CD qui automatisent le processus de génération et de déploiement.

Et cela change constamment ! Compte tenu de l'essor du sans serveur, le framework sans serveur(serverless) est apparu, qui gère une grande partie de cela pour vous de manière plus simple, ce qui a même conduit AWS à créer sa propre solution SAM . Des outils comme Jenkins existent depuis un moment pour la partie CI/CD, mais maintenant vous voyez Github, Gitlab et d'autres fournisseurs de contrôle de source fournissent leurs propres solutions et outils comme CircleCI qui s'intègrent directement dans votre projet.

Ce n'est pas non plus encore parfait, écrire des modèles CloudFormation est intimidant. L'écriture de scripts d'automatisation n'est pas non plus la plus amusante, même si c'est super gratifiant quand ça marche !

Mais cela s'améliore, et c'est là que des produits comme Netlify et Zeit s'intègrent. Bien qu'ils s'enracinent davantage du côté de l'hébergement statique, où vous compilez votre application et la stockez, leurs offres se développent, comme les fonctions de Netlify qui sont vraiment juste AWS Lambdas qui sont plus faciles à configurer et à déployer sur un point de terminaison entièrement fonctionnel (c'est vraiment super facile).

Alors que dois-je apprendre ?

Si c'est la première fois que vous configurez ce genre de chose, commencez par Netlify. Configurez une application React ou même un simple fichier HTML dans un référentiel Github, connectez-le à un nouveau compte Netlify et regardez-le se déployer.

Suivez ce tutoriel simple sur comment utiliser Netlify pour votre premier projet.

À partir de là, ou si vous avez déjà un peu d'expérience, commencez à vous intéresser à ce qui se passe dans les coulisses. Netlify prend probablement votre code, exécute les commandes que vous avez configurées (comme yarn build) dans un environnement virtuel, vide les fichiers intégrés dans le stockage comme S3 et place un CDN devant comme CloudFront pour servir à partir d'un point de terminaison.

Essayez d'abord de le faire manuellement à partir de votre ordinateur à l'aide de la console AWS et de leur CLI, puis écrivez un script pour automatiser l'ensemble du processus d'intégration avec CircleCI dans votre projet Github au lieu de Netlify pour le déployer réellement sur AWS.

Augmenter cela d'un cran comprendra la mise en place de services avec lesquels votre back-end pourrait s'interfacer. Avez-vous une base de données que vos services utilisent ? Vous pouvez automatiser la rotation de cette base de données à l'aide de CloudFormation ou de scripts bash.

Traiter votre infrastructure comme du code avec des ressources jetables et facilement recréables vous aidera, vous et vos projets, à devenir plus flexibles et à avoir une meilleure capacité à revenir en arrière en cas d'échec.

Et tout cela vaut pour n'importe quel fournisseur de cloud ou CI/CD, pas seulement AWS et CircleCI. Choisissez votre outil de cloud et de flux de travail préféré et exécutez-le. Le but est de commencer à examiner les besoins de votre projet et de creuser ce qui se passe réellement dans les parties automatisées de la pile. Cela vous aidera à en savoir plus et à devenir plus ingénieux pour les besoins de votre projet.

Ressources

• « Un guide étape par étape : déploiement sur Netlify » https://www.netlify.com/blog/2016/09/29/a-step-by-step-guide-deploying-on-netlify/
• "Configuration d'un site Web statique" https://docs.aws.amazon.com/AmazonS3/latest/dev/HostingWebsiteOnS3Setup.html
• "AWS Certified Cloud Practitioner Training 2019 - Un cours vidéo gratuit de 4 heures" https://www.freecodecamp.org/news/aws-certified-cloud-practitioner-training-2019-free-video-course/
• Voir les ressources Javascript dans Front End ci-dessus

 

Qu'en est-il de la conception (Design) ?

Oui, vous devez comprendre les bases de la conception. Non, vous n'avez pas besoin d'être designer.

Il existe de nombreux aspects de la conception qui accéléreront vos capacités en tant que développeur. Bien que nous sachions tous que les concepteurs visuels et UX produisent de la magie, une compréhension de base peut empêcher votre application de devenir une énorme déception.

L'application fictive de Pied Piper a été abandonnée à cause d'une mauvaise expérience utilisateur

Tout le monde dans le processus de développement travaille vers un objectif qui a un impact sur un utilisateur final d'une manière ou d'une autre. Pouvoir comprendre les besoins que votre travail tente de résoudre et leur impact sur les utilisateurs aidera l'équipe dans son ensemble à développer une solution finale plus complète.

Imaginez qu'un développeur back-end crée une API pour permettre à quelqu'un de gérer les utilisateurs dans une application. Les exigences de l'API sont assez légères et n'incluent que le nom de l'utilisateur. Fournir cela comme un seul champ "nom" au lieu de "prénom" et "nom" n'est peut-être pas la solution la plus intuitive pour la plupart. Mais cela pourrait être un oubli qui complique la façon dont le développeur frontal expose cela dans l'interface utilisateur, ce qui compliquerait l'affichage pour le développeur ou pourrait le rendre déroutant pour l'utilisateur final.

En plus de tout cela, la conception peut avoir un impact direct sur la conversion. Si vous construisez dans l'espace de commerce électronique, le fait d'avoir un bouton qui ne ressemble pas à un bouton peut empêcher les gens d'ajouter un produit à leur panier. Ceci, bien sûr, empêchera un achat, qui est une perte de revenus. Comprendre comment humaniser l'interface utilisateur, même dans un sens basique, peut littéralement rapporter plus d'argent à votre projet ou simplement aider quelqu'un à l'utiliser plus facilement.

Et plus important encore, vous voulez que votre site soit accessible. De nombreuses personnes ont des besoins différents, qu'elles ne voient pas les mêmes couleurs ou qu'elles n'entendent pas les sons produits par votre application, vous souhaitez reconnaître les besoins des autres et essayer de concevoir de manière à rendre votre application utilisable par tous.

Alors que dois-je apprendre ?

Bien que je ne m'attende pas à ce que vous suiviez un cours complet pour cela, essayez d'être conscient et curieux.

Lors de la création de solutions, essayez d'imaginer comment votre travail sera utilisé. De quoi les autres développeurs de votre équipe auront-ils besoin de votre API ? De quoi les utilisateurs de votre application auront-ils besoin de votre interface ?

Vous pouvez également essayer de vous inspirer de ce que font les autres dans votre espace. À quoi vous attendriez-vous d'une application qui offre des fonctionnalités similaires ? Ce n'est pas une licence pour copier ou voler, mais vous devez comprendre les besoins que leur solution résout. Considérez pourquoi leur bouton Ajouter au panier est si énorme, pourquoi ils donnent aux utilisateurs la possibilité de zoomer sur une photo de produit ou comment vous pouvez rendre une conception de table légèrement plus utilisable.

conception de produit "table" sur Dribbble

En ce qui concerne l'accessibilité, essayez d'apprendre les bases. De plus en plus de ressources sont disponibles pour vous aider à comprendre les besoins des autres. Essayez de comprendre quels sont les handicaps et comment ils peuvent affecter l'utilisation de votre application. Examinez peut-être quelques modèles courants sur la façon de répondre à ces préoccupations.

Le plus souvent, ce n'est pas trop difficile à intégrer, et si vous prenez l'habitude de le faire dès le départ, vous n'y penserez même pas la prochaine fois que vous créerez une application.

Ressources

• Conception pour les développeurs https://thoughtbot.com/upcase/design-for-developers
• Conception de piratage https://hackdesign.org
• Conception pour les pirates https://designforhackers.com/
• Introduction à l'accessibilité Web https://webaim.org/intro/

Vous ne faites que commencer ?

Une grande partie de cet article suppose que vous maîtrisez certaines des bases, telles que comprendre ce qu'est git et le contrôle de source ou simplement configurer votre éditeur de code. Si vous ne faites que commencer, vous voudrez au moins avoir une compréhension simple de ces concepts, car cela deviendra rapidement plus difficile sans eux.

Il y a aussi quelque chose à dire sur l'apprentissage de l'utilisation de votre terminal. Il peut être écrasant de ne pas utiliser d'interface graphique si vous êtes nouveau, mais une fois que vous aurez commencé, vous découvrirez rapidement que vous serez plus productif en utilisant un terminal et de nombreux projets nécessitent de toute façon l'utilisation d'un terminal.

Alors que dois-je apprendre ?

Tout d'abord, configurez votre éditeur de code. Visual Studio Code fait fureur en ce moment, mais il y en a d'autres qui vous serviront bien selon vos préférences comme Atom ou Sublime Text . Vous trouverez même des IDE basés sur le cloud comme Repl.it ou vous pouvez simplement commencer avec une barrière d'entrée inférieure en jouant dans CodePen ou JSFiddle .

Quoi qu'il en soit, une fois que vous êtes prêt à coder, vous voulez comprendre ce qu'est le contrôle de source, où git est le plus gros joueur en ce moment. Git est un outil puissant qui vous permet de suivre les modifications apportées au code et de devenir plus productif en collaborant avec d'autres développeurs.

Vous voudrez vous familiariser avec certaines des commandes de base de git, comme l'ajout de nouvelles modifications, ainsi que les branches et comment les utiliser. Git est un monde immense, vous n'avez pas besoin de le maîtriser tout de suite, vous apprendrez rapidement qu'il y a une quantité infinie de nouvelles choses à apprendre au cours de votre voyage vers la maîtrise de votre git fu.

Pour de nombreux outils que vous utiliserez, il existe des interfaces graphiques comme GitKraken , mais vous serez toujours un peu limité dans ce que vous pouvez faire. Apprendre à vous familiariser avec les terminaux par défaut de votre machine ou télécharger d'autres options comme iterm2 ou Xterm.js sera votre meilleur pari. Bonus : vous vous sentirez comme un hacker de films à chaque fois que vous l'utiliserez (ou est-ce juste moi ?).

Ressources

• Premiers pas avec Visual Studio Code https://www.codecademy.com/articles/visual-studio-code
• Ressources Git de Github https://try.github.io/
• Apprenez git en branchant le jeu https://learngitbranching.js.org/
• Introduction à la ligne de commande Mac https://blog.teamtreehouse.com/introduction-to-the-mac-os-x-command-line

 

D'autres choses si vous voulez aller plus loin

Il y a tellement plus avec lequel vous pouvez rapidement descendre dans un terrier de lapin. Rappelez-vous de ne pas disperser votre concentration et essayez de ne pas vous submerger. Mais si vous vous sentez plutôt bien là où vous êtes, il existe d'autres concepts qui ne vous aideront que lorsque vous releverez des défis dans le monde réel.

Les tests et les différentes méthodologies

Écrire du code est une chose, mais être capable de mettre en place des tests efficaces aidera à durcir votre code et empêchera les bogues de sortir. Vous ne voulez pas perdre votre temps futur ou même coûter de l'argent à votre produit lorsque le site tombe en panne. Apprendre à écrire des tests et les différentes approches est important pour solidifier votre code.

Outils de navigateur comme Chrome DevTools

L'un des outils les plus puissants que vous puissiez avoir lors du débogage, à mon avis, est de pouvoir déboguer votre application dans le navigateur.

Qu'il s'agisse de regarder comment le DOM est rendu, de jouer avec le CSS ou de déboguer vos requêtes réseau, vous apprendrez rapidement comment gagner du temps et identifier plus facilement d'où vient le bogue.

HTTP et comment déboguer les requêtes dans le panneau réseau

Étant donné que le Web est basé sur Internet, votre application fera finalement des requêtes à d'autres serveurs. Lorsque cela se produit, comprendre les points d'étranglement de la demande ou simplement comment une demande est faite peut vous aider à comprendre pourquoi votre application semble lente ou pourquoi votre bouton de sauvegarde ne fonctionne pas.

Avoir une compréhension de base du fonctionnement des requêtes et de la façon de les visualiser pour le débogage vous aidera grandement dans votre parcours.

Logiciels Open Source et gestionnaires de packages

Celui-ci n'est pas tant une compétence ou un outil pour apprendre qu'une façon dont le logiciel est distribué. Lorsque vous commencerez à créer des solutions de code, vous découvrirez que beaucoup d'entre nous s'appuient sur des packages open source. La plupart du temps, c'est via npm si vous écrivez du Javascript, ce qui nous aide à devenir plus productifs sans avoir à réinventer la roue à chaque fois.

Passez un peu de temps à comprendre le concept open source et envisagez même de redonner en contribuant à votre projet préféré. Donner un coup de main est généralement très apprécié, vous aidera à acquérir de l'expérience et vous pourrez peut-être même marquer des butins gratuits lors de votre première demande de tirage approuvée ! Soyez juste respectueux là-bas, il y a aussi une vraie personne de l'autre côté de la demande.

Quoi d'autre?

Cette liste peut s'allonger indéfiniment car il y a tellement de choses dans le monde du codage. Selon vous, qu'est-ce qui est important dans le parcours pour devenir un maître du développement ? Envoyez-moi un tweet ou un DM si vous pensez que j'ai raté quelque chose d'important !

 

Tu es en feu! Rassembler le tout

Compte tenu de toute l'expérience que vous aurez accumulée avec ce qui précède, vous devriez être en mesure de créer vous-même une application complète du début à la fin. Comprenez-vous le pouvoir que vous avez?

C'est là que le plaisir commence. Essayez de créer une nouvelle application - peu importe ce qu'elle est, construisez simplement quelque chose. La meilleure chose que vous puissiez faire pour apprendre est d'acquérir de l'expérience en faisant. Peu importe que ce soit l'un des millions de tutoriels todo que vous trouverez ou en vous apprenant à coder en construisant l'un des plus grands réseaux sociaux comme le créateur d'Instagram .

À partir de là, vous devriez pouvoir créer :

• Une application Web front-end qui s'exécute dans le navigateur
• Services backend auxquels votre application Web peut envoyer des demandes via des endpoints
• Écrivez un script à brancher sur un outil CI/CD pour automatiser votre processus de construction et de déploiement
• Bonus : prendre de bonnes décisions sur l'apparence de votre interface afin que les gens puissent réellement l'utiliser !

Allez-y et construisez ! publiez sur Twitter en utilisant le hashtag #letCodeJourney. Nous aimerions en savoir plus sur où vous avez été et ce que vous avez construit ou où vous allez et ce que vous voulez construire.