Objectif : construire une vraie petite appli web avec HTML + CSS + JS. Tu peux en faire un site de présentation, un mini panel, un site de serveur RP, etc.
Ton “client” te demande :
Organisation simple :
projet-final/
index.html <-- ta page principale
style.css <-- ton CSS
app.js <-- ton JavaScriptTu peux t’inspirer de ce squelette dans ton propre dossier :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Mon projet final</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>...</header>
<main>...</main>
<footer>...</footer>
<script src="app.js"></script>
</body>
</html>Ci-dessous, tu as un mini site complet intégré dans cette page. Tu peux t’en inspirer pour ton vrai projet, ou le recopier en le modifiant.
Bienvenue sur ton projet final. Ici, tu peux présenter qui tu es, ou présenter ton serveur / ton appli.
Mini jeu : devine le nombre (1 à 10)
Ton but : refaire ton propre mini site dans un vrai fichier index.html,
avec ton propre design, tes couleurs, ton contenu, mais avec la même idée :
// Exemples d'actions JS possibles dans app.js
// 1) Changer le texte d'un titre
const titre = document.querySelector("#mon-titre");
titre.innerText = "Nouveau titre via JS";
// 2) Ecouter un clic sur un bouton
const btn = document.querySelector("#mon-bouton");
btn.addEventListener("click", () => {
console.log("Bouton cliqué");
});
// 3) Valider un formulaire
// (voir les pages JS-2 et JS-3 pour plus de détails)