Cara Install Open-Design di VPS Ubuntu untuk Pemula

Oktober 27, 2026

Membuat desain website atau aplikasi sering kali butuh waktu lama, mulai dari menyusun tampilan, merevisi, sampai menerjemahkannya ke dalam kode. Open-Design hadir untuk membantu mempercepat proses itu. Platform berbasis AI ini bisa menghasilkan desain dan kode hanya dari instruksi (prompt) yang Anda berikan, dan dapat dihubungkan ke berbagai penyedia LLM seperti OpenAI, Claude, dan Gemini.

Dengan memasang Open-Design di VPS sendiri (self-hosted), data dan proyek Anda tetap berada di server yang Anda kelola, sehingga kontrol atas konfigurasi dan keamanannya sepenuhnya ada di tangan Anda. Pada tutorial ini, kita akan membahas cara install Open-Design di VPS Ubuntu secara bertahap, mulai dari persiapan server, instalasi, konfigurasi, hingga Open-Design siap diakses lewat browser. Panduan ini dibuat agar mudah diikuti, bahkan oleh pemula.

STEP 1 : Login ke root vps kamu kemudian lakukan update sistem

$ sudo apt update && sudo apt upgrade -y

Selanjutnya, install paket yang dibutuhkan untuk installasi Open-Design

$ sudo apt install git curl build-essential -y

STEP 2 : Install Nodejs

Open-Design memerlukan Node.js agar aplikasinya bisa berjalan. Dalam panduan ini, kita akan memasang Node.js LTS versi 24 yang diambil dari repositori NodeSource.

$ curl -fsSL https://deb.nodesource.com/setup_24.x | sudo -E bash -
$ sudo apt install nodejs -y

Jika sudah, install pnpm sebagai package manager

$ npm install -g pnpm

Setelah berhasil, cek versi nodejs yang terinsall

$ npm -v

STEP 3 : Setelah Node.js terinstall, langkah selanjutnya adalah mengambil source code Open-Design dari repositori resminya di GitHub. Dalam panduan ini, repositori akan diletakkan di direktori /opt, lokasi yang biasa dipakai untuk menyimpan aplikasi pihak ketiga di Linux.

$ cd /opt
git clone https://github.com/nexu-io/open-design.git

Setelah berhasil terinstall, masuk ke directory Open-Design

$ cd open-design

Jika proses clone berhasil, semua file Open-Design akan berada di direktori /opt/open-design, sehingga Anda bisa lanjut ke tahap instalasi dependensi.

STEP 4 : Setelah source code selesai diunduh, langkah selanjutnya adalah memasang semua dependency yang dibutuhkan Open-Design. Dependency ini diperlukan agar aplikasi bisa berjalan dan seluruh fitur dapat berfungsi dengan baik.

Apabila pnpm belum terpasang, instal terlebih dahulu sebagai package manager.

$ npm install -g pnpm

Selanjutnya, pasang semua dependency proyek dengan menjalankan perintah berikut.

$ pnpm install

Proses instalasi bisa memakan waktu beberapa menit, bergantung pada spesifikasi server dan kecepatan koneksi internet. Jika sudah selesai tanpa error, Anda bisa lanjut ke tahap konfigurasi aplikasi.

STEP 5 : Setelah semua dependency terpasang, build source code Open-Design ke versi production agar siap dijalankan di server. Jalankan perintah berikut untuk build backend (daemon).

$ pnpm --filter @open-design/daemon build

Selanjutnya, lakukan build pada frontend (web).

$ pnpm --filter @open-design/web build

Jika kedua proses build selesai tanpa error, Open-Design sudah siap dikonfigurasi dan dijalankan di VPS.

STEP 6 : Sebelum menjalankan Open-Design, buat file environment (.env) berisi konfigurasi dasar aplikasi. Untuk pengujian atau penggunaan lokal, gunakan konfigurasi berikut.

$ cat > /opt/open-design/apps/daemon/.env << 'EOF'
HOST=0.0.0.0
PORT=7456
NODE_ENV=production
EOF

Jika Open-Design akan diakses lewat internet atau dipakai di server production, sebaiknya aktifkan autentikasi API dengan token supaya akses ke backend lebih aman.

Jangan lupa ubah domainanda.com dengan nama domain Anda ya sob

$ OD_API_TOKEN=$(openssl rand -hex 32)
echo "API Token: $OD_API_TOKEN"

cat > /opt/open-design/apps/daemon/.env << EOF
HOST=0.0.0.0
PORT=7456
NODE_ENV=production
OD_API_TOKEN=$OD_API_TOKEN
OD_ALLOWED_ORIGINS=https://domainanda.com
EOF

STEP 7 : Setelah konfigurasi environment selesai, backend (daemon) Open-Design siap dijalankan. Pastikan Anda berada di direktori proyek, lalu jalankan perintah berikut.

$ cd /opt/open-design

# Jalankan daemon
pnpm --filter @open-design/daemon start

Jika berhasil, daemon akan berjalan di port 7456 sesuai konfigurasi sebelumnya. Setelah itu, Anda bisa lanjut mengatur frontend atau reverse proxy agar Open-Design dapat diakses lewat browser.

Setelah itu, lakukan ssh tunel pada terminal device , dan jalankan :

$ ssh -L 7456:localhost:7456 root@IP-VPS

Setelah berhasil login. akses http://localhost:7456/onboarding di browser Anda

Run Open-Design di Background dengan PM2

STEP 1 : Install PM2 terlebih dahulu. Sebelum pm2 start, tambahkan:

$ npm install -g pm2

STEP 2 : Jalankan Open-Design dengan :

$ pm2 start "pnpm --filter @open-design/daemon start" --name open-design

STEP 3 : Simpan konfigurasi PM2

$ pm2 save

Terakhir, aktifkan startup PM2 agar Open-Design otomatis berjalan setiap kali VPS di-reboot.

$ pm2 startup

Ikuti perintah yang ditampilkan PM2, kemudian jalankan:

$ pm2 save

Sekarang Open-Design sudah terpasang dan berjalan di VPS Ubuntu Anda. Mulai dari menyiapkan Node.js, mengunduh source code, menginstal dependency, melakukan build, mengatur file environment, hingga menjalankan daemon di background dengan PM2, semuanya sudah Anda lalui. Dengan begitu, Open-Design tetap aktif meski terminal ditutup dan otomatis berjalan kembali setelah VPS di-reboot.

Agar lebih aman, aktifkan autentikasi API dengan token, terutama jika Open-Design akan diakses lewat internet. Untuk pemakaian jangka panjang, Anda juga bisa menambahkan domain dengan Nginx reverse proxy dan SSL, serta rutin memperbarui Open-Design ke versi terbaru. Jika mengalami kendala saat mengikuti tutorial ini, silakan hubungi tim support Jagoan Hosting yang siap membantu Anda.