Legacya Sphere

MAKE_IT_LIVE_PRIVATE_WEB

4 menit baca

Panduan Deployment: Menjadikan Obsidian War Room Sebagai Private Web

Dokumen: Operational Deployment Blueprint
Lokasi: 00 War Room/MAKE_IT_LIVE_PRIVATE_WEB.md
Target: Live Private Web Application (Akses browser aman & terenkripsi)
Tim Pelaksana: Yoga (Founder) · Argon (Frontend Lead) · Claude (System Architect) · AGY (Operations)

🎯 1. Visi & Tujuan

Mengubah workspace Obsidian ini dari sekadar folder lokal menjadi Web Dashboard Pribadi yang Live yang dapat dibuka di browser (laptop/HP) di mana saja, dengan kriteria:

  1. 100% Privat & Aman: Hanya bisa diakses oleh Yoga Pratama Effendi (dilindungi autentikasi/password).
  2. Rendering Obsidian Penuh: Mendukung wikilinks ([[...]]), callouts, graph view, tags, dan visual canvas.
  3. Sinkronisasi Otomatis: Setiap pembaruan catatan oleh Claude, Argon, atau AGY otomatis terbit ke web.

👥 2. Pembagian Peran (Argon & Claude)

AgenSpesialisasiTanggung Jawab dalam Project Ini
ArgonCreative Director & Frontend EngineerMerancang tampilan UI/UX web, memastikan estetika premium (dark mode, typography elegan Legacya Sphere, responsif mobile), konfigurasi tema, dan custom component.
ClaudeChief Architect & LogicMengatur parsing Markdown/Wikilinks, struktur rute halaman, integrasi API, dan memastikan keamanan data private.
AGYLocal Ops & AutomationMenjalankan build commands di PowerShell, konfigurasi Git remote, setup Cloudflare/Vercel CLI, dan background daemon.
YogaFounder & Decision MakerApproval proposal, pemilihan opsi hosting, dan pemegang kunci akses utama.

🛠️ 3. Opsi Arsitektur Private Web (Pilih Salah Satu)

OPSI A: Quartz 4.0 + Cloudflare Pages / Vercel (Paling Direkomendasikan)

Pilihan terbaik jika menginginkan web yang sangat cepat, tampilan native Obsidian lengkap dengan Graph View & Search, serta hosting gratis tanpa perlu menyalakan PC terus-menerus.

  • Cara Kerja:
    1. Quartz 4.0 membaca folder .agents/obsidian dan meng-compile Markdown menjadi static web app modern (React / Preact).
    2. Web di-deploy ke Cloudflare Pages atau Vercel melalui private GitHub repository.
  • Cara Mengunci Menjadi Privat (2 Cara):
    • Cara 1 (Cloudflare Zero Trust - Gratis & Sangat Aman): Pasang Cloudflare Access pada subdomain Anda (misal brain.legacya.id atau *.pages.dev). Setiap kali web dibuka, sistem akan meminta login kode OTP via email Yoga.
    • Cara 2 (Argon2 / StatiCrypt Client-Side Encryption): Web dienkripsi penuh menggunakan algoritma sandi Argon2/AES. Siapapun yang membuka web wajib memasukkan password sebelum konten bisa didekripsi di browser.

OPSI B: Cloudflare Tunnel + Live Vault Server (Real-Time 2-Way Sync)

Pilihan terbaik jika Anda ingin bisa mengedit langsung dari web dan perubahan langsung tersimpan ke PC lokal tanpa jeda git commit.

  • Cara Kerja:
    1. Jalankan web server lokal di PC Anda yang membaca folder Obsidian.
    2. Gunakan cloudflared (Cloudflare Tunnel) untuk membuat jalur HTTPS aman langsung ke PC Anda tanpa membuka port router (No port forwarding).
    3. Dilindungi oleh Cloudflare Access PIN.

OPSI C: Custom Next.js / Tailwind Dashboard oleh Argon & Claude

Pilihan custom penuh di mana Argon membuatkan frontend interaktif khusus untuk Legacya Sphere, dengan tampilan chatbox roomchat sungguhan di sisi kanan layar.

  • Stack: Next.js 15, Tailwind CSS, Lucide Icons, Contentlayer/MDX.
  • Fitur: Di samping kanan ada panel chat live tempat Yoga bisa mengetik perintah langsung ke Claude dan Argon, sementara di sebelah kiri menampilkan catatan wiki dan visual canvas.

📋 4. Langkah Eksekusi (Step-by-Step Menggunakan Opsi A: Quartz)

Langkah 1: Inisialisasi Quartz

Di dalam folder .agents/obsidian, jalankan:

# Inisialisasi Quartz v4
npx.cmd quartz create

Pilih opsi: “Empty Quartz” atau “Copy existing Obsidian vault”.

Langkah 2: Styling & Sentuhan Frontend oleh Argon

Argon bertugas mengonfigurasi quartz.config.ts dan quartz.layout.ts:

  • Ubah tema ke palette Legacya Sphere (Dark mode: deep blue/black #0b0f19, aksen cyan/blue).
  • Set defaultDateType: "modified".
  • Aktifkan komponen: Graph, Explorer, Search, TableOfContents, dan Backlinks.

Langkah 3: Setup Proteksi Privat (Zero Trust)

  1. Buat private repository di GitHub: legacya-sphere-vault.
  2. Hubungkan repository lokal ini: 
    git remote add origin https://github.com/<username>/legacya-sphere-vault.git
git push -u origin master
  3. Hubungkan repo ke Cloudflare Pages:
    • Build command: npx quartz build
    • Output directory: public
  4. Di dashboard Cloudflare: Buka Zero Trust Access Applications Tambahkan domain web Anda Set policy: Allow email operations@legacya.sphere atau email pribadi Yoga.

🔒 5. Hard Rules Keamanan Data Privat

Sesuai dengan arahan ATURAN_FILE_UNIVERSAL.md:

  1. No Index / No Follow: Seluruh halaman wajib menyertakan tag <meta name="robots" content="noindex, nofollow"> agar tidak pernah terindeks di Google.
  2. Zero Leak Token: Jangan pernah melakukan commit file .env, API key Claude/OpenAI, atau konfigurasi lokal ke GitHub.
  3. Backup Sumber: File mentah di 01 Materi Masuk dan 02 Referensi & Arsip tetap tersimpan aman di disk lokal PC Yoga.

Tampilan Grafik

Tautan Balik