CAW1 2017 Projet de Lucas BUFFO, Théo DEPRESLE, Aurélien LAVIRON

De Ensiwiki
Aller à : navigation, rechercher
Project schedule.png
Titre du projet KYMap
Cadre CAW1 Demonstration Realisation

Équipe Lucas BUFFO Théo DEPRESLE Aurélien LAVIRON
Encadrants Sebastien Viardot


Présentation du projet

Application : Screen Cast !

Git : https://tpth.dev-bs.com/gitlab/ensimag/KYMap


Contexte général

Cette application a pour but de visualiser et de partager si on le souhaite ses destinations de voyage. Vous pourrez saisir vos voyages et leurs différentes étapes. Par la suite vous pourrez retrouver vos trajets et visualiser les différents pays visités et obtenir différentes statistiques pour narguer vos collègues. Puisque c'est pas gentil d'être méchant, vous pourrez notez vos trips pour éviter à Michel d'aller passer 3 semaines humides au fond de la creuse.

Cahier des charges

  • Saisie d'un voyage réalisé
    • Différentes étapes
      • Emplacement
      • Date
      • Commentaire
      • Éventuellement un ajout de photos (Pas encore réalisé)
    • Appréciation générale du voyage
  • Consultation des voyages sur la carte
  • Statistiques sur les voyages et l'exploration du monde (Pas encore réalisé)
  • Gestion de la confidentialité pour chaque voyage
    • Public : Le voyage sera visible sur votre profil (Pas encore réalisé)
    • Privé : Seul vous pourrez le visualiser
    • Partagé : Partagez le trajet seulement avec les gens que vous aimez vraiment. Soit avec un lien à envoyer à votre grand mère. Soit en ajoutant vos amis.

Technologies

Le projet est basé sur Django pour la partie Backend. Les API Google Maps pour le frontend :

  • Google Maps Javascript API pour afficher la carte et tracer les trajets. Aussi utilisé pour automatiquement compléter l'input de recherche de lieu lors de la création.
  • Le Geocoding API pour traduire un lieu en latitude-longitude

L'API Google OAuth 2.0 sur Django pour le Backend

  • Google OAuth 2.0 permet de s'authentifier avec son compte google plus.

Bootstrap 4 (en version alpha #JouerAvecLeFeu) : https://v4-alpha.getbootstrap.com

Font-awesome : http://fontawesome.io/

Django : http://www.django-fr.org/

Jquery : https://jquery.com/

Cas d'utilisations

Connexion

L'ensemble des trajet étant propre à chaque utilisateur, celui-ci doit se connecter. Il doit donc saisir un login et un mot de passe ou passer par la connexion Google plus.


Ajout d'un voyage

L'utilisateur va créer un voyage en spécifiant :


  • Les dates de début et de fin
  • Les participants à ce voyage
  • Le niveau de confidentialité
  • Accessoirement : un commentaire le concernant.


Une fois le voyage créé, l'utilisateur va ajouter des étapes.


Ajout d'une étape

Pour chaque trajet l'utilisateur va saisir plusieurs étapes. Il devra saisir les informations suivantes:


  • Ville ou position visitée (Appel à l'API Google Maps pour obtenir une auto complétion)
  • Date de la visite (Possible de choisir une plage)
  • Accessoirement : Commentaire
  • Accessoirement : Photos


Création d'un groupe

L'utilisateur à la possibilité de créer un groupe avec ses amis pour partager ses voyages. Il devra choisir :

  • Un nom
  • La liste d'amis

Modèle de la base de donnée

Nous avons choisis un modèle simple pour notre base de donnée.

Les classes principales définissent les voyages et les étapes

Uml KYMap.png

Mettre en place l'environnement de test

Pour faire tourner les tests sur le repository Gitlab, nous avons mis en place une image docker avec tout le nécessaire pour faire tourner les tests (django, selenium et leurs dépendances). Or, selenium nécessite une interface graphique, nous n'avons pas réussi à le configurer sur le serveur. Nous avons donc déssactivé par défaut les tests sélénium, que nous testions chez nous en local.

Nous avons donc deux types de tests : les tests Django, qui test l'API, le modèle et la partie login. Nous avons aussi des tests Sélénium pour tester les vues.

Utilisation de l'API Google OAuth 2.0

Pour gérer l'utilisation d'un web service, nous avons choisi d'utiliser le service d'authentification de Google OAuth 2.0. Un bouton est disponible sur la page principale de l'application. Si l'utilisateur n'est pas déjà inscrit dans notre base, nous l'inscrivons automatiquement avec les informations associés à son compte (email, nom, prénom). Sinon l'utilisateur est automatiquement connecté. Dans les deux cas, la connexion se fait de manière transparente pour l'utilisateur.

Utilisation d'AWS

Dans le cadre du partenariat entre Amazon web Services et l'ENSIMAG nous avons pu d'une formation sur les solutions clouds d'Amazon.

Ce projet tombait à pic pour expérimenter la plateforme d'AWS et ses solutions de virtualisations et de bases de données.

RDS : Base de donnée

Pour disposer d'une base de données communes pendant nos dévellopements nous avons mis en place une base de donnée PostgreSQL sur le service RDS d'Amazon.

La base est éligible à l'opération "Free Tier" d'AWS, vous disposer pendant un an de 750 H/mois pour utiliser gratuitement une base RDS.

La configuration de cette base de donnée est trés simple à l'aide de la console AWS. Nous avons du modifier le port par défault vers le port 8080 afin de pouvoir y accéder à travers les pare-feux de RENATER..

EBS : Déploiement de code

Nous avons voulu déployer notre application dans le cloud, pour cela, il existe un service clefs en main, Elastic Beanstalk. Cet outils combine intelligement les différents outils disponible sur AWS (S3 pour le stockage des fichiers, EC2 pour les machines virtuelles).

Une instance (t1.micro, également éligible au "Free Tier") installé par défaut, avec python et un serveur apache va héberger notre site au travers d'une application WSGI. Pour que tout fonctionne correctement, il faut spécifier à Amazon les dépendances de notre projet.

Ceci ce passe à deux niveaux : - Le fichier `/requirements.txt` qui contient toutes les dépendances python. - Le dossier `/.ebextensions/` qui va contenir les dépendances et les paramètres à configurer dans la VM.

On peut ensuite déployer le code soit via navigateur avec un zip, soit via l'outils en ligne de commande d'AWS.

Processus d'installation

Installer Python 3

sudo apt-get install python3

Outils à installer

Installer les dépendances listées dans le fichier requirements.txt.

Elles peuvent être installé automatiquement avec sudo pip install -r requirements.txt.

Base de donnée à initialiser

  • python3 manage.py makemigrations
  • python3 manage.py migrate
  • python3 manage.py loaddata fixtures.json

Lancer le serveur

python3 manage.py runserver

Accéder à l'application avec 127.0.0.1:8000 avec les logins :

  • admin / admin1234
  • lavirona / admin1234

Lancer les tests

python3 manage.py test