CSS as a HTTP Server

http-server.css

/* CSS as a HTTP Server */

:root {
  port: 8080;
}

* {
  /* Apply global CORS settings */
  access-control-allow-origin: *;
  access-control-allow-methods: GET, POST, PUT, DELETE, OPTIONS;
  access-control-allow-headers: Content-Type, Authorization;
  access-control-max-age: 1d;
}

/* Database initialization */
@init {
  db: sqlite(url("./myapp.db"));
  query: '
    CREATE TABLE IF NOT EXISTS users (
      id INTEGER PRIMARY KEY AUTOINCREMENT,
      username TEXT NOT NULL UNIQUE,
      email TEXT NOT NULL UNIQUE,
      created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
    );
  ';
}

/* Basic routes */
/ {
  content-type: text/html;
  response {
    body: url("templates/home.html");
  }
}

/about {
  content-type: text/html;
  response {
    body: url("templates/about.html");
  }
}

/* API routes with SQLite queries */
/api {
  auth: required;
}

/api /users {
  @media (method: GET) {
    query: 'SELECT id, username, email FROM users ORDER BY created_at DESC';
    content-type: application/json;
  }
  
  @media (method: POST) {
    content-type: application/json;
    body-parser: json;
    query: 'INSERT INTO users (username, email) VALUES ($1, $2)' / attr(body.username) attr(body.email);
    response {
      status: created;
      body: 'SELECT id, username, email FROM users WHERE id = last_insert_rowid()';
    }
  }
}

/api /users :id {
  @media (method: GET) {
    query: 'SELECT id, username, email FROM users WHERE id = $1' / attr(path.id);
    content-type: application/json;
    cache-control: private max-age(300s);
  }
  
  @media (method: PUT) {
    body-parser: json;
    query: 'UPDATE users SET username = $1, email = $2 WHERE id = $3' / attr(body.username) attr(body.email) attr(path.id);
    response {
      body: 'SELECT id, username, email FROM users WHERE id = $1' / attr(params.id);
    }
  }
  
  @media (method: DELETE) {
    query: 'DELETE FROM users WHERE id = $1' / attr(params.id);
    status: 204;
    audit-log: true;
  }
}

/* Query parameter handling with SQLite */
/search {
  @media (method: GET) and (attr: query.q) {
    query: 'SELECT id, username, email FROM users WHERE username LIKE $1 OR email LIKE $1' / '%' attr(query.q) '%';
    content-type: application/json;
    rate-limit: 5 requests/minute;
  }
}

/* Middleware-like functionality */
@layer middleware {
  * {
    logging: enabled;
    metrics: prometheus;
  }
  
  /api * {
    rate-limit: 100 requests/minute;
    compression: gzip;
  }
}

/* Error handling */
@error 404 {
  content-type: text/html;
  response {
    body: url("templates/404.html");
  }
}

@error 500 {
  log-level: error;
  content-type: text/html;
  response {
    body: url("templates/505.html");
  }
}

/* Content negotiation */
/data {
  @media (accept: application/json) {
    handler: sendJSON();
  }
  
  @media (accept: application/xml) {
    handler: sendXML();
  }
}

/* Responsive routing based on client */
@media (user-agent: /Mobile/) {
  /home {
    content-type: text/html;
    response {
      body: url("templates/home.mobile.html");
    }
  }
}

/* Caching directives */
/static * {
  cache-control: public max-age(1h);
  etag: auto;
}

/* Redirects */
/old-page {
  redirect: /new-page;
  status: 301;
  preserve-query-params: true;
}

/* File uploads */
/upload {
  @media (method: POST) and (content-type: multipart/form-data) {
    max-file-size: 10MB;
    allowed-types: image/* application/pdf;
    storage: url("uploads/");
  }
}