✦Portfolio Project

WARUNG SIYAS

Project ini saya buat untuk mengeksplorasi bagaimana satu produk yang sama bisa diimplementasikan dalam berbagai paradigma web. Tujuannya:
  • - memahami perbedaan arsitektur
  • - membandingkan performa & UX
  • - melihat trade-off tiap pendekatan

Eksplorasi Warung Siyas dalam tiga pendekatan web:
Web 1.0, Web 2.0, dan Web 2.5

Evolusi Web

Era Pertama
🌐

Web 1.0

Website statis berbasis HTML murni dengan konten satu arah baca saja, tak bisa berinteraksi.

Pelajari lebih lanjut →
Era Sosial
⚡

Web 2.0

Website interaktif. User bisa berkontribusi langsung. Konten tidak lagi satu arah.

Pelajari lebih lanjut →
Era Hybrid
🚀

Web 2.5

Pendekatan hybrid modern dengan Laravel, Livewire, dan reactive UI — terbaik dari dua dunia.

Pelajari lebih lanjut →

Web 1.0

Pengertian

Web 1.0 adalah fase awal perkembangan internet di mana website bersifat statis dan hanya menampilkan informasi. Pengunjung hanya dapat membaca konten tanpa melakukan interaksi seperti login, komentar, atau upload data. Website pada era ini umumnya dibuat menggunakan HTML sederhana dengan hyperlink dasar.

✓ Keunggulan

  • Loading sangat cepat karena konten murni HTML statis tanpa logika server-side
  • Biaya hosting minimal, bisa dijalankan di server sederhana dengan resource rendah
  • Aman dari serangan injeksi karena tidak ada input pengguna atau database

✗ Kelemahan

  • Tidak ada interaktivitas pengguna tidak bisa berkontribusi, berkomentar, atau login
  • Update konten memerlukan edit manual file HTML dan re-upload via FTP
  • Desain sangat terbatas: tabel HTML, font dasar, tidak ada
Preview Visual
Klik preview di atas untuk membuka simulasi Web 1.0. Demo ini menampilkan bagaimana website yang dibangun menggunakan HTML & CSS modern.
Preview Landing Page

Tampilan khas Web 1.0: tabel HTML untuk layout, hyperlink biru underline, background abu-abu, tanpa CSS modern. Konten satu arah — dibuat oleh webmaster, dibaca oleh visitor.

Web 2.0

Preview Visual
Klik gambar di bawah untuk membuka simulasi Web 2.0. Demo ini menampilkan bagaimana website yang dibangun menggunakan framework.
Preview Landing Page

Era platform sosial: Facebook, YouTube, Wikipedia. Pengguna bisa membuat konten (UGC), komentar real-time via AJAX, feed dinamis, dan ekosistem sharing yang masif.

Pengertian

Web 2.0 menandai era interaktif dan user-generated content, di mana web bertransformasi menjadi platform dua arah. Teknologi AJAX memungkinkan update halaman tanpa reload penuh, sementara platform seperti Facebook, YouTube, dan Twitter mengubah pengguna dari konsumen pasif menjadi kreator aktif. Data mulai terpusat di server perusahaan besar.

✓ Keunggulan

  • Interaktivitas tinggi: komentar, like, share, real-time notification, collaborative editing
  • UX lebih kaya dengan SPA, AJAX, WebSocket — pengalaman mendekati native desktop app
  • Ekosistem API terbuka memungkinkan integrasi lintas platform dan third-party app

✗ Kelemahan

  • Sentralisasi data massif — privasi pengguna dieksploitasi oleh platform besar (surveillance capitalism)
  • Ketergantungan pada JavaScript berat meningkatkan kompleksitas dan potensi kerentanan
  • Data pengguna dikuasai platform — akun bisa dihapus, data hilang, tanpa kontrol pengguna

Web 2.5

Pengertian

Web 2.5 adalah fase transisi hybrid yang menggabungkan kematangan ekosistem Web 2.0 dengan fondasi teknologi awal desentralisasi. Era ini ditandai PWA (Progressive Web App), cloud-native architecture, AI/ML terintegrasi di sisi server, dan eksperimen awal blockchain. Pengguna mulai memiliki kontrol data terbatas melalui GDPR dan privacy-first tools.

✓ Keunggulan

  • PWA memberikan pengalaman app-like di browser: offline support, push notification, installable
  • AI/ML mulai terintegrasi langsung di web — rekomendasi personal, chatbot, image recognition
  • Regulasi privasi (GDPR) memberi pengguna hak lebih besar atas data mereka sendiri

✗ Kelemahan

  • Kompleksitas teknis meledak: microservices, container orchestration, CDN edge — barrier masuk tinggi
  • Fragmentasi ekosistem: terlalu banyak framework, tooling, standard yang bersaing
  • Regulasi privasi masih inkonsisten antar negara — implementasi compliance sangat costly
Preview Visual
Klik preview di atas untuk membuka simulasi Web 1.0.
Demo ini menampilkan bagaimana website yang
dibangun menggunakan HTML & CSS modern.
Preview Landing Page

Transisi ke arsitektur modern: dashboard cloud-native, AI-powered features, PWA installable, dark mode by default, dan design system yang mature. Perpaduan kematangan Web 2.0 dengan benih desentralisasi.

Web 3.0

Preview Visual
Klik gambar di bawah untuk membuka simulasi Web 2.0. Demo ini menampilkan bagaimana website yang dibangun menggunakan framework.
Preview Landing Page

Era platform sosial: Facebook, YouTube, Wikipedia. Pengguna bisa membuat konten (UGC), komentar real-time via AJAX, feed dinamis, dan ekosistem sharing yang masif.

Pengertian

Web 2.0 menandai era interaktif dan user-generated content, di mana web bertransformasi menjadi platform dua arah. Teknologi AJAX memungkinkan update halaman tanpa reload penuh, sementara platform seperti Facebook, YouTube, dan Twitter mengubah pengguna dari konsumen pasif menjadi kreator aktif. Data mulai terpusat di server perusahaan besar.

✓ Keunggulan

  • True ownership — NFT, token, identitas digital benar-benar milik pengguna, tak bisa diambil platform
  • Trustless transaction via smart contract — tidak butuh intermediary bank atau notaris
  • AI semantic layer membuat mesin memahami intent — UX lebih natural, pencarian lebih cerdas

✗ Kelemahan

  • UX sangat kompleks untuk pengguna awam: private key, seed phrase, gas fee, wallet setup
  • Skalabilitas blockchain masih terbatas — throughput rendah dan biaya transaksi tinggi saat network sibuk
  • Regulasi global masih abu-abu dan tidak konsisten, menciptakan risiko hukum bagi developer dan user