No description
  • Vue 94.9%
  • TypeScript 5%
Find a file
2026-07-17 01:13:54 +07:00
assets/css Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
composables Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
layouts Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
middleware Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
pages Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
stores Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
.gitignore Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
app.vue Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
LOGS.md Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
nuxt.config.ts Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
package-lock.json Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
package.json Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
README.md docs: tambah README.md frontend 2026-07-17 01:13:54 +07:00
tailwind.config.ts Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00
tsconfig.json Milestone 2: Frontend Nuxt 3 — public pages, admin panel, auth, dark mode, Leaflet map 2026-07-17 01:04:46 +07:00

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