Exercice - Explorer l’interface utilisateur de Visual Studio Code
Visual Studio Code fournit des outils pour les développeurs qui commencent simplement, mais qui sont également extensibles et suffisamment avancés pour les développeurs professionnels.
Dans cet exercice, vous ouvrez Visual Studio Code et effectuez une visite guidée rapide de l’interface utilisateur.
Ouvrez Visual Studio Code et examinez la page d’accueil
Utilisez le menu Démarrer de Windows pour ouvrir Visual Studio Code.
Si vous ouvrez le menu Démarrer de Windows, visual Studio Code doit apparaître comme une application récemment ajoutée. Vous pouvez également faire défiler vers le bas pour rechercher Visual Studio Code.
Une autre option consiste à taper Visual Studio Code dans la zone Recherche Windows dans la barre d’état de lancement en bas de l’écran.
Notez que Visual Studio Code s’ouvre sur une page « Bienvenue » qui inclut des liens et d’autres informations.
La première fois que vous ouvrez Visual Studio Code, la page d’accueil affiche des procédures pas à pas utiles, telles que la prise en main du contenu VS Code . Vous pouvez examiner ces informations à votre guise une autre fois.
Pour fermer la page d’accueil, sélectionnez le bouton Fermer (illustré sous la forme d’un X dans l’interface).
Chaque page ouverte dans l’Éditeur comprend un bouton Fermer (X) situé à droite du titre de la page. L’onglet Page d’accueil s’affiche dans la partie supérieure gauche de la fenêtre Visual Studio Code, sous le menu principal. Si vous pointez le pointeur de la souris sur le X, le mot Fermer s’affiche.
Examiner la barre d’activité et la barre latérale
Notez que la barre latérale à droite de la barre d’activité est réduite.
Vous pouvez vous rappeler que la barre d’activité est la liste verticale des icônes située à l’extrême gauche de la fenêtre Visual Studio Code. Le contenu de la barre latérale dépend de ce qui est actuellement sélectionné dans la barre d’activité.
Positionnez votre pointeur de souris sur la barre d’activité, puis pointez le pointeur de la souris sur chacune des icônes pour afficher les étiquettes.
Une étiquette s’affiche lorsque vous pointez sur les icônes. Vous devez voir les boutons de barre d’activité affichés dans l’image suivante :
De haut en bas, les icônes de barre d’activité sont les suivantes : Explorateur, Recherche, Contrôle de code source, Exécuter et Déboguer, Extensions, Comptes et Gérer.
Dans la barre d’activité, sélectionnez Explorateur.
La barre latérale doit ouvrir et afficher des informations contextuelles.
Notez que la barre latérale est désormais étiquetée EXPLORER.
L’affichage EXPLORER est utilisé pour accéder aux dossiers de projet et aux fichiers de code.
Visual Studio Code mémorise votre historique de travail et ouvre les fichiers projet les plus récents lorsqu’il s’ouvre. Étant donné que c’est la première fois que vous avez ouvert Visual Studio Code, aucun dossier de projet n’est ouvert.
Dans la barre d’activité, sélectionnez Extensions.
Notez que la barre latérale est désormais étiquetée EXTENSIONS.
Prenez un moment pour examiner les informations affichées dans la vue EXTENSIONS .
Les extensions Visual Studio Code vous permettent d’ajouter des langages de codage, des débogueurs et d’autres outils à l’environnement pour prendre en charge votre flux de travail de développement. Vous allez installer une extension C# plus loin dans ce module.
Dans la barre d’activité, pour fermer la barre latérale extensions , sélectionnez Extensions.
Examiner les options du menu supérieur
Pour afficher les options du menu Fichier, sélectionnez Fichier.
Notez les options Nouveau, Ouvrir, Enregistrer et Fermer répertoriées dans le menu Fichier .
Prenez une minute pour examiner les options de menu Modifier , puis chacun des autres éléments de menu de niveau supérieur.
Notez que plusieurs menus incluent des options d’interaction avec votre code.
Par exemple:
- Le menu Modifier inclut des options permettant de rechercher, remplacer et désactiver les commentaires de code, ainsi que les commentaires de couper, copier, coller, annuler et rétablir standard.
- Le menu Sélection inclut des options pour sélectionner et manipuler des lignes de code.
- Le menu Exécuter inclut des options permettant d’exécuter et de déboguer votre application.
Dans le menu Terminal , sélectionnez Nouveau terminal.
Prenez un moment pour examiner le contenu du panneau Terminal.
Vous pouvez basculer entre les onglets (PROBLÈMES, SORTIE, CONSOLE DEBUG et TERMINAL) et pointer le pointeur de la souris sur les boutons (en haut à droite) pour afficher les étiquettes de bouton.
Notez que le panneau Terminal inclut une invite de commandes.
Le panneau terminal peut être utilisé pour exécuter des commandes d’interface de ligne de commande (CLI). Vous utiliserez des commandes CLI .NET plus loin dans ce module.
Dans le coin supérieur droit du panneau Terminal, sélectionnez X (Fermer le panneau).
Dans le menu Affichage , sélectionnez Palette de commandes
La palette de commandes peut être utilisée pour rechercher et exécuter toutes sortes de commandes utiles. Vous n’avez pas le temps (ou le besoin) de les examiner en détail maintenant, mais il est bon de savoir où trouver la palette de commandes.
À l’invite de palettes de commandes, tapez des extensions
Notez que la liste des commandes est filtrée en fonction de votre entrée.
Pour mettre à jour la liste filtrée des commandes, modifiez les extensions pour vous aider
Dans la liste des options de commande, sélectionnez Aide : Interactive Editor Playground.
Le document Editor Playground qui s’ouvre dans l’éditeur inclut une liste d’activités interactives.
Dans la liste à puces des activités interactives, sélectionnez Mise en forme.
Prenez une minute pour en savoir plus sur les options de mise en forme.
Vous utiliserez des commandes de mise en forme du code pendant les activités à mesure que vous en apprendrez davantage sur la programmation C#.
Fermez le document Editor Playground.
Cela termine votre visite guidée de l’interface utilisateur de Visual Studio Code. Une fois que vous commencez à coder, les supports d’apprentissage continuent de souligner les moyens que Visual Studio Code peut aider à améliorer votre productivité.