L'environnement

Nous allons préparer l'environnement pour la série à venir.

Prérequis

Pour cette série, nous aurons besoin de plusieurs logiciels :

• Python 2.7

• Node 8+ (prenez une version 8.x.x)

• Windows Build Tools

• Discord

• Visual Studio Code

• Git

Pour installer les deux premiers logiciels, il vous suffit de taper la commande suivante : npm i -g --add-python-to-path --production windows-build-tools.

En ce qui concerne Discord; Git et Visual Studio Code, c'est très simple. Vous pouvez récupérer Discord, Git, Node et VS Code sur leur site respectif (cliquez simplement sur les liens).

Les installations sont très simples, télécharger les versions 64bits si vous êtes sous Windows x64 (x86 si vous êtes en 32, mac si vous êtes sous un mac etc.). Une fois que vous avez les fichiers pour installer, il suffit d'appuyer sur Next.

Sur cette page nous ne passerons en revue que les prérequis qui requièrent une explication. Nous n'aurons pas besoin de Python, WBT (Windows Build Tools) et Git pour le moment, donc j'expliquerai tout cela plus tard. Node et Discord sont nécessaires afin de pouvoir installer la librairie de notre bot. Il ne reste donc plus que Visual Studio Code, qui sera notre éditeur de texte.

Visual Studio Code

Vous pouvez accéder à la vidéo YouTube en cliquant n'importe où sur cette petite fenêtre (si le lien n'est pas disponible c'est que la vidéo n'est pas encore disponible).

Visual Studio Code est un éditeur de texte qui a été développé par la même équipe qui a construit Visual Studio. L'application est construite à l'aide d’Électron et elle est totalement open-source. De plus, elle fonctionne plus ou moins comme Atom ou Sublime, vous avez un marché d'extension. C'est juste de ça que nous allons parler.

L'écran d'accueil de mon VS Code

Bien entendu, le votre sera différent étant donné que vous n'avez pas le même thème que moi. Voici à quoi le votre devrait ressembler (plus ou moins) :

L'écran d'accueil de votre VS Code

Bien entendu, l'aspect graphique de VS Code n'a aucune importance. Nous allons voir quelles extensions nous allons utiliser et pourquoi.

Les extensions

Pour accéder aux extensions de VSC (Visual Studio Code), il suffit d'entrer la combinaison CTRL + SHIFT + X sur votre clavier. Ensuite il vous suffit de rechercher les extensions que nous allons utiliser dans cette série :

• JavaScript (ES6) code snippets

• Ayu

• Color Highlight

• ESLint

• markdownlint

• npm

• npm intellisense

• Path intellisense

• Prettier - Code formatter

Cela fait beaucoup de choses à installer mais toutes ces extensions vont nous faciliter la vie par la suite. Je vous expliquerai petit à petit ce que les différentes extensions signifient. Une fois les extensions installées, il suffit de relancer votre logiciel.

La première extension que nous allons utiliser est Ayu, il s'agit du thème que j'utilise pour rendre les icônes ainsi que mon VSC comme il est actuellement. Pour changer ces deux choses, rendez-vous dans File > Preferences > Color Theme puis sélectionner Ayu. Ensuite, refaites la même manipulation mais sélectionnez File Icon Theme puis prenez la même option.

Comme dit précédemment, ces différents changements vont permettre de changer l'apparence de votre VSC, les icônes dans votre projet et les couleurs de votre code.

Passons maintenant à certaines fonctionnalités de VSC qui nous seront utiles.

Les fonctionnalités de VSC

En ce qui concerne les fonctionnalités, nous n'allons pas passer en revue toutes les fonctionnalités à l'écrit. C'est pour cela que je vous conseille de regarder la vidéo (j'ai directement mis le lien ci-dessous pour accéder aux fonctionnalités si vous avez lu le reste du guide).

Cliquez n'importe où dans la fenêtre pour accéder directement à la vidéo.

Maintenant que nous avons installé notre environnement et que nous avons vu les différentes fonctionnalités, nous allons créer un serveur et importer notre bot.