Alkademi Logo
Getting Started

Struktur Project

Alkademi LMS Open Source menggunakan struktur modular monolith berbasis Nuxt Layers. Aplikasi utama tetap satu codebase dan satu proses build, tetapi fitur dipisah ke folder cores/ dan plugins/.

Struktur Project

Alkademi LMS Open Source menggunakan struktur modular monolith berbasis Nuxt Layers. Aplikasi utama tetap satu codebase dan satu proses build, tetapi fitur dipisah ke folder cores/ dan plugins/.

lms-opensource/
|-- app/                    # Komponen, layout, composable, dan plugin Nuxt global
|   |-- components/          # AppHeader, AppSidebar, dan komponen global lain
|   |-- composables/         # Composable aplikasi, termasuk generator sidebar
|   |-- layouts/             # Layout default dan landing
|   `-- plugins/             # Plugin Nuxt tingkat aplikasi, termasuk plugin registry
|-- cores/                  # Fitur bawaan LMS
|   |-- kelas/
|   |   |-- components/
|   |   |-- pages/
|   |   |-- server/api/
|   |   |-- stores/
|   |   |-- types/
|   |   |-- core.config.ts
|   |   `-- nuxt.config.ts
|   |-- assignment/
|   |-- form/
|   |-- program/
|   |-- pustaka/
|   |-- studio/
|   `-- uikit/
|-- plugins/                # Plugin kustom atau ekstensi
|   `-- custom-class/
|       |-- components/
|       |-- pages/
|       |-- server/api/
|       |-- plugin.config.ts
|       |-- sidebar.ts
|       `-- nuxt.config.ts
|-- shared/                 # Type dan utility bersama
|   |-- types/
|   `-- utils/layers.ts
|-- web/                    # Layer landing/public site
|-- public/                 # Static assets
|-- nuxt.config.ts          # Komposisi layer utama
`-- package.json

Folder Core

Setiap core feature adalah Nuxt Layer mandiri. Core yang aktif harus memiliki:

  • nuxt.config.ts: membuat folder tersebut dapat dimasukkan ke array extends.
  • core.config.ts: menentukan enabled dan daftar routes untuk sidebar.
  • pages/: halaman fitur. Contoh cores/kelas/pages/dashboard/kelas/index.vue.
  • components/, stores/, server/api/, dan types/: dipakai sesuai kebutuhan fitur.

Contoh core.config.ts:

import type { FeatureConfig } from '../../shared/types/feature'

export default {
  enabled: true,
  routes: [
    {
      key: 'kelas',
      path: '/dashboard/kelas',
      icon: 'i-heroicons-academic-cap',
      label: 'Kelas'
    }
  ]
} satisfies FeatureConfig

Folder Plugin

Plugin juga Nuxt Layer, tetapi memakai plugin.config.ts. Saat enabled: true, plugin akan:

  • dimasukkan ke komposisi Nuxt Layer;
  • didaftarkan di runtime plugin registry;
  • menambahkan route ke sidebar dari field routes;
  • bisa mengganti core tertentu lewat field replaces;
  • bisa memperkaya sidebar lewat file sidebar.ts.

Contoh struktur plugin minimal:

plugins/my-plugin/
|-- pages/
|   `-- dashboard/my-plugin/index.vue
|-- plugin.config.ts
`-- nuxt.config.ts

Shared Types dan Discovery

Kontrak core, plugin, dan sidebar berada di shared/types/. Proses auto-discovery layer berada di shared/utils/layers.ts; file ini membaca core.config.ts dan plugin.config.ts untuk menentukan layer mana yang aktif.

Selanjutnya, mari pelajari lebih dalam mengenai Arsitektur Layers.

Instalasi

Ikuti langkah-langkah di bawah ini untuk memasang Alkademi LMS Open Source di lingkungan lokal Anda.

Arsitektur: Nuxt Layers

Alkademi LMS Open Source dibangun sebagai modular monolith. Semua fitur tetap berjalan sebagai satu aplikasi Nuxt, tetapi setiap domain fitur dipisah menjadi Nuxt Layer agar lebih mudah dirawat, diganti, atau diperluas.

Copyright © 2026