No description
- Vue 94.9%
- TypeScript 5%
| assets/css | ||
| composables | ||
| layouts | ||
| middleware | ||
| pages | ||
| stores | ||
| .gitignore | ||
| app.vue | ||
| LOGS.md | ||
| nuxt.config.ts | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| tailwind.config.ts | ||
| tsconfig.json | ||
CMS Pemerintah — Frontend
Frontend Nuxt 3 + TypeScript + Tailwind CSS untuk CMS Pemerintah. Mengonsumsi REST API dari backend Laravel 12.
Tech Stack
- Nuxt 3 (Vue 3, TypeScript)
- Tailwind CSS (build step)
- Pinia (state management)
- VueUse (utilities)
- Leaflet (peta interaktif)
- Material Design Icons
Prasyarat
- Node.js 18+
- npm
Instalasi
# 1. Clone repository
git clone https://git.pi.interka.my.id/CMS2026/CMS-FE.git
cd CMS-FE
# 2. Install dependencies
npm install
# 3. Setup environment
cp .env.example .env
# Edit .env: NUXT_PUBLIC_API_BASE=http://localhost:8000/api/v1
# 4. Jalankan dev server
npm run dev -- --host 0.0.0.0 --port 8080
Konfigurasi
| Variable | Default | Keterangan |
|---|---|---|
NUXT_PUBLIC_API_BASE |
http://localhost:8000/api/v1 |
URL backend API |
Halaman
Publik
/— Landing page/berita— Listing berita + search + filter/berita/[slug]— Detail berita/halaman/[slug]— Halaman statis
Admin
/admin/login— Login admin/admin— Dashboard/admin/berita— CRUD Berita/admin/galeri— CRUD Galeri/admin/kategori— CRUD Kategori/admin/halaman— CRUD Halaman/admin/menu— CRUD Menu/admin/pengguna— CRUD Pengguna/admin/tautan— CRUD Tautan/admin/pengaturan— Pengaturan Situs
Fitur
- 🌙 Dark/Light/System theme (persist localStorage)
- 📱 Responsive mobile-first
- 🗺️ Peta Leaflet interaktif
- 🔐 Autentikasi Sanctum token
- 📝 Panel admin lengkap
Struktur Direktori
CMS/
├── composables/ # useApi, useAuth, useDarkMode
├── layouts/ # default.vue (publik), admin.vue
├── middleware/ # auth.ts
├── pages/ # Semua halaman (file-based routing)
├── stores/ # Pinia stores (auth, ui)
└── nuxt.config.ts # Konfigurasi Nuxt