Exercice 2 : Page CV¶

Objectif¶

Créer une page CV professionnelle avec navigation interne, listes, et tableaux. Cet exercice vous permettra de maîtriser les ancres internes et les éléments de structuration HTML.

Étape 1 : Préparer votre environnement¶

Une fois que l'enseignant a fusionné votre Pull Request de l'exercice 1, préparez votre environnement pour l'exercice 2 :

1
2
3
4
5
6
7
8

# Revenez sur la branche main
git checkout main

# Récupérez les dernières modifications (votre exercice 1 fusionné)
git pull

# Créez une nouvelle branche pour l'exercice 2
git checkout -b exercice-2-cv

Étape 2 : Développer l'exercice¶

1. Créez un fichier cv.html dans votre dépôt.

2. Ajoutez un menu de navigation interne avec des liens vers des sections :

   1 2 3 4 5 6 7 8

   <nav> <ul> <li><a href="#profil">Profil</a></li> <li><a href="#competences">Compétences</a></li> <li><a href="#formations">Formations</a></li> <li><a href="#contact">Contact</a></li> </ul> </nav>

3. Ajoutez les sections suivantes :

   Section Profil :

   1 2 3 4 5

   <section id="profil"> <h2>Profil</h2> <img src="https://via.placeholder.com/150" alt="Photo de profil"> <p>Présentez-vous en quelques lignes...</p> </section>

   Section Compétences (liste non ordonnée) :

   1 2 3 4 5 6 7 8 9

   <section id="competences"> <h2>Compétences</h2> <ul> <li>HTML5 & CSS3</li> <li>JavaScript</li> <li>Git & GitHub</li> <!-- Ajoutez vos propres compétences --> </ul> </section>

   Section Formations (tableau) :

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

   <section id="formations"> <h2>Formations</h2> <table> <thead> <tr> <th>Année</th> <th>Diplôme</th> <th>Établissement</th> </tr> </thead> <tbody> <tr> <td>2024-2025</td> <td>Licence Informatique</td> <td>Université...</td> </tr> <!-- Ajoutez vos formations --> </tbody> </table> </section>

   Section Contact :

   1 2 3 4

   <section id="contact"> <h2>Contact</h2> <p>Email : <a href="mailto:votre.email@exemple.com">votre.email@exemple.com</a></p> </section>

Étape 3 : Tester votre page¶

1. Ouvrez cv.html dans votre navigateur
2. Testez la navigation : Cliquez sur chaque lien du menu pour vérifier que vous êtes bien redirigé vers la bonne section
3. Vérifiez :
   • L'image s'affiche-t-elle ?
   • Le tableau est-il bien formaté ?
   • Les listes sont-elles correctes ?
   • Le lien email fonctionne-t-il ?

Étape 4 : Commit et Push¶

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

# Ajoutez votre fichier
git add cv.html

# Commitez avec un message clair
git commit -m "Exercice 2 : Création de la page CV"

# Si vous avez fait d'autres modifications, faites des commits séparés
git add .
git commit -m "Exercice 2 : Ajout du style et des contenus"

# Envoyez votre branche sur GitHub
git push -u origin exercice-2-cv

Étape 5 : Ouvrir une Pull Request¶

1. Accédez à GitHub et cliquez sur "Compare & pull request"

2. Remplissez les informations :

   • Titre : Exercice 2 : Page CV
   • Description :

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

   ## Exercice 2 : Page CV ### Ce qui a été fait : - ✅ Création du fichier cv.html - ✅ Menu de navigation avec ancres internes - ✅ Section Profil avec image et texte - ✅ Section Compétences avec liste non ordonnée - ✅ Section Formations avec tableau - ✅ Section Contact avec lien mailto ### Test de navigation : - ✅ Tous les liens du menu fonctionnent - ✅ Les sections sont correctement identifiées ### Capture d'écran : (Ajoutez une capture d'écran de votre CV)

3. Créez la PR : Cliquez sur "Create pull request"

Étape 6 : Attendre la validation¶

Attendez que votre enseignant valide et fusionne cette Pull Request avant de passer à l'exercice 3.