Aujourd'hui, je souhaite vous présenter le logiciel SQLPage, un outil open-source (MIT) qui permet de développer des applications web complètes, avec une belle interface graphique et une base de données, entièrement en SQL.

Le SQL est un langage très simple, qui permet de faire des recherches dans des base de données. Il est utilisé depuis les années 80, et est encore omniprésent aujourd'hui. Contrairement aux langages de programmation traditionnels, on peut apprendre les bases de SQL en une journée, et commencer à faire des requêtes complexes croisant plusieurs tables de données très rapidement.

Dans une application web traditionnelle, on développe aujourd'hui en général trois composants :

• un front-end, qui gère uniquement l'interface utilisateur,
• un back-end, qui traite les requêtes du front-end et contient le cœur de la logique de l'application lorsque celle-ci est complexe,
• une base de données qui va stocker et structurer les données, s'assurant de leur cohérence et de leur bonne organisation.

Les deux premiers éléments sont en général ceux sur lesquels les programmeurs passent le plus de temps lors du développement d'une application. Et pourtant, c'est souvent le dernier, la base de données, qui contient la substantifique moelle de l'application !

Ce que propose SQLPage, c'est de s'abstraire complètement du back-end et du front-end, et générer toute une application entièrement en SQL. Nous allons voir ici comment c'est possible, avec un exemple concret d'application que nous allons construire ensemble en SQL : à la Tricount.com, une petite application qui permet de gérer ses comptes entre amis.

Sommaire

• Est-ce de la sorcellerie ?
• Comment ça marche ?
• Construisons une application
  • Notre application : une application opensource pour faire ses comptes entre amis
    • Première étape : choisir un schéma pour notre base de données
    • Deuxième étape : création de la base de données et lancement de SQLPage
    • Troisième étape : création de notre première page web
    • Insertion de données dans la base de données
  • Amélioration de l'application, création de nouvelles pages
    • Cerise sur le gâteau : calcul des dettes
• Conclusion
  • • Pour résumer ce que nous avons vu
    • Pour aller plus loin

Est-ce de la sorcellerie ?

Tout d'abord, mettons les choses au clair : votre application aura bien un backend et un frontend, il n'y a pas de miracle. Mais pour les applications simples, le frontend est souvent juste un assemblage de composants standards, et le backend qu'une sorte de passe-plats entre le frontend et la base de données. Ce que permet SQLPage, et que nous allons étudier ici c'est :

• d'invoquer des composants prédéfinis d'interface graphique en donnant simplement leur nom et quelques paramètres,
• de faire le lien entre l'interface graphique et la base de données avec de simples fichiers SQL qui sont exécutés automatiquement lorsque l'utilisateur charge une page.

Comment ça marche ?

SQLPage est un simple serveur web : c'est un programme qui tourne en continu, attend des requêtes HTTP, et dès qu'il en reçoit une, fournit une réponse.

Si SQLPage reçoit une requête vers /site/contenu.sql?article=42, il va chercher un fichier nommé contenu.sql, dans un dossier nommé site. Il va ensuite lire le contenu du fichier, et l'interpréter comme une série de requêtes SQL, qui vont être préparées. Elles seront ensuite exécutées une par une. Si l'une de ces requêtes fait référence à une variable nommée $article, la valeur 42 venant de la requête de l'utilisateur lui sera associée.

Les requêtes sont envoyées à la base de données, et celle-ci commence à retourner des lignes de données, une par une.

Les lignes vont ensuite être analysées au fil de l'eau par SQLPage, qui va décider quel composant graphique renvoyer au navigateur web, et quelles données utiliser pour remplir le composant.

Construisons une application

Pour rendre tout ce discours plus concret, créons ensemble une petite application, entièrement en SQL, et en vingt minutes.

Pour vous donner un avant-goût, voilà ce à quoi nous allons arriver au final

Page d'accueil	Gestion d'utilisateurs	Liste de dépenses	Graphique de dettes

Il n'y a pas toutes les fonctionnalités de l'application originelle, mais c'est seulement 83 lignes de code, grâce à tout ce que SQLPage gère automatiquement. Et le résultat est quand même plus joli que l'original.

Notre application : une application opensource pour faire ses comptes entre amis

Nous allons créer une application pour faire ses comptes entre amis. Elle aura les fonctionnalités suivantes :

• créer un nouveau compte de dépenses partagé
• ajouter des participants et visualiser la liste des participants existants
• pour chaque participant :
  • ajouter une dépense
  • voir les dépenses des autres
  • voir combien il doit au reste du groupe ou combien lui est dû

Première étape : choisir un schéma pour notre base de données

Et oui, on ne va pas passer quatre jours à choisir un framework JavaScript, un framework CSS, un ORM, ou autres choses compliquées que l'on fait quand on commence une application web classique. Avec SQLPage, on rentre tout de suite dans le cœur du sujet, et ce qui sera important pour la suite: quelles données stockerons-nous, et sous quelle forme.

Ici, je propose le schéma suivant :

• une table expense_group pour nos comptes de dépenses partagés, avec un identifiant numérique et un nom.
• une table group_member pour les utilisateurs, avec un identifiant numérique, un nom, et l'identifiant du compte partagé auquel il appartient.
• une table expense pour les dépenses, avec l'identifiant de l'utilisateur ayant fait la dépense, une description, et un montant. Pour cet exemple, nous ne prendrons pas en compte le cas où une dépense peut ne concerner qu'une partie du groupe; ce sera simple à ajouter dans un second temps.

Deuxième étape : création de la base de données et lancement de SQLPage

C'est parti ! Téléchargeons SQLPage sur le site officiel.

Créons un dossier pour notre application, et dans ce dossier créons la structure de fichiers suivante:

├── sqlpage
│   ├── migrations
│   │   └── 000_base.sql
│   └── sqlpage.json
└── sqlpage.bin

Nous créons donc les fichiers suivants:

• sqlpage/migrations/000_base.sql dans lequel nous définirons la structure de notre base de données
• sqlpage/sqlpage.json dans lequel nous mettrons pour l'instant simplement la ligne suivante: {"database_url": "sqlite://:memory:"}. Cela nous permet de travailler avec une base de données temporaire en mémoire. Nous le modifierons plus tard pour nous connecter à une base de données plus pérenne.

Intéressons-nous d'abord à sqlpage/migrations/000_base.sql. Pour créer la structure de base de données définie plus tôt, utilisons quelques instructions de création de table :

CREATE TABLE expense_group(
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  name TEXT
);

CREATE TABLE group_member(
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  group_id INTEGER REFERENCES expense_group(id),
  name TEXT
);

CREATE TABLE expense(
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  spent_by INTEGER REFERENCES group_member(id), -- identifiant du membre qui a fait la dépense
  date TIMESTAMP DEFAULT CURRENT_TIMESTAMP, -- date et heure de la dépense
  name TEXT, -- intitulé
  amount DECIMAL -- montant en euros
);

On peut maintenant lancer l'exécutable sqlpage.bin (ou sqlpage.exe sous Windows