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

{{Projet Étudiant
 |cadre=CAW1 Demonstration Realisation
 |titre=KYMap
 |equipe=[mailto:lucas.buffo@grenoble-inp.org Lucas BUFFO] [mailto:theo.depresle@grenoble-inp.org Théo DEPRESLE] [mailto:aurelien.laviron@grenoble-inp.org Aurélien LAVIRON]
 |encadrants=[mailto:sebastien.viardot@grenoble-inp.fr Sebastien Viardot]}}

= Présentation du projet =

Application : [https://drive.google.com/open?id=0BxUk6rE2r1kHUlQ1RWhVZ2MxVmc 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

[[Fichier: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