Build Websites in SQL

Introducing SQLPage

Build Websites in SQL

Introducing SQLPage

select 
  'form' as component,
  'User' as title,
  'Create' as validate;

---

select
  "name", "type",
  "description"
from my_form_fields;

./user_creation.sql

https://example.com/user_creation.sql

Who made it ?

Ophir Lojkine
Free Software developer
CTO @hyxos in Paris

@ophir_dev

@lovasoa

Engineering degrees from 🇫🇷 & 🇷🇺
Ex-data engineer @Qwant
Father next month

Who made it ?

Hyxos
Startup
Energy infrastructure management software
Lots of projects

Agenda

Why

What

How

Examples

Live coding

Who

uses it in production ?

isn't this a stupid idea ?

does it do exactly ?

to build a website in a day ?

let's build twitter together

of the coolest features

Build Websites in SQL

Seriously ?

Build Websites in SQL

Seriously ?

Your scientists were so preoccupied with whether they could, they didn’t stop to think if they should

Why ?

We have a problem

1 programmer

empty seats

McKinsey, 2023: for 10 Java job postings, there is <1 skilled profile online

Why ?

We have a problem

non-programmers will write apps

some apps will never materialize

programmers will write more apps

Why ?

We have a problem

non-programmers will write apps

programmers will write more apps

Let's make their lives easier...

Why ?

Simplicity

🌱

Efficiency

🕒

Expressiveness

🧠

Reusability

🔄

How to put your idea online in 2024 ?

Drupal

WordPress

Shopify

Squarespace

Django

Rails

Laravel

Spring Boot

Budibase

AppSmith

React

SvelteKit

CMS & Website Builders

Backend Frameworks

Low-Code app builders

Front-end frameworks

Web Site

Web App

Beginner Friendly

Customizable

How to put your idea online in 2024 ?

How to build a website in 2024 ?

Web Site

Web App

Beginner Friendly

Customizable

Everything loads instantly

User-Generated

content

Accessible to non-programmers

Connects to any database

How to build a website in 2024 ?

Easy

Beautiful

Fast

Build your site in a weekend

I write the CSS, not you

Rust, Lighthouse 100, scales to ∞

Build Websites in SQL

Seriously ?

YES !

Build Websites in SQL

Seriously ?

YES !

What ?

What is SQLPage ?
Let's dive in !

What ?

open-source

low-code

SQL-only

web application server.

License: MIT

Language: Rust

Dependencies: None

SQLPage is ...

... written in Rust

A web server

reusable HTML

Components

Database connections

Drivers

SQLPage is ...

Core principles

Web Page

SQL file

3 components

tab

component

tab

component

component	center
tab	true

title	link	active	color
Show all cards	?	false	NULL
Show blue cards	?tab=blue	false	NULL
Show green cards	?tab=green	true	green
Show red cards	?tab=red	false	NULL

Opening component, top-level properties

Filling the component, row-level properties

card

component

card

component

component
card

title	link	description	color	top_image
Leaf	https://.../	Autumn's dance begins, [...]	green	leaf.jpg
Caterpillar	https://.../	Caterpillar crawls [...]	green	caterpillar.jpg
Butterfly	https://.../	Cocoon unfolds wings [...]	green	butterfly.jpg

Opening component

Filling the component, row-level properties

text

component

text

component

component	contents_md
text	See [source code on GitHub](https://github.com/.../tabs.sql)

Opening component

Let's build

TinyTweeter

CREATE TABLE
tweets (
  "id" bigserial,
  "tweet" text
);

select 'shell' as component;

select 'shell' as component,
       'TinyTweeter' as title;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;
select 
    'Tell me your story...'
    as placeholder;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;
select 'textarea' as type,
       'Tell me your story...'
       as placeholder;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;
select 'textarea' as type,
       'Tell me your story...' as placeholder;
select 'checkbox' as type,
       'Terms and conditions'
       as label;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;
select 'new_tweet' as name,
       'Your story' as label,
       'textarea' as type,
       'Tell me your story...' as placeholder;
select 'checkbox' as type,
       'Terms and conditions' as label,
       true as required;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;
select 'new_tweet' as name,
       'Your story' as label,
       'textarea' as type,
       'Tell me your story...' as placeholder;
select 'checkbox' as type,
       'Terms and conditions' as label,
       true as required;
       
insert into tweets (tweet)
select :new_tweet;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;
select 'new_tweet' as name,
       'Your story' as label,
       'textarea' as type,
       'Tell me your story...' as placeholder;
select 'checkbox' as type,
       'Terms and conditions' as label,
       true as required;
       
insert into tweets (tweet)
select :new_tweet
where :new_tweet is not null;

select 'shell' as component,
       'TinyTweeter' as title;

select 'form' as component,
       'Tweet' as validate;
select 'new_tweet' as name,
       'Your story' as label,
       'textarea' as type,
       'Tell me your story...' as placeholder;
select 'checkbox' as type,
       'Terms and conditions' as label,
       true as required;
       
insert into tweets (tweet)
select :new_tweet
where :new_tweet is not null;

select 'card' as component;
select tweet as description
from tweets;

SQLPage in Action

Examples of SQLPage in use

SQLPage in Action

What are people doing with SQLPage ?

Helping

disabled

pupils

Mapping

archeological

artefacts

Digitalization

South Africa

SQLPage in Action

What are people doing with SQLPage ?

Helping

disabled

pupils

SQLPage in Action

Helping disabled pupils with SQLPage

David

Coordinator,

Inclusive Localized Support Hub

Coordinating human support resources based on the needs of students with disabilities

No past experience with SQL

Looking for a tool to replace an excel spreadsheet

SQLPage in Action

David

SQLPage in Action

David

SQLPage in Action

David

SQLPage in Action

What are people doing with SQLPage ?

Mapping archaeological artefacts

SQLPage in Action

Mapping archaeological artefacts

Florent

Responsible for Protohistoric Operations,

National Institute of Preventive Archaeological Research (INRAP)

Public institution in France that is responsible for conducting archaeological research and excavations

Geographic Information System Coordinator

RAMEN collective
Recherches Archéologiques en Modélisation de l'Enregistrement Numérique

BADASS database

Base archéologique de données attributaires et spatiales

SQLPage in Action

Florent

SQLPage in Action

Florent

SQLPage in Action

Florent

SQLPage in Action

What are people doing with SQLPage ?

Digitalization

Africa

SQLPage in Action

From call center to building the company's next app

William

IT support

Building a tool to manage clients and processes

Started at the company's call center

Promoted to IT support

Now works on SQLPage most of the day

Programming experience in Delphi

SQLPage in Action

From call center to building the company's next app

William

I don’t think I’ll use anything else for frontend.

I’d like to use it for personal projects as well: I can make extra income, it’s very efficient !

It’s kind of a big thing. We launch in January.

Examples

Cool features

Examples

Build an API in 45 seconds

SELECT
  'json' AS component, 
   JSON_OBJECT(
     'users', (
       SELECT JSON_GROUP_ARRAY(
       JSON_OBJECT(
         'username', username,
         'userid', id
       )
      ) FROM users
    )
  ) AS contents;

api.sql

{ 
  "users" : [
    {
      "username": "Mary",
      "userid": 128448
    },
    {
      "username": "Bob",
      "userid": 479326
    }
  ]
}

http://localhost/api.sql

docker run -p 80:8080 -v .:/var/www lovasoa/sqlpage

Examples

Create user account in 1 minute

INSERT INTO
  user_info (
    username,
    password_hash
  )
VALUES (
	:username,
    sqlpage.hash_password(:password)
);

signup.sql

postgres://localhost/sqlpage

username	password_hash
John	`$argon2id$v=19$m=16,t=2,p=1$TERTd0lIcUpraWFTcmRQYw$+bjtag7Xjb6p1dsuYOkngw`

SELECT
  'authentication' AS component,
  'signin.sql?error' AS link,
  ( SELECT password_hash
    FROM user_info
    WHERE username = :username
  ) AS password_hash,
  :password AS password;

login.sql

Questions ?

Leave a star on github !

lovasoa/SQLPage

sql.ophir.dev

Visit the website