- Editor vibe coding visual open source untuk membuat situs, prototipe, dan desain di web bersama kode secara real-time
- Berbasis Next.js + TailwindCSS, dengan pratinjau real-time di browser dan kemampuan mengubah DOM secara langsung
- Bertujuan menjadi alternatif open source untuk layanan komersial seperti Bolt, Lovable, V0, Replit Agent, Figma Make, dan Webflow
Fitur utama
- Membuat aplikasi Next.js secara instan dari teks/gambar - dukungan impor Figma, templat, dan lainnya direncanakan
- UI mirip Figma untuk membuat halaman, mengelola aset dan token, serta mendukung pratinjau real-time
- Editor kode real-time, simpan dan pulihkan checkpoint, jalankan perintah melalui CLI, serta integrasi marketplace
- Mendukung manipulasi visual seperti drag-and-drop, pengeditan gaya Tailwind, dan eksperimen layout
- Dukungan pengeditan real-time / komentar / tautan berbagi / domain kustom direncanakan
- Berbasis web, tetapi juga dapat terhubung dengan aplikasi desktop (Onlook Desktop)
Arsitektur dan cara kerja
- Saat membuat aplikasi, kode dimuat ke web container lalu dijalankan
- Tautan pratinjau ditampilkan di editor sebagai iFrame, sambil menangani pemetaan antara kode dan UI
- Chatbot AI mendukung akses dan pengeditan kode, serta dapat memahami dan memodifikasi kode secara langsung
- Dapat diperluas ke berbagai framework yang menggunakan DOM deklaratif seperti JSX/TSX/HTML
Stack teknologi yang digunakan
- Frontend: Next.js, TailwindCSS, tRPC
- Database/storage: Supabase, Drizzle
- AI: AI SDK, Anthropic, Morph Fast Apply, Relace
- Sandbox/hosting: CodeSandboxSDK, Freestyle
- Runtime/bundler: Bun, Docker
Informasi lain
- Lisensi Apache 2.0
- Aplikasi web akan segera dirilis, dan aplikasi desktop juga tersedia secara terpisah
- Untuk dokumentasi lengkap dan cara berkontribusi dalam pengembangan, lihat dokumentasi resmi
2 komentar
Onlook - alat pembuat aplikasi kustom dengan Webflow open source
Sekitar setahun lalu sempat naik dengan judul seperti ini, dan memang penamaan itu penting. OOO for XXX lebih mudah dipahami.