Développement Back-End pour un réseau sociétal, le pixel humain

Stage Master 2 Informatique

Janvier 2015-Juin 2015

ROBERT Johnson Tuteur de stage : Tibor KATELBACH

Sommaire

Developement back-end pour un réseau sociètal 2

1. Le projet Pixel Humain2. Objectifs du stage3. Architecture

i. Yii Frameworkii. Approche modulaireiii. Autres

4. Missionsi. Citizen Toolkitsii. Communecteriii. SVG

Le projet Pixel Humain

Developement back-end pour un réseau sociètal 3

• Projet porté par Open Atlas

• un projet innovant de réseau sociétal citoyen open source

• une plateforme où un citoyen connecté pourra suivre et participer à la dynamique

de sa localité, de sa commune, de son entourage

Objectifs du stage

Developement back-end pour un réseau sociètal 4

• Comprendre les outils déjà en place

• Participer aux sessions de développement

• Avancer le plus possible sur chacun des points proposés

• Développer le back end et aussi le font end du pixel humain

Architecture: Yii Framework

Developement back-end pour un réseau sociètal 5

• Framework PHP

• Modèle Vue Contrôleur

• Gestion de cache, extensible, SGBD …

• AJAX

Architecture: Approche modulaire

Developement back-end pour un réseau sociètal 6

Architecture: Autres

Developement back-end pour un réseau sociètal 7

• NoSQL

• Plus léger, moins de contraintes

• Plus adapté aux applications Web

• REST (Representational State Transfer)

• Systèmes distribués

• S’adapte bien au world wide web

• JSON/JSON-LD

Missions: Citizen ToolKits

Developement back-end pour un réseau sociètal 8

• Ensemble d’outils destinés au bon fonctionnement

d’un citoyens

• CRUD (Create, Read, Update, Delete)

• De nombreuses actions utiles

• Module Back-End

Missions: Communecter

Developement back-end pour un réseau sociètal 9

• Communecter = Commune+ Connecter

• Application Principal

• Composé de nombreuses fonctionnalités utiles à l’utilisateur

• Création de son réseau

• Fil d’actualité

• Partage de son espace personnel

• Etc…

Missions: Communecter – Exemple de dashboard

Developement back-end pour un réseau sociètal 10

Missions: Communecter – Gestionnaire d’images

Developement back-end pour un réseau sociètal 11

• FileUpload Boostrapt

• Générique

• Suppression, ajout, modification, redimensionnement.

• Galerie d’images

Missions: SVG

• SVG defines vector-based graphics in XML format.

• Data Visualization with dynamics' graphics

• Library Javascript:

• D3js (Data Driven Document)

• nvd3.js

Developement back-end pour un réseau sociètal 12

Missions: SVG - Créations

• Network Viewer

• View graphically our network

• Linked Data representation

• Uses many functionalities of D3

Developement back-end pour un réseau sociètal 13

Missions: SVG - Créations

• Project Evaluator

• Allows us to see the deadline

• We can compare data according to

several variables

• Uses D3

Developement back-end pour un réseau sociètal 14

Missions: SVG - Créations

• IPE Graphics

• Energy data visualization over a

period

• Uses nvd3

Developement back-end pour un réseau sociètal 15

Conclusion

Developement back-end pour un réseau sociètal 16

• Première approche du monde professionnel enrichissante• Travail en équipe• Prise d’autonomie• Améliorations de mes capacités (en technologie web, d’analyse ...)