Comment devenir développeur web

N'avez-vous pas déjà rêvé d'avoir votre site web, y partager vos passions, présenter un business naissant, lister les meilleures vidéos de chat du web (c'est que moi?) - il semble aujourd'hui indispensable de posséder son site web ! Malheureusement, un petit tour sur le web pour apprendre comment faire et nous voilà noyer dans une mer d'acronymes aussi laconiques qu'incompréhensibles : CMS / HTML / CSS / JS / DOM / CDN / SEO / WYSIWYG / API 😴😴😴

Dans cet article, je vais essayer de vous guider dans les prémices du développement web - Du pourquoi au comment, étudions les différentes étapes qui vous permettront de devenir un développeur web aguerris !

Ce métier va me plaire ?

C'est la toute première question à se poser ! Le métier de développeur est prisé par bon nombre d'entreprises - D'après pôle-emploi, près de 50% des personnes formées pour le développement trouve un travail moins de 6 mois après leur formation :

Alléchant n'est-ce pas ? Et attendez, j'ai même pas encore parlé du salaire 😎 Mais devenir développeur n'est pas une mince affaire, loin de là. Certains points sont importants à considérer avant de se lancer corps et âme dans ce monde de 0 et de 1.

Du code, du code et encore du code

Bah oui, être développeur web c'est coder et pour savoir coder, il faut du temps... beaucoup de temps ! Il faudra être prêt à investir ce temps en restant assit devant un ordinateur des heures durant.

Autre particularité du développement dont, nous développeurs, parlons très peu : Un codeur passe parfois plus de temps à corriger des problèmes qu'à développer de nouvelles fonctionnalités. Voilà une bien triste réalité, je vous l'accorde

Malgré ça, il ne faudra pas vous décourager parce qu'il n'y a rien de plus plaisant qu'un programme sur lequel nous avons passé du temps et qui finit, enfin, par fonctionner.

L'apprentissage ne s'arrête jamais

Le web évolue à une vitesse ahurissante ! Des mises à jour ainsi que de nouveaux outils apparaissent presque tous les jours.

Une fois votre apprentissage terminé, il vous sera nécessaire d'effectuer de la veille technologique et continuer d'apprendre. Heureusement, beaucoup de blogs et de forums sont là pour nous faciliter la vie, mais il vous faudra rester curieux pour réussir dans ce domaine.

Ce sera dur mais pas insurmontable

J'entends souvent « pour être bon développeur, il faut être bon en math » - je suis la preuve vivante que c'est faux ! Il sera néanmoins nécessaire d'acquérir une réflexion méthodique ainsi que la logique informatique qui vous permettra de résoudre les algorithmes* auxquels vous aurez affaire.

Ce sera parfois difficile au vu de la quantité d'informations à apprendre, vous aurez même parfois l'impression d'avoir été jeté dans la mer sans bouée. Pour avoir formé des dizaines de personnes en reconversion professionnelle, je peux vous garantir que cette phase n'est qu'éphémère ! À force d'acharnement, vous finirez par lire le code aussi naturellement qu'un livre :

Un algorithme consiste en une suite d'instructions ordonnée fournie à la machine pour générer un résultat voulu. Afficher une fenêtre informative suite au click d'un client peut résulter d'un algorithme par exemple !

Par où commencer

Avant toute chose, il est important de comprendre le fonctionnement général du web lors de l'accès une page.

1. Vous ouvrez votre navigateur et entrez le nom de domaine (ex: google.com) du site auquel vous souhaitez accéder ;
2. Votre navigateur effectue une requête à un serveur* pour récupérer votre page sous la forme de code ;
3. Le navigateur traduit le code renvoyé en formes et couleurs.

Un serveur est un ordinateur connecté à internet accessible 24h sur 24 et 7 jours sur 7. Il permet, entre autres, d'accéder aux sites web sur lesquels nous naviguons au quotidien.

Plusieurs étapes ont volontairement été omises entre la phase 1 et 2, si vous souhaitez avoir plus de détails, je vous conseille cet article.

Pour résumé tout ça simplement, une page web = du code ! Et c'est par là que l'on va commencer 😁 Comme vu à l'étape 3, le serveur ne renvoie que du code au navigateur. Ce code va permettre de définir la structure visuelle du site (sur Chrome ou Firefox, vous pouvez y accéder avec le raccourci CTRL + U).

Ce même code va automatiquement être interprété par votre navigateur pour générer au final... cette page :

Difficile à y croire hein ? C'est pourtant vrai, la machine va être capable d'interpréter chacune des lignes de code pour générer les couleurs et les formes. C'est un peu comme un architecte réalisant les plans d'un gigantesque bâtiment ! Sur papier, il ne paie pas de mine mais une fois le plan envoyé aux constructeurs puis la construction terminée, on obtient le grand et magnifique building.

Nous serons donc les architectes et notre objectif va être de comprendre comment réaliser des plans compréhensibles par nos constructeurs - j'ai nommé les navigateurs web 🌎

HTML & CSS - Les langages indispensables pour un développeur web

C'est la première étape de votre apprentissage ! HTML et CSS sont deux langages qui vous permettront respectivement de définir la structure et de mettre en forme les éléments de votre page web. Ils s'utilisent de pair et sans eux, impossible d'afficher quoi que ce soit sur le navigateur d'un client ! Je vous conseille cet article afin de creuser un peu plus en profondeur et apprendre à implémenter un formulaire HTML.

JavaScript - Dynamiser vos pages web

C'est l'étape d'après, plus compliquée déjà que la première mais indispensable. En effet, il ne suffit pas d'afficher une page web pour la rendre utilisable, il s'agit également de créer de l'interaction avec votre client ! Et pour ce faire, HTML ainsi que CSS ne suffisent pas - il nous faut faire cela en JavaScript. Ce langage de programmation également interprété par votre navigateur vous permettra de créer des interactions, de communiquer avec un ordinateur distant, d'animer votre page etc..

Par exemple, il peut vous permettre de réagir à un évènement utilisateur en effectuant une action particulière. Cliquez sur le bouton ci-dessous pour tester !

---

---

Comme vous pouvez le voir, une pop-up s'affiche et la couleur du texte change automatiquement, notre site est dynamique et c'est grâce à javascript ! Voici le code permettant de provoquer ce comportement :

var toggle = false;

function sayHi() {
    var el = document.getElementById("paragraph");
    alert("Salut et bienvenue sur mon article ! :D");

    if(!toggle) {
        el.style.color = "red";
    } else {
        el.style.color = "";
    }
        
    toggle = !toggle;
}

Évidemment, l'exemple précédent n'est pas très beau, mais en allant plus loin, vous pourrez implémenter des effets bien plus poussés. Voici une animation JavaScript appliquée sur notre page d'accueil :

Développement serveur & base de données

Le développement "côté serveur" (ou backend) comme on l'appelle communément correspond au programme exécuté sur l'ordinateur permettant de renvoyer la page web. C'est lui qui va nous permettre de garder un état sur toutes les données que le client souhaite enregistrer.

L'utilité me demandez-vous ? Bah si vous gérez un site e-commerce de pâtisserie et qu'un client souhaite réaliser une commande, il faut bien stocker l'état de sa commande quelque part. C'est côté serveur que cela se passe, dans la base de données assignée à cette tâche. Cette base n'est accessible que par vous, développeurs - Cela empêchera à n'importe qui de voir les informations de paiement des autres 😉 Une fois la commande réalisée, vous pourrez de votre côté accéder à la base de données afin de savoir à quelle adresse envoyer les gâteaux 🧁

Le développement côté serveur se traduit par différents langages, contrairement aux sites web, vous avez ici l'embarras du choix. Voici un florilège des langages serveurs disponibles :

PHP - Java - Python - NodeJS - .NET - etc.

Chacun possède ses avantages et inconvénients mais tous vous permettront de gérer la partie "back" d'un site web. À vous de faire votre choix 😉

Frameworks - Angular, React, Vue...

Ça, c'est l'étape ultime. Le true final boss. La dernière étape avant de d'être considéré comme un bon développeur. Mais avant d'arriver à cette étape, le chemin est encore long et vous aurez d'autres problèmes à gérer avant celui-ci 😅

Si vous êtes curieux d'en comprendre l'utilité et les fondements d'un framework, voici un article qui vous permettra d'y voir plus clair.

Salaire d'un développeur web

Parlons peu, parlons bien - D'après developpez.net, un bon développeur web est payé entre 3 000€ et 3 700€ bruts par mois (statistiques de 2019).

Je vois vos yeux s'écarquiller 😂 mais c'est normal ! Les développeurs ont beau être majoritairement passionnés et aimer ce qu'ils font, il n'en demeure pas moins vrai que c'est un domaine très technique nécessitant une expertise et une implication conséquente. Il est donc logique d'avoir un salaire à la hauteur des responsabilités et de la complexité des tâches qui leur incombent.

Évidemment, tout cela variera en fonction de votre expérience ainsi que de votre capacité à vous vendre. Une fois en poste, votre salaire pourra rapidement évoluer au vu de la demande intense de développeurs dans le marché actuel. Certains développeurs voient leurs salaires tripler entre le début et la fin de leur carrière 💸

---

Avec cet article, j'espère sincèrement vous avoir donné envie de devenir développeur en vous partageant ma passion du développement web. Si c'est le cas, sachez que Macademia propose un cursus de 6 mois qui vous permettra d'acquérir toutes les compétences pour être un véritable développeur web et web mobile.

Cerise sur le gâteau, cette formation aboutit sur un équivalent BAC + 2. Pour plus d'informations, n'hésitez pas à nous contacter via ce lien 🍧