Avez-vous déjà voulu être inventeur ou eu le désir de créer quelque chose? Bien que bon nombre d’entre nous aient ce même rêve, il peut être difficile de savoir par où commencer, et il est déconcertant de penser aux coûts initiaux. Plus inquiétante encore, l’idée d’échouer. Cependant, que se passerait-il s’il n’était pas si effrayant d’inventer une chose à partir de rien? Et si c’était aussi simple que de prendre votre ordinateur portatif, de vous connecter au wifi et d’écrire quelques lignes de code? Ce code se transforme subitement en un programme, en une page Web ou même en une application mobile. Sans même vous en rendre compte, vous avez créé quelque chose. Avec la pratique et la bonne formation, devenir développeur vous rapprochera de votre rêve de concrétiser vos idées : il vous suffit d’un ordinateur et d’un esprit ouvert. Alors, commençons!

Ce que vous allez apprendre:

Fondements du développement
Divers outils et langues de programmation
Ressources pour améliorer vos compétences en développement

Si vous lisez cet article, vous faites déjà un pas pour améliorer vos compétences afin de faire face aux nouvelles réalités. L’Académie du numérique de l’EFPC travaille à la création d’un webinaire interactif de 90 minutes sur le passage vers le numérique au sein de la fonction publique. Il s’agit d’un module qui consiste en une introduction aux normes numériques. De plus, le module présentera encore plus d'étapes faciles à suivre pour faire évoluer votre style de travail de sorte qu’il soit adapté à la nouvelle réalité. Après une mise à l’essai en juillet, le module devrait être lancé en septembre 2020.

Pour commencer

Si vous avez entendu parler de langages de programmation tels que Java, Python, PHP et C++, mais que vous n’avez jamais su par où commencer, cet épisode s’adresse certainement à vous!

Vu le grand nombre de langages, il peut être difficile de décider avec lequel commencer à apprendre, ce qui explique pourquoi un bon nombre de développeurs se tournent vers un ensemble de langages normalisés qui fonctionnent sur différentes plateformes. Des exemples de langages normalisés seraient HTML, CSS et JavaScript. Ces trois langages agissent de concert et étaient initialement destinés aux sites Web. À mesure qu’ils ont évolué, on a commencé à les utiliser pour de plus en plus de choses, et comme ils sont si légers, ils peuvent être exécutés sur presque tous les types d’appareils, que ce soit un téléphone, un réfrigérateur intelligent et même un système de divertissement embarqué (en avion ou en voiture). Des entreprises telles que Uber, Facebook, Instagram et Slack se servent de ces langages pour faire fonctionner leurs applications sur appareil mobile et sur ordinateur.

Il est relativement facile de s’initier aux langages HTML, CSS et JavaScript; de nombreux sites proposent des exercices d’apprentissage interactif (veuillez consulter les ressources recommandées ci-dessous). Pour vous donner une meilleure idée de ce que font ces langages, je vous en donne un aperçu.

HTML

Le langage HTML, ou langage de balisage hypertexte, est utilisé pour mettre en forme le texte d’une page. La syntaxe (ensemble des règles régissant le langage) est assez simple. Imaginons que nous créons un billet de blogue et que nous voulons que le titre soit « Mon nouveau billet de blogue ». Nous écrirons ce qui suit :

<h1>Mon nouveau billet de blogue</h1>

Ensuite, nous voudrions le corps du texte, donc nous ajouterions un paragraphe :

<p>Bienvenue dans mon nouveau blogue! J’espère que vous en aimerez le contenu!</p>

Si on met ces éléments ensemble, voici ce que ça donne:

Texte justifié. Texte de style en-tête indiquant « Mon nouvel article de blogue » en caractères gras, suivi d’un texte de style corps indiquant « Bienvenue sur mon nouveau blogue! J’espère que vous en apprécierez le contenu! »

Comme vous pouvez le voir dans l’exemple, le langage HTML se sert de marqueurs comme <h1> ou <p> avec du texte entre les deux marqueurs pour mettre en forme le contenu d’une page. Si vous voulez en apprendre davantage sur ce langage, vous trouverez le lien vers un tutoriel interactif ci-dessous. 😄

CSS

CSS ou feuilles de style en cascade sont là où on définit l’aspect et la convivialité de notre page HTML. Toujours avec le même exemple, disons que nous voulons que la couleur du paragraphe soit rouge :

p {
    color: red
}

Et souligner le titre :

h1 {
    text-decoration: underline
}

Enfin, nous allons centrer tout le texte de la page :

p, h1 {
    text-align: center
}

Voici maintenant à quoi ressemble notre page:

Texte centré. L’en-tête indique « Mon nouvel article de blogue » (en gros caractères, soulignés et en gras). Le corps du texte indique « Bienvenue sur mon nouveau blogue! J’espère que vous en apprécierez le contenu! » (police de taille normale en rouge)

CSS utilise des sélecteurs comme p {}, où il précise d’abord un élément, puis des propriétés dans les accolades, comme text-align, selon vos préférences. Bien qu’il y ait de nombreux sélecteurs et propriétés modifiables, vous trouverez peut-être utile de recourir à un bon éditeur de code et à des outils de développement tels que Google Chrome puisqu’ils écrivent automatiquement la propriété à mesure que vous la tapez. Commencez simplement par taper underline et text-decoration : « underline » sera automatiquement suggéré. Si vous voulez en apprendre davantage, veuillez consulter les liens vers les tutoriels ci-dessous. 😁

JavaScript

JavaScript est là où toute la logique de l’application est établie. Nous pouvons y interagir avec la page, utiliser des formules mathématiques, échanger des données à partir d’une interface de programmation d’applications (API) et encore plus.
Vos possibilités sont infinies avec JavaScript : tout dépend de votre imagination. Bien qu’il s’agisse d’un langage très puissant, il n’est en réalité pas très difficile d’en apprendre les principes de base. Je vous encourage vraiment à essayer certains des tutoriels de la liste ci-dessous et de vous familiariser avec JavaScript.

Conclusion

Dans cet épisode, nous avons présenté certains principes de base du développement ainsi que les trois principaux langages : HTML, CSS et JavaScript. Ci-dessous, j’ai fourni des ressources qui permettent d’apprendre les fondements de façon interactive. J’ai moi-même utilisé ces sites avant de connaître quoi que ce soit au développement, et je travaille maintenant dans le secteur!

Ressources

Pour commencer votre formation personnelle, je vous recommande d’aller sur W3Schools (en français) ou Codecademy (en anglais) et de voir les tutoriels gratuits et interactifs suivants:

Codecademy | Introduction au HTML (En anglais seulement)
Codecademy |Apprend CSS (En anglais seulement)
Codecademy | Faire un site web (En anglais seulement)
Codecademy | Introduction à javascript (En anglais seulement)
W3Schools | Tutoriel HTML (Cliquez sur l'icône du globe terrestre dans le coin supérieur gauche pour passer en français)
W3Schools | Tutoriel CSS (Cliquez sur l'icône du globe terrestre dans le coin supérieur gauche pour passer en français)

Codecademy offre des cours payants, toutefois, tous les cours de la liste ci-dessus sont gratuits. Il est recommandé de les suivre dans l’ordre indiqué (HTML > CSS > JavaScript).

Une fois que vous aurez visionné les tutoriels, vous pourriez faire quelques essais par vous-même. Pour commencer, vous aurez besoin d’un éditeur de code et d’un navigateur doté d’outils de développement.

Éditeur de code : Visual Studio Code (Code Editor: Visual Studio Code, Le téléchargement est en anglais mais les instructions pour ajouter un pack en français sont disponibles ici)
Navigateur : Google Chrome (Browser: Google Chrome)

Inscrivez-vous à notre bulletin

Jordan Morrison

Devenir un développeur 101