Table des matières
TD n°5 : Routage/ Gestion de projet
Prérequis :
|
|
-- Exercice :
-- Objectifs
- Mettre en oeuvre le routage
- Créer un squelette de projet multi-modules
-- Structure de l'application
Seul le squelette de l'application est à créer dans un premier temps.
Les méthodes ne sont pas à implémenter.
Les méthodes ne sont pas à implémenter.
-- Créer les vues
- index.html (page principale)
- /templates :
- main.html (Contenu de la page principale) Affichage du titre de la partie en cours + liens vers les cibles potentielles
- login.html (Formulaire de login) Saisie du login et mot de passe
- about.html (A propos de…) affiche le numéro de version et le nom de l'application
- /templates/in :
- list.html (Affichage de la liste des produits ou de la liste des clients)
- exit.html (page de sortie de l'application)
-- Créer les modules
- MainModule (Module principal de l'application)
- AuthModule (Module réservé aux membres authentifiés)
-- Créer les objets
Factory "config"
- permet de mémoriser les paramètres de l'application (nom, version et la liste des chemins possibles à afficher à partir d'un path)
{nom: "Mutlti-Modules APP", version: "1.0", paths:{"/":[{caption:"Se connecter", href:"/login"},{...}]}
Service "AuthService"
- Permet la connexion/déconnexion d'un utilisateur, et la mémorisation des infos de connexion
| Service | AuthService (js/services/AuthService.js) |
|---|---|
| users Tableau des logins autorisés |
|
| activeUser variable objet contenant le login de l'utilisateur actif (+ éventuelles autres infos) |
|
| checkLogin(login) Retourne vrai si l'utilisateur est dans la liste des utilisateurs autorisés, connecte l'utilisateur |
|
| isAuth() Retourne vrai si un utilisateur est authentifié |
Service "DAOService"
Permet l'accès aux listes (de produits ou de membres).
| Service | DAOService (js/services/DAOService.js) |
|---|---|
| products Tableau des produits |
|
| clients Tableau des clients |
|
| getProducts() Accesseur à products |
|
| getClients() Accesseur à clients |
Clients et Products sont fournis via des fichiers json :
- Créer les Contrôleur
- MainController (MainModule)
- ProductsController(Affichage de la liste des produits)
- ClientsController (Affichage de la liste des clients)
- InController (Contrôle des pages pour utilisateurs authentifiés)
Implémentez les méthodes nécessaires au bon fonctionnement de l'application.
-- Exercice : "Browserification"
- Lire le tutoriel Browserify
- Installer Node.js et Browserify
- Refactoriser les sources js de l'application pour créer un Bundle
Générer régulièrement le Bundle, pour éviter le cummul des erreurs et pour avoir toujours un projet valide. (ou utiliser watchify pour automatiser la génération)