Post on 22-Dec-2014
description
Réalisée dans le cadre du projet de troisième année du cycle ingénieur de l’ISTIA option AGI (2013-2014)
Soutenu par
ilyas DKHISSI
Encadré par
M. Mehdi LHOMMEAU
Plan
Présentation du projet
3Application web pour l’évaluation des stages des étudiants d’EI4 et EI5
Technologies utilisées
4Les majeures technologies utilisées
Etapes de développement
5
Etapes suivies :
Diagramme GANT :
Etapes de développement
6
Responsive Web Design
Directives :
Routing :
myApp.config(['$httpProvider','$routeProvider', function($httpProvider,$routeProvider) { $routeProvider. when('/Accueil', { templateUrl: 'partials/Accueil.html', }); $routeProvider. when('/Saisie', { templateUrl: 'partials/Saisie.html', }); $routeProvider. when('/login', { templateUrl: 'partials/login.html', controller: LoginController }); $routeProvider.otherwise({ redirectTo: '/Accueil'}); $httpProvider.responseInterceptors.push('IntercepteurHTTP');}]);
Controlleurs :
myApp.controller('MyCtrl', function($scope) { $scope.name = 'exemple';});
<html lang="fr" ng-app="myApp"> <body> <div ng-view></div> </body></html>
ng-controller , ng-repeat , ng-model , ng-click ,…
Etapes de développement
7
Le Responsive web design
Utiliser les « Media Queries »
Div { background-image: url(‘/images/picture.png’);}
@media screen and (max-width:400px){ div { background-image: url(‘/images/picture-small.png’); } .social_icons { display: none } // .uneautreclasse{ …}}
Avantages / inconvénients
• L’adaptabilité du produit. • Toucher un maximum d’utilisateurs. • Un seul produit web à concevoir et à entretenir. • Référencement plus simple.• Une expérience utilisateur homogène. • Pas de cloisonnement. • L'assurance d'une URL unique.
• Un coup de production plus élevé qu’un site classique (nécessite plus de compétences).
• Des commanditaires assez réticents.• La négociation du contenu.• Le temps de téléchargement.
Structure de l’application
8
Le diagramme suivant résume comment fonctionne l’application :
Les caractéristiques attendues :
Application
Utilisateur
Données saisies • Donées archivées• Données affichées
Complète Autonome
Fiable Simple d’utilisation (Intuitive)
Résultats
9Création de compte
Résultats
10Authentification
Résultats
11Choix de l’étudiant à évaluer
Résultats
12Section d’évaluation
Résultats
13Section d’évaluation
Résultats
14Menu de configuration
Résultats
15Exemple d’une page de configuration
Conclusion
16
Approfondissement des connaissances en dévelopement web
Direction d’un projet en autonomie
Développement de : l’écoute. la communication. L’esprit d’analyse.
Ce projet m’a permis de :
Merci pour votre attention ! Des questions ?