Aller au contenu principal

Préparation de l'environnement de développement

Node.js - Installation ou mise à jour​

En début de session, pour la portion client, nous utiliserons Angular comme cadriciel client et vous aurez besoin de Node pour utiliser ce dernier. Normalement, vous devriez déjà avoir Node d'installé, mais vérifiez pour être certain, et surtout vérifiez que vous avez la bonne version.

Vous aurez besoin de la version LTS (Long Term Support) 20.11.1 ou plus récente de Node.

La version LTS au moment d'écrire ces notes est la version 22. Vous pouvez vérifier votre version de Node dans le terminal:

node -v
attention

Assurez-vous que votre version est égale ou plus récente que 20.11.1. Si c'est le cas, il n'est pas nécessaire de mettre à jour.

Installation ou mise à jour à partir de l'installateur​

Si vous devez mettre à jour Node et que vous l'avez installé à partir de l'installateur, vous pouvez simplement télécharger la version la plus récente ici et l'installer: https://nodejs.dev/fr/.

Votre version sera remplacée automatiquement par la plus récente.

Installation ou mise à jour à partir de Chocolatey​

Plusieurs options sont possibles si vous avez installé Node à partir de Chocolatey, faites-moi signe et nous regarderons votre installation.

TypeScript (compilateur) - Installation ou mise à jour​

Cette portion n'est pas obligatoire pour le projet, puisque TypeScript sera en quelque sorte inclus avec Angular, mais pour utiliser le compilateur de façon indépendante, au besoin, tel que présenté dans les notes de cours, cela vous sera utile.

Pour installer globalement TypeScript et son compilateur:

npm install -g typescript

Pour vérifier votre version:

tsc -v

Installation de WebStorm (IDE)​

Il n'y a pas d'IDE obligatoire pour ce cours, vous pouvez utiliser ce que bon vous semble. J'utiliserai WebStorm, une application de JetBrains, et je vous recommande d'utiliser le même IDE. Il est particulièrement efficace pour les projets Angular.

  1. Vous devez vous inscrire via ce formulaire avec votre courriel étudiant (prenom.nom@etu.cegepdrummond.ca) afin d'obtenir une licence étudiante gratuite. https://www.jetbrains.com/shop/eform/students

  2. Pour consulter vos courriels: https://outlook.office365.com/mail/inbox

  3. Installer WebStorm

Correction du français dans WebStorm​

WebStorm peut effectuer une correction minimale du français. Pour activer la correction:

  1. Allez dans file -> settings

  2. Ensuite, Editor -> Natural Languages

  3. Ajoutez Français

  4. Appuyez sur Apply

  5. Dans Grammar and Style, sous Scope, cochez tout.

  6. Appuyez sur Apply

Installation de Postman et création d'un compte​

Postman est une plateforme de développement d'API qui aide les développeurs à construire, tester, documenter et partager leurs APIs. Postman offre une interface utilisateur graphique conviviale qui facilite l'interaction avec les API sans avoir à écrire de code.

L'une des principales fonctionnalités de Postman est la possibilité de faire des requêtes HTTP à une API, qui est une façon standard de communiquer avec les services web. Ces requêtes peuvent être sauvegardées pour une utilisation ultérieure, et organisées en collections pour un accès facile. Postman supporte une variété de méthodes HTTP, comme GET, POST, PUT, DELETE, et bien d'autres, ce qui vous permet de tester presque n'importe quelle API.

Postman offre également un environnement de tests pour vos APIs. Vous pouvez écrire des tests pour chaque requête et les exécuter pour vérifier la réponse de l'API. Ces tests peuvent être utilisés pour la validation des données, l'assurance qualité, ou pour automatiser les tests lors du développement d'une API.

attention

Même si vous avez déjà Postman d'installé, assurez-vous d'avoir un compte Postman. En effet, nous utiliserons des fonctionnalités de collaboration nécessitant un compte.

Joindre l'équipe Postman du Cégep​

Pour profiter au maximum de Postman, vous devrez joindre l'équipe que j'ai créée et qui est associée à un forfait éducationnel Postman. Pour la portion des tests automatisés, le fait de faire partie de l'équipe vous donnera accès à des fonctionnalités supplémentaires nécessaires pour le cours.

  1. Utilisez le lien d'invitation suivant:

    🔗 Joindre l'équipe Postman Cegep de Drummondville

  2. Cliquer sur Accept invite Imgur

  3. Sélectionner votre compte Postman parmi la liste ou encore connectez-vous Imgur

  4. Vous devriez avoir rejoint l'équipe CEGEP DE DRUMMONDVILLE Student Plan 🎉 Imgur

Création d'un compte Supabase​

Dans la première moitié de la session, nous utiliserons le service Supabase comme source de données. Supabase est un service gratuit, mais il est nécessaire de se créer un compte.

  1. Rendez-vous sur la page d'inscription de Supabase: https://supabase.com/dashboard/sign-up

  2. Complétez vos informations et appuyez sur Sign Up. Je vous recommande d'utiliser votre courriel du cegep. img

  3. Confirmez votre courriel à l'aide du lien envoyé par courriel. Vous avez 10 minutes! 🏃 img

  4. Une fois confirmé, créez votre "organisation". Une organisation à l'intérieur de Supabase est un peu comme une équipe. Assurez-vous de choisir:

    • Name: Un nom pour le compte / l'organisation
    • Type: Personal
    • Plan: Free

    img

  5. Appuyez sur Create Organization

  6. À l'écran Create a new project, vous pouvez appuyer sur Cancel, nous allons créer le tout plus tard.

Vous devriez être redirigé vers votre tableau de bord.

img

C'est tout pour l'instant! 🎉