Types of Components

Anda mendefinisikan Komponen. Komponen adalah lapisan data yang terhubung dengan UI.

Komponen Kustom adalah Artikel Blog, Penulis, alamat, data mentah kustom, dll.

Komponen UI hanyalah Komponen Kustom yang ditandai sebagai Elemen UI, footer, header, hero, dan sebagainya.

Komponen Sistem telah ditetapkan sebelumnya oleh CMS sebagai Negara dan Bahasa.

Apa itu Komponen UI?

Halaman tersusun dari lebih dari satu Komponen UI

Contoh:

• blok-hero
• blok-fitur
• karusel-gambar
• header/footer

Setiap Komponen UI merepresentasikan satu bagian halaman Anda.

Alur Kerja Komponen UI

1. Definisikan sebuah komponen (struktur blok) di pembuat komponen
2. Buat komponen UI
3. Tetapkan Komponen UI ke sebuah halaman
4. Render di sisi klien dengan blok yang sesuai dalam registri blok dan pengaturan perender

Contoh: Skema Blok Hero

Sebuah blok hero dapat berisi:

• Gambar
• Judul
• Subjudul

Skema JSON di editor

[
  {
    "name": "heading",
    "type": "string",
    "required": false,
    "displayName": "heading"
  },
  {
    "name": "subtitle",
    "type": "string",
    "required": false,
    "displayName": "subtitle"
  },
  {
    "name": "hero_img",
    "type": "image",
    "required": false,
    "displayName": "hero_img"
  }
]

Penyiapan Panel Admin

• Buat blok baru
• Lampirkan skema (HeroSchema)
• Beri nama blok (misalnya, hero-block)

Menetapkan Blok ke Halaman

• Buka sebuah rute di panel admin
• Klik Assign Page
• Tambahkan blok yang baru dibuat

Perenderan di Klien

Setelah ditetapkan, blok dapat diambil dan dirender di sisi klien menggunakan pengaturan perender Anda.

Ringkasan

• Skema mendefinisikan struktur blok
• Blok mendefinisikan bagian-bagian halaman
• Halaman tersusun dari banyak blok
• Sepenuhnya dapat disesuaikan dan digunakan kembali