menu Menu documentation

Projets exercices

Dernière mise à jour le - Available in English

Lorsque vous travaillez sur un exercice de projet, vous avez accès à un environnement de développement VS Code complet. Ce guide vous aidera à vous préparer au succès et à tirer le meilleur parti des outils et des fonctionnalités disponibles.

Tutoriel

Avant de commencer votre test, nous vous encourageons vivement à suivre le didacticiel interactif. Le didacticiel vous aidera à vous familiariser avec :

  • L'interface et la présentation de VS Code
  • Outils et fonctionnalités disponibles
  • Comment adapter l'environnement à vos préférences

Vous pouvez suivre le tutoriel autant de fois que vous le souhaitez. Il ne fait pas partie de votre évaluation et n'affectera pas vos résultats.

Démarrer avec VS Code

Capture d'écran de l'IDE CoderPad Screen pendant un exercice de projet React. La barre latérale gauche montre la structure du projet sous 'PROJECT [CODERPAD]' avec des dossiers (.vscode, node_modules, src) et des fichiers incluant index.html, instructions.md, fichiers config, et package.json. L'éditeur principal affiche instructions.md, qui décrit le projet : une application React avec un texte et un bouton pour tester la synthèse vocale. Le côté droit montre l'aperçu du Simple Browser avec une page intitulée "Global Alliance for Literacy" et un bouton de haut-parleur. En bas, le terminal affiche la sortie npm run dev avec le serveur Vite fonctionnant sur le port 5173. Une notification suggère l'installation de l'extension Jest. Dans le coin inférieur droit, un bouton jaune "Submit" (Soumettre) apparaît.

Barre d'activité

La Barre d'activité à l'extrême gauche vous donne accès aux éléments principaux de l'IDE. Vous arrivez dans la vue Explorer, qui liste tous les dossiers et fichiers de votre projet, avec instructions.md ouvert par défaut. Lisez d'abord ce fichier ; il décrit vos objectifs, vos contraintes et les étapes de configuration. Vous pouvez ensuite naviguer vers d'autres fichiers à partir de l'Explorateur.

Extensions recommandées

Les recruteurs peuvent inclure des extensions recommandées pour votre projet. Si c'est le cas, une notification apparaîtra dans le coin inférieur droit de l'IDE. Cliquez sur Installer pour les ajouter.

Terminal

VS Code dispose d'un terminal intégré accessible depuis la zone Panel. Le terminal intégré est essentiel pour de nombreuses tâches liées au projet (installation de paquets et de dépendances, exécution de serveurs de développement et d'outils de construction, exécution de suites de tests et de scripts, etc.)

Palette de commande

La Palette des commandes permet d'accéder rapidement à toutes les fonctions de VS Code. Pour l'ouvrir :

  • Windows/Linux : Ctrl + Shift + P
  • Mac : Cmd + Shift + P

Paramètres du code VS

Vous pouvez personnaliser presque toutes les parties de VS Code en configurant les paramètres. Vous pouvez utiliser l'Éditeur de paramètres pour modifier les paramètres dans VS Code ou modifier directement le fichier settings.json. Nous vous recommandons d'ajuster les paramètres pendant votre session de tutorat afin que l'IDE corresponde à votre configuration préférée en termes de raccourcis, de thèmes, d'accessibilité, etc.

Pour une introduction complète à VS Code, vous pouvez consulter la documentation officielle.

Paramètres spécifiques au CoderPad

Accès rapide

Dans la barre d'activité de VS Code, vous verrez une entrée Quick Access avec une icône en forme d'étoile. Ce menu vous permet d'accéder à des ressources clés pour vos projets, notamment :

  • Instructions
  • Terminal
  • Aperçu du site web, s'il est pertinent pour votre projet
  • Assistant IA, s'il est activé pour votre projet

Certains d'entre eux s'ouvrent automatiquement lorsque vous démarrez votre projet. Si vous les fermez, vous pouvez les rouvrir à tout moment à partir de Quick Access.

Assistant IA

Si votre test active l'assistant d'IA, un panneau de discussion s'ouvrira par défaut. Utilisez-le comme vous le feriez au travail pour poser des questions, générer des extraits ou expliquer des erreurs, puis examinez et adaptez ses suggestions. Les recruteurs activent cette fonction parce qu'ils veulent voir comment vous collaborez avec l'IA. Veuillez donc utiliser l'assistant intégré plutôt que des outils externes.

Soumettre votre travail

Le bouton Submit envoie votre projet complété pour évaluation.

⚠️Please Notez que seuls les fichiers sauvegardés sont inclus dans votre soumission.

Avant la soumission :

  1. Enregistrer tous les fichiers: Utilisation Ctrl/Cmd + S sur chaque fichier ou enregistrer tous les fichiers avec Ctrl/Cmd + K, S
  2. Vérifier les modifications non sauvegardées: Recherchez les cercles blancs à côté des noms de fichiers
  3. Testez votre solution: Exécutez votre code pour vous assurer qu'il fonctionne comme prévu
  4. Exigences en matière d'examen: Vérifiez une nouvelle fois que vous avez répondu à toutes les exigences du projet

Vous pouvez enregistrer des fichiers en utilisant l'une des méthodes suivantes :

  • Dossier individuel: Ctrl/Cmd + S
  • Tous les dossiers: Ctrl/Cmd + Kalors S
  • Sauvegarde automatique: Activer dans les paramètres pour l'enregistrement automatique