CAW1 2019 Projet de Maxime DHAISNE et Dimitri LALLEMENT

Titre du projet	MeetPoint
Cadre	Projet Web (alternants 2A)
Page principale	CAW1_Demonstration_Realisation
Équipe	Maxime DHAISNE, Dimitri LALLEMENT
Encadrants	Sébastien Viardot

MeetPoint est un réseau social permettant à ses utilisateurs de créer ou de trouver des événements. Les utilisateurs peuvent rejoindre des groupes en fonction de leurs centres d'intérêts mais également de suivre l'activité de leurs amis et de trouver des événements près de chez eux.

Présentation du projet

Description

L'objectif est de proposer aux utilisateurs un nouveau moyen d'échanger et de se rencontrer. Je souhaite sortir boire un verre en bonne compagnie ? Après avoir renseigné mon profil, j'indique à MeetPoint que je souhaite sortir au bar LaBonneBière. Les autres utilisateurs peuvent vous voir et ainsi vous rejoindre ou alors vous pouvez limiter la visibilité à un groupe de membres précis. Pour cela vous pouvez créer ou candidater à un groupe (votre équipe de sport, vos collègues de travail, etc.).

Il est également possible de créer des événements chez soi, en choisissant le niveau de visibilité, vous ouvrez votre soirée a vos amis, des connaissances, des camarades de promotion ou toutes personnes intéressées. Vous avez deux modes d’hôtes, accepter tous ou choisir si oui ou non une personne peut rejoindre. Votre adresse sera envoyée après l'approbation de la personne. A vous de fixer vos envies et de partir à la rencontre de ceux qui partagent vos passions ou vos activités.

Screencast

Voici le lien vers la vidéo de démo du projet MeetPoint : Démo

Objectifs

À travers ce projet nous voulons monter en compétence sur des technologies web que nous ne connaissons pas (Django, Materialize, SQLite...).
Notre objectif principal reste de rendre un projet fonctionnel permettant à ses utilisateurs de pouvoir sortir et trouver des activités liées à ses centres d'intérêts.

Cas d'usages

Les différents cas d'usages seront décrits par type d'utilisateur.
Pour chaque type d'utilisateur, la liste des scénarii possible est décrite.

Visiteur

• Scénario 1 : Depuis la page d'accueil de MeetPoint, le visiteur clique sur le bouton du volet à gauche puis sur le bouton "Sign Up". Il saisit ses informations pour s'inscrire.

Utilisateur

• Scénario 1 : Depuis la page d'accueil de MeetPoint, l'utilisateur clique sur le bouton du volet à gauche puis sur le bouton "Sign In". Il saisit ses identifiants pour se connecter.
• Scénario 2 : Depuis la homepage, l'utilisateur peut modifier sa photo de profil en cliquant sur l'icône présente sous son avatar. Il peut également modifié sa bio ainsi que la liste de ses centres d'intérêts.
• Scénario 3 : Depuis la homepage, l'utilisateur peut consulter la liste de ses amis, de ses groupes et des événements qu'il a créé ou auxquels il est inscrit.
• Scénario 4 : Depuis la homepage ou n'importe quelle autre page, il peut cliquer sur le bouton "More" en haut à droite de sa session puis sur le bouton "Logout" pour se déconnecter.

• Scénario 5 : Depuis la page settings, l'utilisateur peut changer son mot de passe (avec validation).
• Scénario 6 : Depuis la page settings, l'utilisateur peut supprimer son compte.
• Scénario 7 : L'utilisateur peut rejoindre ou quitter un groupe lié à un centre d'intérêt par exemple.
• Scénario 8 : L'utilisateur peut accepter ou refuser une invitation d'ajout d'ami.
• Scénario 9 : L'utilisateur peut créer et annuler une demande d'ajout d'ami avec un autre utilisateur.

Adminstrateur

En plus des actions associées aux utilisateur l'administrateur peut accéder aux options suivantes :

• Scénario 10 : Il peut créer un utilisateur, mais également modifier ou supprimer un compte existant.
• Scénario 11 : Il peut créer un groupe et modifier ou supprimer un groupe existant.
• Scénario 12 : Il peut créer une catégorie et modifier ou supprimer une catégorie existante.

Présentation technique

Modèle de données

API

Tableau récapitulatif

Routes	GET	POST	PUT	DELETE
/events	Utilisateur userID Renvoie la liste des événements de l'utilisateur <userId> CR 200	Utilisateur userID Ajoute un événement pour l'utilisateur <userID> CR 201	-	-
/events/<eventID>	Renvoie les informations de l'événement <eventID> CR 200	-	Owner only Modifie l'événement <eventID> CR 200	Owner only Supprime l'événement <eventID> CR 204 ou 404
/events/<groupID>	Membre du groupe groupID Renvoie la liste des événements du groupe <groupID> CR 200	-	-	-
/groups	Renvoie la liste des groupes CR 200	Utilisateur userID Créer un groupe détenu par <userID> CR 201	-	-
/groups/<groupID>	Membre du groupe groupID Renvoie les informations du groupe groupID CR 200	-	Owner du groupe groupID Modifie le groupe groupID CR 200	Owner du groupe groupID Supprime le groupe groupID CR 204 ou 404

Architecture

Voici un schéma simplifié de l'architecture de notre projet :

Choix techniques

Front-end

Framework

Nous avons choisi d'utiliser le framework CSS Materialize (version 1.0.0) pour la mise en forme de notre frontend.
Nous l'avons choisi car il est open-source, il gère très bien le responsive web design et nous voulions essayer une solution alternative à Bootstrap.

Back-end

Framework

Nous avons fait le choix de développer le projet avec le framework Python Django (version 2.2.1).
Les arguments qui nous ont fait choisir ce framework sont les suivants :

• Il est très polyvalent (nombreux modules inclus)
• Il embarque de nombreux utilitaires de bases (authentification, administration...)
• Il est gratuit et open-source
• Nous voulions essayer un framework web en Python
• Il intègre une base de données. Les requêtes sont directement générées par l'ORM

Base de données

Nous utilisons directement la base SQLite(version 3.28.0) embarquée dans le framework pour stocker les données de notre application.
Elle est légère et ne nécessite pas d'installation avec Django.
Lors de l'installation de l'application, un jeux de données de tests est disponible.

Gestion des rôles

Nous avons mis en place trois rôles distincts :

• Visiteur : Il ne peut accéder qu'à la page de création de compte et de connexion
• Utilisateur : Il a un compte attitré, depuis lequel il peut modifier ses informations, consulter ses groupes ...
• Administrateur : Il peut modifier, et supprimer n'importe quel événement/utilisateur/groupe... du site

Pour plus de détails sur les actions définies pour chacun des rôles, se référer à la section Cas d'usages. Pour mettre en place cette gestion des rôles nous nous sommes servi des outils intégrés dans Django.

Tests

Pour les tests d'intégration (tests fonctionnels) nous avons utilisé l'outil Selenium interfacé avec le web driver de Google ChromeDriver.

Pour les tests unitaires nous avons utilisé la librairie test de Django (documentation) et le module unitest de python.

Installation

Pré-requis

Il est nécessaire d'avoir les éléments suivants d'installés sur son poste :

• Python 3.X
• Git

Procédures

Il faut commencer par cloner le repository du projet :

git clone https://gitlab.ensimag.fr/meetpoint/meetpoint.git

Il faut ensuite se placer dans le répertoire scripts:

cd scripts

Et pour finir il faut lancer les trois scripts dans l'ordre suivant :

./migrate.sh
./load_data.sh
./run_server.sh

Il faut ensuite se connecter à la page http://127.0.0.1:8000/ puis pour pouvoir tester la vue utilisateur, il est possible d'utiliser un compte de test avec les identifiants suivants :

• username = SylvainB
• mot de passe = test

Sources du projet

GitLab du projet (Uniquement accessible pour les membres)

Reste à faire

Dans les tâches que nous n'avons pas eu le temps de finir, on peut lister les éléments suivants :

• Correction du bug de l'invitation à un groupe
• Ajouter l'utilisation à l'API Google Maps pour la localisation des événements
• Rajouter plus de tests unitaires