Développement Web en 2020: quels outils de codage vous devriez apprendre

Aujourd'hui, l'un de mes professeurs préférés, Brad Traversy, a publié un aperçu de ce qu'il vous recommande d'apprendre pour devenir développeur Web en 2020.

Brad traverse une grande partie du battage publicitaire que vous entendez sur les réseaux sociaux. Ses conseils sont pratiques et réalistes. Et je suis d'accord avec lui sur à peu près tout ce qu'il vous recommande d'apprendre.

L'essentiel sur lequel Brad insiste - et sur lequel j'insiste toujours - est de ne pas se sentir découragé ni de se laisser submerger.

Rappelez-vous: le programme de freeCodeCamp couvre la plupart de ces outils et a aidé plus de 40 000 personnes à trouver un emploi en tant que développeur. En cas de doute, concentrez-vous simplement sur cela.

J'ai résumé les principales idées de Brad ci-dessous pour votre commodité. Cela dit, je vous encourage à regarder sa vidéo complète, que j'ai intégrée ci-dessous. Il ajoute beaucoup de détails bien au-delà de ce que ces notes véhiculent. C'est une montre de 73 minutes.

Développement Web en 2020: un aperçu

L'objectif principal de la vidéo est de vous familiariser avec certains des outils de développement Web les plus courants disponibles pour les développeurs Web.

"Je n'essaye pas de vous submerger de technologies. Ce ne sont que des options dont vous disposez ... Il y a beaucoup de technologies là-bas. Quand vous entendez quelque chose comme Nuxt ou Gatsby, je veux que vous sachiez ce que c'est. Et puis vous pouvez choisir si vous voulez l'apprendre ou non. "

Brad commence par encourager les gens à demander d'abord ce qu'ils veulent faire. Voulez-vous travailler sur une entreprise de produits? Ou travailler en tant que consultant? Voulez-vous devenir indépendant? Ou créer votre propre produit?

Beaucoup de ses conseils sur ce qu'il faut apprendre se résument à vos objectifs. Et il encadre beaucoup de ses suggestions d'outils dans cette optique.

Comme point de départ, il recommande d'apprendre ce qu'il appelle «les nécessités».

Il souligne une chose contre-intuitive: vous n'avez pas besoin d'un ordinateur sophistiqué pour le développement Web. "Ce n'est pas comme le développement d'un moteur de jeu ou quelque chose comme ça, donc vous pouvez utiliser un ordinateur portable ou de bureau de milieu de gamme, ou même dans certains cas un ordinateur bas de gamme."

Il utilise MacOS, Windows 10 et Linux pour les serveurs cloud et même pour certains de ses serveurs multimédia.

Il est un grand fan de VS Code pour son éditeur et utilise Chrome et ses DevTools intégrés pour le débogage basé sur le navigateur. Cela dit, il pense que Firefox a également parcouru un long chemin et constitue une alternative viable.

Il recommande de commencer avec du HTML et du CSS standard et d'apprendre de nouveaux outils CSS tels que Flexbox et Grid.

Il dit que l'apprentissage de la conception Web réactive en 2020 devrait être une évidence. "Chaque projet sérieux que vous créez doit avoir une belle apparence et être entièrement utilisable sur tous les appareils."

Au lieu de vous fier à des frameworks CSS comme Bootstrap, il vous recommande de vous entraîner à créer vos propres composants CSS modulaires que vous pourrez ensuite réutiliser tout au long de votre projet.

Cela dit, il dit que vous pouvez les rencontrer lorsque vous travaillez sur des projets pour différents employeurs.

Il mentionne spécifiquement Tailwind, dont je n'avais jamais entendu parler auparavant. Tailwind est un peu différent des autres frameworks CSS. Il est axé sur les «classes d'utilité» que vous pouvez combiner pour accomplir ce que vous voulez avec la conception.

Il n'est pas surprenant que Brad recommande d'être vraiment bon avec JavaScript.

Apprendre à un rythme pratique

Tout au long du guide de Brad, il insiste à plusieurs reprises sur la nécessité d'être pratique.

Oui, il existe des bonnes pratiques pour tout. Mais dans de nombreux cas, il existe un moyen suffisamment efficace pour vous aider à progresser plus rapidement et à en faire plus, sans vous embourber dans les outils.

L'une des choses les plus intéressantes (et peut-être hérétiques) qu'il dit:

«Il n'est pas nécessaire d'apprendre DevOps et AWS et toutes ces choses pour un petit site. Un site d'hébergement ou un site d'hébergement géré comme InMotion ou Hostgator est très bien. Il vous permet de faire [le déploiement] directement dans le navigateur. Il n'est pas nécessaire de compliquer les choses. "

Il soutient que même en 2020, il y a quelque chose à dire sur l'utilisation d'outils familiers.

Pour les personnes novices dans le développement Web, Brad recommande d'abord de pouvoir travailler en tant que développeur Web frontal de base. Cela vous permettra de créer des sites Web pour les entreprises locales en tant que pigiste.

"Les hipsters diront que vous devez absolument utiliser un framework frontal. Je ne pense pas que ce soit vrai. Si vous voulez rendre des modèles sur le serveur sans utiliser un framework frontal, je pense que c'est tout à fait correct, mais il y en a beaucoup emplois qui recherchent quelque chose comme React ou Vue. "

Mais une fois que vous êtes prêt à vous attaquer aux frameworks frontaux, il vous recommande d'explorer React, Vue et Angular. "Essayez les trois et trouvez celui que vous aimez le plus."

Il donne également un clin d'œil à Svelte - qui n'est pas un framework, mais plutôt un compilateur. Mais il dit que c'est probablement trop nouveau pour essayer de le reprendre en 2020.

Et il discute de la popularité croissante du rendu côté serveur. Le routage basé sur le système de fichiers signifie que vous n'avez pas à créer un fichier de routage compliqué. Au lieu de cela, vous pouvez simplement placer les fichiers dans le répertoire dans lequel vous souhaitez qu'ils se trouvent.

Les deux outils de rendu côté serveur populaires sont Next.js (pour React) et Nuxt.js (l'option Vue).

Une autre tendance émergente est les rendus de site statiques, dont il dit que vous n'avez pas besoin d'apprendre mais que vous devez en être conscient. Par exemple, les sites Gatsby sont extrêmement rapides et n'ont pas besoin de serveur.

Outils de développement back-end

Pour le développement côté serveur, Brad préfère Node.js pour sa vitesse et parce qu'il peut utiliser JavaScript à la fois en front et en back-end.

Pour les frameworks de développement côté serveur, il recommande d'apprendre Express car c'est le plus populaire et «cela vous donne beaucoup de liberté pour construire les choses comme vous le souhaitez à votre façon».

Il utilise également Python pour certains projets et le recommande également.

"Python a deux frameworks impressionnants. Django est un framework large et complet, où Flask est plus minimaliste. Il vous donne ce dont vous avez besoin mais vous prenez le reste des décisions. Honnêtement, je ne peux pas choisir l'un des deux, je aimez-les tous les deux et utilisez-les pour différentes choses. "

Et il est prompt à venir à la défense de PHP:

"Beaucoup de gens donnent de la merde à PHP et c'est dommage car PHP peut être un excellent langage. Il est pratique et simple à déployer à peu près n'importe où. PHP est idéal pour les pigistes qui ont besoin de sortir des choses rapidement. Si vous prévoyez de le faire. travaillant pour une grande entreprise, PHP n'est peut-être pas le meilleur choix, mais si vous travaillez à la pige et construisez des projets personnels, PHP peut être un excellent choix. C'est devenu cool de bash PHP. PHP était la première langue que j'ai apprise et j'aime toujours beaucoup il ... Si vous regardez le code Laravel, il est très élégant. "

Brad fait également un tour d'horizon rapide des bases de données et recommande le PostgreSQL favori éternel.

D'autres outils qui sont probablement là pour rester

GraphQL est une alternative à REST pour les API. Il existe plusieurs cours qui couvrent GraphQL à la fois sur la chaîne de Brad et sur la chaîne de freeCodeCamp. Mais il dit: "GraphQL n'est pas quelque chose que vous devez apprendre ces jours-ci, mais il est assez grand pour que je pense que c'est là pour rester. C'est plus qu'une tendance."

Brad parle également des systèmes de gestion de contenu (CMS) et de la façon dont ils évoluent vers de nouvelles options «sans tête» où vous les utilisez simplement comme back-end et codez votre propre front-end.

«Les CMS sont très pratiques pour les pigistes qui ont des clients qui veulent pouvoir se connecter et créer leurs articles de blog et des trucs comme ça. Beaucoup de gens critiquent WordPress, mais il y a un énorme pourcentage de sites Web sur Internet qui sont gérés par WordPress et c'est toujours très populaire. "

Pour les serveurs Web, il préfère NGINX à Apache car «cela semble être moins compliqué». Nous utilisons largement NGINX chez freeCodeCamp et je suis enclin à être d'accord.

Brad explique également le fonctionnement de la virtualisation et explique comment elle peut simplifier des projets plus complexes en normalisant l'environnement sur plusieurs ordinateurs. Mais il met en garde contre toute tentative de virtualiser tout:

"Docker est vraiment bon pour les équipes. Ce que je n'aime pas, c'est quand les gens disent que vous devriez toujours utiliser Docker. C'est juste une préférence. Si vous voulez simplement exécuter un serveur LAMP local, il n'y a rien de mal à cela. Ne ressentez pas de pression pour apprendre quelque chose comme Docker. "

Et il ajoute, pour souligner quelque chose que je ne saurais trop insister personnellement: "Je sais que beaucoup de types ringards veulent juste compliquer les choses et je déteste ça. Ce n'est pas parce que j'énumère tout cela que je le pousse tu."

Il s'empresse également de souligner que la plupart des grandes entreprises ont des équipes DevOps dédiées (également appelées «ingénieurs de fiabilité de site») qui peuvent faire beaucoup de choses pour vous.

Agréable d'avoir des compétences que vous pouvez apprendre en tant que spécialités

Si vous souhaitez tester vos mains lors du développement d'applications mobiles, Brad recommande fortement le framework Flutter. Il utilise Dart, qui est un langage plus obscur. Il décrit Dart comme quelque part entre Java et JavaScript, et dit que si vous connaissez l'un ou l'autre de ces langages, vous devriez pouvoir le prendre.

Son deuxième choix pour le développement d'applications mobiles est React Native, qui est facile à choisir si vous connaissez déjà React.

Brad fait ensuite un excellent travail en expliquant ce que sont les Progressive Web Apps et certains de leurs avantages. Voici la diapositive, mais encore une fois, je vous encourage fortement à regarder sa vidéo complète.

Puis il aborde Electron, qui vous permet de créer des applications de bureau en utilisant JavaScript. Il était sceptique au départ, mais dit que certaines de ses applications de bureau préférées - comme VS Code et Discord - sont maintenant construites à l'aide d'Electron.

Il mentionne le JAMstack (JavaScript, API et Markup) et l'architecture sans serveur. Ce sont des sujets plus avancés sur lesquels sa chaîne et la chaîne YouTube de freeCodeCamp proposent également des didacticiels vidéo.

Et puis il arrive aux grandes tendances pour 2020.

Apprentissage automatique et assemblage Web

Ce n'est pas parce que tout le monde parle d'apprentissage automatique que vous devez tout abandonner et l'apprendre. C'est ainsi qu'il préfigure cette étape de son discours.

Et oui, vous pouvez également faire du machine learning en JavaScript.

"Python est le roi de l'apprentissage automatique. Mais même avec JavaScript, vous avez TensorFlow.js, vous avez Brain.js pour créer des réseaux de neurones et faire des choses vraiment intéressantes."

Il ressort clairement de la façon dont il parle de Web Assembly qu'il est plutôt excité à ce sujet.

"Web Assembly en est encore à ses débuts, mais je pense que nous allons en voir plus cette année. Traditionnellement, nous utilisons JavaScript sur la page Web pour manipuler le DOM et exécuter des calculs. JavaScript a des limitations en termes de vitesse. Un langage comme C ou C ++ est beaucoup plus rapide que JavaScript. Web Assembly est donc un code d'octet de bas niveau efficace qui peut être exécuté par un navigateur et il est extrêmement rapide. Il peut être généré par des langages comme C, C ++ et Rust. "

Rust est l'un des langages que vous pouvez utiliser avec WebAssembly (en plus de C et C ++). C'est beaucoup plus facile à apprendre et à utiliser que C et C ++.

Mais il est important de noter que WebAssembly ne vous dispense pas d'avoir à apprendre JavaScript.

«Vous pouvez presque considérer JavaScript comme le patron, et il peut dire à Web Assembly ce qu'il faut faire. Cela nous permet donc d'utiliser des langages de bas niveau très rapides comme le C ++ dans nos applications Web, ce qui nous donne beaucoup plus de fonctionnalités, comme des jeux vidéo et des outils de montage vidéo de niveau supérieur directement dans le navigateur - des choses qui sont impensables avec juste JavaScript. "

En conclusion, il déclare: «Plus vous apprenez, plus il est facile d’en apprendre davantage et d’intégrer toutes ces technologies ensemble. Essayez de ne pas vous sentir submergé. Faites un pas à la fois, faites des recherches et déterminez ce que vous vouloir faire."

Encore une fois, je tiens à remercier Brad Traversy pour la création de cette vidéo complète.

Les gens me demandent tout le temps "que dois-je apprendre si je veux devenir développeur Web?" Et ma réponse est "utilisez simplement freeCodeCamp comme programme de base et développez-vous dans d'autres ressources d'apprentissage au fur et à mesure."

Et je suis heureux de dire que la chaîne YouTube Traversy Media de Brad est l'une de ces ressources supplémentaires que je recommande le plus fortement.