Introduction à WebIDE

1. Le meilleur widget au monde — WebIDE

La pratique, c'est tout. Pour que ce soit plus fun d'apprendre le HTML, on va vous donner quelques exercices à chaque cours. Ça permet de mieux retenir ce que vous avez lu. Et dans seulement quelques minutes, vous aurez votre premier exercice.

Pour que ce soit pratique de résoudre des tâches, on a créé pour vous un widget spécial — WebIDE. Ça ressemble à ça :

À gauche, vous voyez l'énoncé de l'exercice et la liste des critères que votre solution doit respecter. Au centre, c'est l'éditeur où vous allez écrire votre code. En bas, il y a un panneau qui montre le résultat — votre page dans une fenêtre séparée.

2. Les commandes principales

En haut, vous pouvez voir des boutons :

• Vérifier : envoyer votre solution pour tester.
• Exécuter : lancer le programme sans l'envoyer pour vérification (ça n'augmente pas le compteur de tests).
• Solution — un menu déroulant qui contient :
  • Solution correcte : afficher la solution officielle de l'exercice.
  • Revenir à mon code : revenir à votre code après avoir vu la solution correcte.
  • Réinitialiser la solution : recommencer la tâche depuis zéro.
• Aide — poser une question sur votre solution à la communauté CodeGym.
• Discussion : discuter de l'exercice avec d'autres utilisateurs.
• Analyse du code : recevoir des suggestions sur le style de votre code.

3. Quels boutons utiliser

Une fois que vous avez écrit le programme (votre solution), appuyez sur le bouton « Vérifier ». Votre programme sera alors envoyé au serveur CodeGym où il sera exécuté et automatiquement vérifié.

Si vous n'arrivez pas à écrire la solution, utilisez un indice (ça ne sert à rien de se cogner la tête contre le mur). Dans le menu « Aide », cliquez sur le bouton « Indice ». Vous pouvez aussi regarder la solution correcte en cliquant sur le bouton « Solution correcte ».

Prêt ? Alors voici votre premier exercice :