Essimbi/afric_educ_access_frontend

# Frontend Web Application — Afric'Éduc Access Application Web Single-Page (SPA / PWA) Angular 22 pour l'affichage de badges numériques élèves et le contrôle d'accès en temps réel par scanner caméra. --- ## 📌 Présentation L'application **Afric'Éduc Access Frontend** offre une interface utilisateur moderne et réactive permettant : - Aux **élèves** de consulter leur badge numérique et de présenter leur QR Code signé cryptographiquement. - Aux **contrôleurs & administrateurs** de scanner les badges en temps réel via la caméra ou saisie manuelle, de gérer les utilisateurs et badges (création, réactivation, renouvellement avec autocomplétion), et de consulter l'historique d'audit. --- ## 🛠️ Prérequis - **Node.js** : `>= 22.21.0` (ou LTS `20.x`) - **npm** : `>= 10.x` - **Angular CLI** : `>= 22.0.0` (`npm install -g @angular/cli`) --- ## 🚀 Installation & Démarrage 1. **Entrer dans le dossier frontend** : ```bash cd africeduc/frontend ``` 2. **Installer les dépendances** : ```bash npm install ``` 3. **Configurer l'URL de l'API Backend (`src/environments/environment.ts`)** : ```typescript export const environment = { production: false, apiUrl: '127.0.0.1' }; ``` 4. **Lancer le serveur de développement** : ```bash npm run start ``` L'application sera accessible sur `localhost`. --- ## 📦 Build Production & PWA ### Compilation de production ```bash npm run build ``` Les fichiers compilés et optimisés seront générés dans le dossier `dist/frontend/browser/`. ### Fonctionnalités Progressive Web App (PWA) L'application est pré-configurée comme PWA avec Manifest Web App et Service Worker, permettant son installation sur smartphone/tablette pour un accès rapide aux points de contrôle d'accès sans barre d'adresse de navigateur. --- ## 📁 Structure du Projet ``` src/app/ ├── core/ # Cœur applicatif (Singleton Services, Guards, Interceptors) │ ├── guards/ # Guards de navigation (authGuard, roleGuard) …