Veko.js

Framework Node.js ultra-leger avec zero dependances - 4 types de pages, themes .jsv, SSR natif

Installation - Demarrage - 4 Types de Pages - Themes JSV - Documentation

---

Fonctionnalites

Fonctionnalite	Description
Zero Dependances	Aucun package npm requis - Node.js pur
4 Types de Pages	○ Static, ● SSG, ƒ Dynamic, ⚡ Ultra
Themes JSV	Templates .jsv avec heritage, boucles, conditions
VSV Components	Composants .jsv/.tsv avec JSX, SSR natif
Tailwind CSS	Moteur Tailwind integre, zero config
SSR Natif	Server-Side Rendering sans configuration
Securite	Headers securises, rate limiting, protection XSS
CMS Ready	Systeme de themes et modules pour CMS

Installation

npm install veko

C est tout. Zero dependances a installer.

Prerequis : Node.js >= 18.0.0

4 Types de Pages

Veko.js supporte 4 types de pages pour tous les cas d usage :

Type	Symbole	Description	Cas d usage
Static	○	Prerendu une seule fois	Pages fixes, CGU, FAQ
SSG	●	Genere au build avec donnees	Blog, produits, docs
Dynamic	ƒ	Rendu serveur a chaque requete	Dashboard, admin
Ultra	⚡	Build a la demande, cache intelligent	Pages configurables

// Exemple de routing avec types
app.get('/', handler);              // ○ Static
app.get('/blog', ssgHandler);       // ● SSG
app.get('/admin', dynamicHandler);  // ƒ Dynamic
app.get('/settings', ultraHandler); // ⚡ Ultra

Demarrage Rapide

API Simple

const { createApp } = require('veko');

const app = createApp({ port: 3000 });

app.get('/', (req, res) => {
  res.json({ message: 'Hello Veko!' });
});

app.post('/api/users', (req, res) => {
  res.status(201).json({ user: req.body });
});

app.listen();

Themes JSV

Systeme de templates .jsv avec syntaxe Jinja-like :

Syntaxe

<!-- Variables -->
{{ title }}
{{ user.name | capitalize }}

<!-- Conditions -->
{% if user %}
  <p>Bienvenue {{ user.name }}</p>
{% else %}
  <a href="/login">Connexion</a>
{% endif %}

<!-- Boucles -->
{% for post in posts %}
  <article>
    <h2>{{ post.title }}</h2>
    <p>{{ post.content | truncate(100) }}</p>
  </article>
{% endfor %}

<!-- Heritage -->
{% extends 'layout' %}
{% block content %}
  Mon contenu ici
{% endblock %}

<!-- Inclusions -->
{% include 'partials/nav' %}

Filtres disponibles

Filtre	Description	Exemple
upper	Majuscules	{{ name | upper }}
lower	Minuscules	{{ name | lower }}
capitalize	Premiere lettre maj	{{ name | capitalize }}
truncate	Tronquer	{{ text | truncate(100) }}
date	Formater date	{{ date | date('long') }}
json	JSON format	{{ obj | json }}
markdown	Markdown to HTML	{{ content | markdown }}
default	Valeur par defaut	{{ name | default('Anonyme') }}

Structure des themes

themes/
+-- default/
|   +-- layout.jsv        # Layout principal
|   +-- partials/
|   |   +-- nav.jsv       # Navigation
|   +-- pages/
|   |   +-- home.jsv      # Page accueil
|   |   +-- blog.jsv      # Liste blog
|   |   +-- login.jsv     # Connexion
|   +-- admin/
|       +-- layout.jsv    # Layout admin
|       +-- dashboard.jsv
+-- modern/               # Theme alternatif
+-- dark/                 # Theme sombre
+-- minimal/              # Theme minimaliste

Changer de theme

const TemplateEngine = require('./engine/template');

const engine = new TemplateEngine({
  themesDir: './themes',
  theme: 'default'
});

// Changer de theme
engine.setTheme('modern');

// Lister les themes
console.log(engine.listThemes()); // ['default', 'modern', 'dark', 'minimal']

CMS Demo

Un exemple complet de CMS avec themes et authentification :

cd examples/cms-demo
npm install
npm run setup   # Cree la base SQLite
node index.js   # http://localhost:3000

Compte admin : admin / demo

Fonctionnalites du CMS

• 4 themes switchables (default, modern, dark, minimal)
• Authentification (login/register)
• CRUD articles avec SQLite
• Dashboard admin avec statistiques
• API REST complete

Apercu des themes

Theme	Style
default	Classique Tailwind, clair et professionnel
modern	Gradient purple/pink, glassmorphism
dark	Terminal/hacker style, vert sur noir
minimal	Typographie serif, ultra-minimaliste

VSV Components

Directives Reactives

Directive	Description	Exemple
$state	Etat reactif	const [val, setVal] = $state(0)
$computed	Valeur derivee	const double = $computed(() => val() * 2)
$effect	Effets de bord	$effect(() => console.log(val()))
$ref	Reference DOM	const el = $ref(null)
$memo	Memoisation	const cached = $memo(() => heavy())

Structure du Projet

mon-projet/
+-- app.js                 # Point d entree
+-- package.json
+-- themes/                # Themes JSV
|   +-- default/
|   |   +-- layout.jsv
|   |   +-- pages/
|   |   +-- admin/
|   +-- modern/
|   +-- dark/
+-- components/            # Composants VSV
|   +-- Home.jsv
+-- public/                # Fichiers statiques
+-- db/                    # Base de donnees
+-- .veko/                 # Cache (auto)

Securite

Securite integree par defaut, sans dependances :

• Headers securises automatiques (X-Content-Type-Options, X-Frame-Options, X-XSS-Protection)
• Rate limiting integre
• Body parsing securise avec erreurs 400
• Protection path traversal sur les fichiers statiques
• HTML escaping dans les pages d erreur

Documentation

Document	Description
Guide de Demarrage	Installation et premier projet
VSV Components	Composants, assets, Tailwind
API Reference	Reference complete de l API
Securite	Bonnes pratiques securite
Plugins	Creer et utiliser des plugins
Authentification	JWT, sessions, auth patterns

Contribution

git clone https://github.com/wiltark/veko.js.git
cd veko.js
npm test

Licence

MIT - Wiltark

---

Made with <3 by Wiltark