Routing

Routing dalam framework Ngorei adalah sistem yang menangani navigasi dan pemuatan konten berdasarkan URL. Komponen <Routing> memungkinkan Anda menentukan bagaimana konten dimuat secara dinamis berdasarkan path URL.


<Routing path="doc/intro|doc/routing"></Routing>

1. Konsep Dasar

Struktur Path

Path routing terdiri dari dua bagian yang dipisahkan dengan tanda |:

Default Path: Path yang digunakan sebagai fallback
Dynamic Path: Path yang akan diproses berdasarkan URL

path="[default_path]|[dynamic_path]"

Format URL

URL menggunakan format khusus dengan tanda "-" sebagai pemisah:

example.com/docs-section/page

Dimana:

"docs" adalah base path
"section/page" adalah nilai yang akan digunakan sebagai routing

2. Penggunaan Dasar

2.1 Routing Sederhana

<Routing path="doc/intro"></Routing>

Akan memuat konten dari file doc/intro.html

2.2 Routing dengan Path Dinamis

<Routing path="doc/intro|doc/routing"></Routing>

Akan memuat konten berdasarkan URL, dengan doc/intro sebagai fallback

2.3 Routing dengan Section Spesifik

<Routing path="doc/users/default|doc/users/routing"></Routing>

Membatasi routing ke section users dengan fallback ke default

3. Variabel Path

Variabel Tersedia

routing: Nilai dari URL setelah tanda "-"
doc: Nama halaman saat ini

Contoh Penggunaan

<Routing path="doc/doc|doc/routing"></Routing>

4. Sistem Fallback

Ketika file tidak ditemukan, sistem akan mencari file dalam urutan berikut:

File yang diminta langsung (contoh: doc/page.html)
File dengan nama dari variabel page
File default yang ditentukan
intro.html di direktori yang sama
index.html di direktori yang sama

5. Contoh Implementasi Lengkap

<div class="container">
  <!-- Header Section -->
  <header class="header">
    <h1>Dokumentasi</h1>
  </header>

  <!-- Main Content -->
  <main class="content">
    <!-- Basic Routing -->
    <Routing path="doc/intro|doc/routing"></Routing>

    <!-- Section Specific Routing -->
    <Routing path="doc/users/default|doc/users/routing"></Routing>

    <!-- Admin Section Routing -->
    <Routing path="doc/dashboard|doc/admin/routing"></Routing>
  </main>
</div>

6. Struktur Folder

public/
  doc/
    index.html      # Landing page utama
    intro.html      # Fallback default
    lingkungan/
      intro.html    # Landing page section
      routing.html  # Halaman ini
      config.html   # Halaman konfigurasi
    komponen/
      intro.html    # Landing page komponen
      button.html   # Dokumentasi button
      form.html     # Dokumentasi form

7. Best Practices

Yang Harus Dilakukan

Selalu sediakan default path
Gunakan struktur folder yang konsisten
Manfaatkan variabel routing untuk routing dinamis
Sediakan file fallback di setiap folder

Yang Harus Dihindari

Menggunakan karakter khusus dalam path
Mengandalkan single fallback
Path yang terlalu dalam (nested)
URL yang tidak konsisten

Catatan Penting:

Framework mendukung multiple file extensions: .html, .php, .tpl
Error akan ditampilkan sebagai komentar HTML dalam mode development
Pastikan permission folder dan file sudah benar
Gunakan URL yang SEO-friendly

Perhatian:

Selalu backup file sebelum melakukan perubahan pada struktur routing. Perubahan routing dapat mempengaruhi seluruh navigasi aplikasi.