Skip to content

Epitalk est un projet web interactif développé en quatre jours dans le cadre de la SAS Posture Pro 2025 par la Promo#2 de paris.

Notifications You must be signed in to change notification settings

Sofian-bll/Epitalk

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

63 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Absolument ! Voici une version mise à jour du README qui intègre la description du projet tel qu'il a été soumis, tout en ajoutant une section détaillant les améliorations que tu as apportées pour créer la version master.


Epitalk - Chatbot Project

🎯 Présentation du Projet

Epitalk est un projet web interactif conçu pour centraliser et simplifier l'accès aux informations concernant Epitech. Développé en quatre jours dans le cadre de la SAS Posture Pro, ce projet intègre trois fonctionnalités clés : une page d'accueil avec un système d'authentification, un chatbot intelligent pour répondre aux questions des étudiants, et un générateur de carte étudiante.

Ce document présente d'abord la version soumise le 2 Octobre 2025 dans la branche submitted-version, puis détaille les améliorations apportées dans la branche master.


👥 Équipe de Développement

  • Dawid : Responsable de la page d'accueil, incluant les formulaires d'inscription et de connexion.
  • Sofian : Développeur du chatbot interactif et créateur du design system du projet.
  • Muhammad : Concepteur du générateur de carte étudiante.

🚀 Fonctionnalités de la Version Soumise

1. Page d'Accueil et Authentification (par Dawid)

  • Interface d'accueil moderne (Home.html) servant de portail principal vers les autres fonctionnalités de l'application.
  • Système d'inscription complet avec validation des champs (prénom, email, mot de passe) et stockage des données en sessionStorage.
  • Popup de connexion interactif pour une expérience utilisateur fluide, avec validation des identifiants et gestion des erreurs.
  • Navigation claire et intuitive vers le chatbot et le générateur de carte étudiante.

2. Chatbot Interactif (par Sofian)

  • Arbre de décision détaillé (scripts.js) couvrant plus de 50 sujets sur Epitech et la Web@cadémie.
  • Interface de chat dynamique (index.html) où les questions et les réponses sont générées en temps réel pour simuler une conversation.
  • Navigation par boutons permettant une exploration simple et guidée des différentes thématiques.
  • Option de réinitialisation pour permettre à l'utilisateur de revenir au début de la conversation.

3. Générateur de Carte Étudiante (par Muhammad)

  • Formulaire de saisie complet (register.html) pour collecter les informations de l'étudiant.
  • Génération automatique d'un numéro de carte étudiant unique à 10 chiffres.
  • Affichage dynamique des informations sur une maquette de carte étudiante réaliste (identity.html).
  • Stockage des données en sessionStorage pour assurer la communication entre le formulaire et la page d'affichage.

✨ Évolutions et Améliorations (Branche Master)

Après la présentation initiale, la branche master a été entièrement restructurée par Sofian pour améliorer la qualité, la cohérence et la maintenabilité du code.

1. Refactorisation et Structure du Code

  • Structure de Fichiers Unifiée : Le projet a été réorganisé avec une structure de dossiers claire (/, /pages, /src), séparant la page d'accueil, les sous-pages et les assets.
  • CSS Centralisé : Un fichier style.css unique a été créé à la racine pour héberger le Design System. Les styles spécifiques, comme ceux du chatbot, ont été conservés dans des fichiers séparés mais allégés, tandis que les styles redondants ont été supprimés.
  • Nommage Cohérent : Les classes CSS (.buttonBlue, .buttonWhite, .input) et les ID JavaScript ont été standardisés sur toutes les pages pour plus de clarté.

2. Améliorations Visuelles et UX

  • Application Stricte du Design System : L'ensemble des pages a été retravaillé pour utiliser systématiquement les composants définis dans le style.css global, garantissant une parfaite cohérence visuelle.
  • Amélioration de l'Accessibilité : Des balises <label> ont été ajoutées à tous les champs de formulaires (inscription et génération de carte) pour améliorer l'expérience utilisateur et l'accessibilité.
  • Navigation Unifiée : La barre de navigation et le footer sont désormais identiques sur toutes les pages, offrant une expérience de navigation plus prévisible.

3. Nettoyage et Organisation

  • Gestion des Assets : Les images, logos et icônes ont été centralisés et réorganisés dans un dossier /src structuré pour une meilleure gestion.
  • Suppression des Fichiers Redondants : Les fichiers CSS et les assets dupliqués dans les différentes branches ont été supprimés au profit de la structure centralisée.
  • Mise à jour des Liens : Tous les chemins de fichiers (CSS, JS, images) ont été mis à jour pour refléter la nouvelle arborescence du projet.

La branche master est ainsi une version plus propre, plus maintenable et plus professionnelle du projet initial, prête pour d'éventuelles évolutions futures.

About

Epitalk est un projet web interactif développé en quatre jours dans le cadre de la SAS Posture Pro 2025 par la Promo#2 de paris.

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 3

  •  
  •  
  •