OpenWeek 2019

Projet Data Logger

Nicolas Rybowski - nicolas.rybowski@student.uclouvain.be

Le projet

En pratique

3 parties

  • WebApp
    • Front-End
    • Back-End
  • Services assurant la récolte des données
    • Hostapd : Acces Point
    • Dnsmasq : DNS + DHCP
    • Mosquitto : Broker MQTT
    • (Serveur SFTP)
  • Services assurant le bon fonctionnement des Clients
    • Génération du firmware : Container LXC
    • Génération du code client
    • Flash des clients

Qui veut faire quoi ?

Pour savoir qui doit se taper les explications techniques
En vrai, vous pouvez rester si vous voulez

Explications techniques

Partie WebApp

Une webapp est ...

  • Un programme
  • de type client-serveur
  • dont le client tourne dans un naviguateur web
  • Ce dernier est composé de pages web

Types de pages web

  • Pages statiques
    • Page web dont le contenu ne varie pas en fonction de la requête
    • Un fichier sur un serveur
    • Typiquement :
      • Documentation
      • API
      • Articles (blogs,etc)
    • Langages :
      • HTML
      • CSS
      • JS

Types de pages web

  • Pages dynamiques
    • Page web dont le contenu est généré lors de la requête
    • Template dont certains champs sont complétés par un script
    • Typiquement :
      • Google Form
      • ...
    • Langages :
      • PHP
      • Python
      • ...

Servir des pages web ?

  • Protocole HTTP
  • En pratique : serveur HTTP
    • Apache
    • Nginx
    • Cherokee
    • Unicorn
    • Lighttpd
    • ...

Notre setup

  • Serveur HTTP statique : Lighttpd (a.k.a. Lighty)
  • Backend : framework flask (scripting en Python)
  • Middleware : serveur FastCGI flup
  • Template engine : Jinja2

Notre setup (en image)

Structure du projet

Cfr. le repo

Flask

ou "comment coder une webapp en 5 lignes"


          from flask import Flask
          app = Flask(__name__)

          @app.route('/')
          def hello_world():
            return 'Hello, World!'
          

Jinja2


              <html>
                <head>
                  <title>{{title}}</title>
                </head>
                <body>
                  {% block body %}{% endblock %}
                </body>
              </html>
            

layout.html


              {% extends "layout.html" %}
              {% block body %}
                

Hello {{user_name}}

{% endblock %}

template.html


              class example:
                def GET(self):
                  context = {
                    "title" : "Example page",
                    "user_name" : "Billjoy"
                  }
                  return render_template("template.html", **context)
            

app.py

A vous de jouer !

Des questions ?