Wat is Lumora?
Lumora is een visuele websitebouwer die klaar is om als jouw eigen SaaS te lanceren. Jouw gebruikers bouwen Bootstrap 5-pagina's door secties te slepen, bewerken ze deze live (ook in code) en publiceren ze met één klik naar hun eigen subdomein of domein. Het wordt geleverd met accounts, teams, Stripe-betaalplannen, een beheerderspaneel en Docker-implementatie.
Het is geen UI-kit: elk scherm in de screenshots wordt ondersteund door de API, een Postgres-database met versiebeheer en geautomatiseerde tests. De video en de geanimeerde galerijafbeeldingen tonen het in actie.

01. Visuele bouwer
- Slepen en neerzetten vanuit het componentenpaneel (muisklik en aanraking): meer dan 60 Bootstrap 5-componenten en secties.
- Inline tekstbewerking met een dubbele klik.
- Eigenschappenpaneel: tekst, klassen, typografie, ruimte, kleuren, randen, schaduwen en attributen.
- Ongedaan maken/terugzetten (tot 100 stappen), dupliceren, verplaatsen, lagenboom en kruimelpad.
- "Mijn blokken": sla een sectie op en hergebruik deze in een van de projecten van het team.


02. Stijlen met één klik
Het pagina-stijlpaneel herstelt de hele pagina in één keer: 8 kant-en-klare stijlen, een merkpalet met een leesbaarheidscontrole (AA/AAA), Google Fonts en afgeronde hoeken, met een live preview. Het wordt opgeslagen binnen het project en geëxporteerd met het project.


03. Real-time code-editor
Een onderpaneel met CodeMirror 6 voor HTML, CSS en JS, met tweeweg-synchronisatie: wat je typt wordt toegepast op het canvas, en wat je op het canvas doet verschijnt onmiddellijk in de code. Aangepaste CSS wordt live toegepast en reist mee met de export.


04. Sjablonen
8 startersjablonen: SaaS, bureau, café, fotografie, blog, yogastudio, evenement en winkel. Ze worden gegenereerd vanuit een script, zodat je je eigen kunt toevoegen.
05. Responsief ontwerp en donkere modus
Controleer elke pagina op desktop, tablet en mobiel zonder de editor te verlaten. De hele interface (editor, panelen, dialoogvensters en juridische pagina's) heeft lichte en donkere modi, of volgt de systeeminstelling.



06. Publiceren en sites
- Publiceer naar
https://<naam>.jouwsites.com met één klik, met versiegeschiedenis (5, 20 of 50 afhankelijk van het plan) en herstel. - Per-site SEO (beschrijving, sociale afbeelding, favicon, taal, noindex),
robots.txt en sitemap.xml. - Privé 7-daagse previewlinks om een concept aan een klant te tonen.
- Aangepaste domeinen met DNS-verificatie en automatische HTTPS via Caddy.
- Formulieren op gepubliceerde sites ontvangen inzendingen (anti-spam, per-plan quotum, e-mailnotificatie en CSV-export).
- Bezoekstatistieken zonder cookies of persoonlijke gegevens.


07. Teams en samenwerking
- Teams met rollen (eigenaar, admin, redacteur, kijker) en e-mailuitnodigingen.
- Reacties op elementen, met antwoorden en oplossen.
- Autosave met gelijktijdigheidscontrole over tabs en leden, een anti-verlies lokale conceptversie en een prullenbak van 30 dagen.
- Activiteitenlogboek van het team.


08. Accounts en inlogbeveiliging
Aanmelden met e-mailverificatie, wachtwoordherstel, twee-staps verificatie (TOTP + herstelcodes), optionele aanmelding met Google of GitHub, en export en verwijdering van accountgegevens (GDPR). Nieuwe accounts krijgen een stapsgewijze handleiding die automatisch verdergaat.


09. Plannen en Stripe-billing
Gratis, Pro en Team plannen per werkruimte, met limieten die op de server worden afgedwongen. Integreert Stripe Checkout, het Klantenportaal en ondertekende, idempotente webhooks. In ontwikkeling wordt de betaling gesimuleerd zonder de app te verlaten. De plannen en prijscatalogus bevinden zich in één bestand (shared/src/plans.ts); zonder facturering (BILLING_DRIVER=none) werkt het als een interne tool.
10. Beheer
Een platformpaneel voor de eerste geregistreerde gebruiker: cijfers, gebruikers- en werkruimtezoekfunctie, account- en site-suspensie, rapportafhandeling en een wereldwijd activiteitslogboek.

11. Exporteren
Single-file HTML, ZIP (index.html + CSS + JS), ZIP met lokale Bootstrap voor offline gebruik, en een opnieuw importeerbaar .json project.

12. Beveiliging en operaties
- HttpOnly sessiecookies, scrypt-wachtwoorden, snelheidsbeperkingen, zod-validatie en een oorsprongcontrole tegen CSRF.
- Een productie CSP die inline en externe scripts blokkeert; de canvas sanitizes HTML, en gepubliceerde sites worden op hun eigen domein geserveerd, gescheiden van de app.
- Geüploade afbeeldingen worden opnieuw gecodeerd met sharp (geen EXIF of GPS-metadata).
- Docker + Compose (app, Postgres 16, MinIO, Caddy, back-ups),
/healthz, /readyz, Prometheus-metrics, JSON-logs en optionele Sentry.
13. Kwaliteit
Meer dan 250 eenheidstests (Vitest, ook tegen een echte Postgres), 22 end-to-end en toegankelijkheid suites (Playwright + axe), strikte typecheck en lint. Geverifieerd met een schone installatie vanuit de ZIP (npm ci, build, typecheck, tests en lint).
Vereisten
- Node.js 20 of later en npm 10.
- Ontwikkeling: geen Postgres-installatie nodig (het gebruikt ingebedde Postgres via PGlite).
- Productie: Postgres 16 (beheerd of de in
compose.yml), één domein voor de app en een ander met wildcard DNS voor gepubliceerde sites. - Optioneel, met uw eigen sleutels: Stripe, SMTP of Resend voor e-mail, S3/R2 opslag, Google/GitHub OAuth en Sentry.
Goed om te weten
- De interface, code en e-mails zijn in Engels.
- De voorwaarden en privacypagina's zijn concepten: laat ze professioneel beoordelen voordat u de service opent.
- Template-afbeeldingen worden geladen van het Unsplash CDN (Unsplash Licentie) en zijn niet inbegrepen in het pakket.
- Geen sleutels of inloggegevens zijn inbegrepen: stel ze in
.env in op basis van .env.example. - Licenties van derden componenten (MIT, Apache-2.0 en vergelijkbaar) zijn vermeld in
THIRD-PARTY-NOTICES.md. - De screenshots, animaties en video zijn gemaakt met de echte app en verzonnen demo-gegevens.