Introduction
Dans les prochaines semaines, mes collègues prévoient de commencer à utiliser VSCode pour coder avec les produits d'InterSystems. Parmi les nombreux avantages, je soulignerais la possibilité de se connecter facilement à d'autres technologies, telles que GitHub. En outre, VSCode propose également une vaste boutique d'extensions, où vous pouvez trouver de nombreux add-ons gratuits qui rendent le codage plus rapide et plus efficace. Enfin, pour conquérir le cœur de tous les développeurs, c'est open source.
Cela étant dit, commençons le tutoriel. N'hésitez pas à sauter certaines étapes si vous vous sentez à l'aise pour les réaliser sans aide.
Étape 1 - Téléchargement et installation de VSCode
Recherchez "VSCode download" ou cliquez sur this linkce lien pour télécharger à partir de la page officielle. Sélectionnez l'installation correcte pour votre ordinateur et exécutez le fichier téléchargé.
.png)
Une fois l'exécutable lancé, il vous sera demandé d'accepter la licence, de sélectionner quelques préférences (qui sont très personnelles et dont je ne parlerai pas dans ce texte), et de procéder à l'installation.
Étape 2 - Installation des extensions InterSystems
Ouvrez votre VSCode dans l'onglet Extensions et recherchez le paquet ObjectScript Extension Pack dans la boutique.
.png)
Installez le paquet complet.
Étape 3 - Configuration de votre VSCode pour vos instances
Une fois les extensions installées, vous devriez avoir un onglet InterSystems. Vous pouvez le sélectionner et cliquer sur "+" dans la section des serveurs, comme indiqué ci-dessous, et vous serez invité à fournir des informations sur la connexion, telles que l'hôte, le port, le nom d'utilisateur et le mot de passe.
.png)
Sinon, vous pouvez aller dans votre fichier VSCode general settings.json, que vous pouvez trouver en cliquant sur l'engrenage de gestion .png)
sur le côté gauche en bas de l'écran, en sélectionnant les configurations, et en cliquant sur "Ouvrir les paramètres (JSON)" ("Open Settings (JSON)") .png)
sur le côté droit en haut de l'écran.
Là, vous pouvez coller le fragment JSON suivant, en le modifiant pour qu'il pointe vers votre instance.
"intersystems.servers": {
"[YOUR SERVER NAME]": {
"webServer": {
"scheme": "http",
"host": "127.0.0.1",
"port": 53472
},
"username": "_system"
}
Étape 4.1 - Connexion à un serveur et à un espace de noms pour le développement local
Toujours dans l'onglet InterSystems, sélectionnez la section Explorer et cliquez sur le bouton "Choisir le serveur et l'espace de noms" (Choose server and namespace).
.png)
Vous devriez être invité à choisir parmi les serveurs ajoutés lors de la dernière étape, votre nom d'utilisateur et votre mot de passe, ainsi qu'un espace de noms.
Ensuite, toujours dans le même onglet, vous pouvez utiliser la section d'exploration (Explore) ou la section des projets (Projects) pour choisir les classes et/ou les projets que vous souhaitez exporter. Si vous choisissez ce type de développement, vous pouvez ouvrir les fichiers exportés dans un espace de travail VSCode et vous connecter à GitHub, par exemple.
Étape 4.2 - Connection à un serveur et à un espace de noms pour développer sur le serveur (ma préférence)
Ouvrez l'onglet Intersystèmes dans la section Serveurs et choisissez un serveur.
.png)
Vous pouvez choisir un projet et cliquer sur le crayon pour l'ouvrir en mode édition sur votre espace de travail ou ou sur l'œil pour l'ouvrir en mode lecture.
.png)
De même, vous pouvez choisir entre les mêmes options directement sur l'espace de noms pour ouvrir tous ses fichiers dans l'espace de travail (ma préférence)
.png)
Dans les deux cas, il se peut que l'on vous demande à nouveau un nom d'utilisateur et un mot de passe.
Étape 5 - Codage
Dans l'onglet de l'explorateur, après la dernière étape, votre espace de travail ressemble à l'image ci-dessous.
.png)
Vous pouvez créer un fichier et de nouveaux dossiers en cliquant avec le bouton droit de votre souris sur un répertoire, en sélectionnant "nouveau fichier" ("new file") et en le nommant avec le modèle FOLDERNAME.FILENAME.cls. En d'autres termes, vous devez nommer les dossiers en séparant les noms par des points. Le nom précédant le dernier point sera le nom du fichier, et le nom suivant le dernier point sera l'extension des fichiers COS, cls.
Par exemple, vous pouvez nommer votre fichier comme dans l'image ci-dessous, "folderone.foldertwo.filename.cls", dans le dossier User, et cliquer sur "Enter".
.png)
Ainsi, le répertoire et le fichier suivants devraient être créés automatiquement.
.png)
.png)
Maintenant, vous êtes prêt à coder comme vous le feriez en Studio.
Quelques conseils supplémentaires
- Vous pouvez appuyer sur Ctrl+Shift+V pour ouvrir les fichiers .int.
- Attention: contrairement à Studio, Ctrl + S dans VSCode compilera le fichier en plus de l'enregistrer.
- Maintenant, je vais vous montrer la meilleure fonctionnalité que j'ai rencontrée jusqu'à présent en codant avec VSCode. C'est de l'or en barre. Imaginez que vous ayez une instance de développeur pour les premières phases d'un projet, une autre instance pour les tests avec vos clients, et peut-être même encore une autre pour la production. Il peut être fastidieux de migrer les fichiers et les modifications entre les instances de Studio. Cependant, si vous utilisez VSCode, c'est assez simple.
Dans l'onglet Explorateur (Explorer), ouvrez la source et le fichier cible. Par exemple, si j'ai un fichier définissant des données persistantes, et que j'ai ajouté des champs sur mon serveur de développement, et que je souhaite les transférer sur mon serveur de production, j'ouvrirai le fichier de développement et le fichier de production pour les mêmes données persistantes (une discussion sur l'ouverture de plusieurs serveurs ou espaces de noms est abordée dans la rubrique suivante).
Une fois que les deux sont ouverts, ils apparaissent dans la section "Éditeurs ouverts" ("Open Editors").
.png)
Sélectionnez le fichier source avec le bouton droit de votre souris et cliquez sur "Sélectionner pour comparer" ("Select to compare"). Cliquez avec le bouton droit sur le fichier cible et choisissez "Comparer avec sélectionné" ("Compare with selected").
BOUM! Vous aurez alors ce magnifique fichier de comparaison ouvert, comme illustré ci-dessous.
.png)
La barre située à droite de l'écran indique les différences entre les fichiers, et vous pouvez l'utiliser pour naviguer simultanément entre eux. Les couleurs rouge et verte signifient que quelque chose diffère dans les fichiers. Le rouge signifie que le fichier source contient du texte qui ne figure pas dans le fichier cible. Le vert signifie que le fichier cible contient du texte qui ne figure pas dans le fichier source.
Cliquez sur les flèches du milieu pour transférer les modifications de la source vers la cible.
En outre, cliquez sur la flèche biface .png)
dans le coin supérieur droit de l'écran pour changer les côtés des fichiers : la source sera la cible et vice versa.
.png)
En appuyant sur Ctrl+S lorsque l'éditeur est ouvert, les deux fichiers sont enregistrés et compilés.
- Vous pouvez ouvrir plusieurs instances et espaces de noms à la fois dans votre espace de travail, tant que votre ordinateur peut le gérer. Cependant, pour que vous puissiez vous faire une idée, ces dernières semaines, j'ai travaillé avec deux espaces de noms lourds provenant de différentes instances, Studio, Microsoft Teams (qui est scandaleusement lourd), et deux autres applications pour se connecter à la base de données et aux API, le tout en même temps, avec un ordinateur ayant la configuration suivante: 8 Go de RAM et CPU de 2,10 GHz. La seule chose qui a parfois été un peu lente, c'est Studio.
Poursuite de la discussion
J'aimerais parler de débogage avec VSCode. Je n'ai pas encore trouvé quelqu'un qui l'apprécie plus que les outils de débogage de Studio. Personnellement moi, je ne suis pas très habitué à utiliser les outils de débogage VSCode avec les produits InterSystems, et même si Studio est beaucoup plus lourd, je préfère le laisser ouvert lorsque j'ai besoin de déboguer. Comment combinez-vous ces technologies? Quels sont les outils que vous préférez?