Apa itu Lumora?
Lumora adalah pembangun situs web visual yang siap diluncurkan sebagai SaaS Anda sendiri. Pengguna Anda membangun halaman Bootstrap 5 dengan menyeret bagian, mengeditnya secara langsung (dalam kode juga) dan menerbitkannya dengan satu klik ke subdomain atau domain mereka sendiri. Ini dilengkapi dengan akun, tim, rencana berbayar Stripe, panel admin, dan penyebaran Docker.
Ini bukan kit UI: setiap layar dalam tangkapan layar didukung oleh API, basis data Postgres dengan migrasi versi dan pengujian otomatis. Video dan gambar galeri animasi menunjukkan cara kerjanya.
01. Pembangun visual
- Seret dan lepas dari panel komponen (mouse dan sentuh): lebih dari 60 komponen dan bagian Bootstrap 5.
- Penyuntingan teks secara langsung dengan klik ganda.
- Panel properti: teks, kelas, tipografi, spasi, warna, batas, bayangan, dan atribut.
- Undo/redo (hingga 100 langkah), duplikat, pindah, pohon lapisan, dan remah roti.
- "Blok saya": simpan sebuah bagian dan gunakan kembali di proyek tim mana pun.
02. Gaya halaman satu klik
Panel gaya halaman mengubah gaya seluruh halaman sekaligus: 8 gaya siap pakai, palet merek dengan pemeriksaan keterbacaan (AA/AAA), Google Fonts dan pembulatan sudut, dengan pratinjau langsung. Ini disimpan di dalam proyek dan diekspor bersamanya.
03. Editor kode waktu nyata
Panel bawah dengan CodeMirror 6 untuk HTML, CSS, dan JS, dengan sinkronisasi dua arah: apa yang Anda ketik diterapkan ke kanvas, dan apa yang Anda lakukan di kanvas muncul di kode secara instan. CSS kustom diterapkan secara langsung dan dibawa bersama dengan ekspor.
04. Template
8 template pemula: SaaS, agensi, kafe, fotografi, blog, studio yoga, acara, dan toko. Mereka dihasilkan dari skrip, sehingga Anda dapat menambahkan milik Anda sendiri.
05. Desain responsif dan mode gelap
Periksa setiap halaman di desktop, tablet, dan ponsel tanpa meninggalkan editor. Seluruh antarmuka (editor, panel, dialog, dan halaman hukum) memiliki mode terang dan gelap, atau mengikuti pengaturan sistem.
06. Penerbitan dan situs
- Terbitkan ke
https://<name>.yoursites.com dengan satu klik, dengan riwayat versi (5, 20, atau 50 tergantung pada rencana) dan pemulihan. - SEO per situs (deskripsi, gambar sosial, favicon, bahasa, noindex),
robots.txt dan sitemap.xml. - Tautan pratinjau pribadi 7 hari untuk menunjukkan draf kepada klien.
- Domain kustom dengan verifikasi DNS dan HTTPS otomatis melalui Caddy.
- Formulir di situs yang diterbitkan menerima pengiriman (anti-spam, kuota per rencana, pemberitahuan email, dan ekspor CSV).
- Statistik kunjungan tanpa cookie atau data pribadi.
07. Tim dan kolaborasi
- Tim dengan peran (pemilik, admin, editor, penonton) dan undangan email.
- Komentar pada elemen, dengan balasan dan penyelesaian.
- Penyimpanan otomatis dengan kontrol konkurensi di seluruh tab dan anggota, draf lokal anti-kehilangan, dan tempat sampah 30 hari.
- Log aktivitas tim.
08. Akun dan keamanan masuk
Daftar dengan verifikasi email, pemulihan kata sandi, verifikasi dua langkah (TOTP + kode pemulihan), masuk opsional dengan Google atau GitHub, dan ekspor serta penghapusan data akun (GDPR). Akun baru mendapatkan panduan memulai yang maju dengan sendirinya.
09. Rencana dan penagihan Stripe
Rencana Gratis, Pro, dan Tim per ruang kerja, dengan batasan yang diterapkan di server. Mengintegrasikan Stripe Checkout, Portal Pelanggan, dan webhook yang ditandatangani serta idempotent. Dalam pengembangan, pembayaran disimulasikan tanpa meninggalkan aplikasi. Katalog rencana dan harga berada dalam satu file (shared/src/plans.ts); tanpa penagihan (BILLING_DRIVER=none) berfungsi sebagai alat internal.
10. Administrasi
Panel platform untuk pengguna pertama yang terdaftar: angka, pencarian pengguna dan ruang kerja, penangguhan akun dan situs, penanganan laporan, dan log aktivitas global.
11. Ekspor
HTML satu file, ZIP (index.html + CSS + JS), ZIP dengan Bootstrap lokal untuk penggunaan offline, dan proyek .json yang dapat diimpor kembali.
12. Keamanan dan operasi
- Cookie sesi HttpOnly, kata sandi scrypt, pembatasan laju, validasi zod, dan pemeriksaan asal terhadap CSRF.
- CSP produksi yang memblokir skrip inline dan pihak ketiga; kanvas menyanitasi HTML, dan situs yang diterbitkan disajikan di domain mereka sendiri, terpisah dari aplikasi.
- Gambar yang diunggah di-encode ulang dengan sharp (tanpa metadata EXIF atau GPS).
- Docker + Compose (aplikasi, Postgres 16, MinIO, Caddy, cadangan),
/healthz, /readyz, metrik Prometheus, log JSON, dan Sentry opsional.
13. Kualitas
Lebih dari 250 pengujian unit (Vitest, juga terhadap Postgres nyata), 22 suite end-to-end dan aksesibilitas (Playwright + axe), pemeriksaan tipe ketat dan lint. Diverifikasi dengan instalasi bersih dari ZIP (npm ci, build, pemeriksaan tipe, pengujian, dan lint).
Persyaratan
- Node.js 20 atau lebih baru dan npm 10.
- Pembangunan: tidak perlu instalasi Postgres (menggunakan Postgres terbenam melalui PGlite).
- Produksi: Postgres 16 (dikelola atau yang ada di
compose.yml), satu domain untuk aplikasi dan satu lagi dengan DNS wildcard untuk situs yang diterbitkan. - Opsional, dengan kunci Anda sendiri: Stripe, SMTP atau Resend untuk email, penyimpanan S3/R2, Google/GitHub OAuth, dan Sentry.
Baik untuk diketahui
- Antarmuka, kode, dan email dalam Bahasa Inggris.
- Halaman syarat dan privasi adalah draf: minta tinjauan profesional sebelum membuka layanan.
- Gambar template dimuat dari CDN Unsplash (Lisensi Unsplash) dan tidak termasuk dalam paket.
- Tidak ada kunci atau kredensial yang disertakan: atur di
.env berdasarkan .env.example. - Lisensi komponen pihak ketiga (MIT, Apache-2.0, dan sejenisnya) terdaftar di
THIRD-PARTY-NOTICES.md. - Tangkapan layar, animasi, dan video dibuat dengan aplikasi nyata dan data demo yang dibuat-buat.
−33%
