Uji Kompetensi Local Next.js App
Checkpoint kesiapan untuk menjalankan, menjelaskan, dan menyimpan Next.js App Router project kecil di perangkat sendiri.
Yang dicek
- Memeriksa project lokal terhadap checklist App Router
- Menjelaskan route, layout, loading/error UI, metadata, dan GitHub workflow
- Menyusun project note yang dapat dipakai di README atau portfolio
Isi lesson
6 blok- 1.Checkpoint: project lokal harus dapat dijalankan dan dijelaskanBelum selesaiWajib
- 2.QuizBelum selesaiWajib
- 3.Project self-review checklistBelum selesaiWajib
- 4.Writing practiceBelum selesaiWajib
- 5.Dokumentasi untuk melanjutkan project lokal dengan mandiriBelum selesaiWajib
- 6.RingkasanBelum selesaiWajib
Checkpoint: project lokal harus dapat dijalankan dan dijelaskan
WajibProject Local Next.js tidak dinilai dari seberapa besar UI-nya. Yang diperiksa adalah workflow dan struktur: project memakai App Router, dev server berjalan, route dan layout dapat dibuka, loading/error UI berada pada route relevan, metadata memberi konteks, dan project tersimpan di GitHub tanpa secret.
Uji Kompetensi ini adalah self-review jujur. FluentStack tidak dapat membuka terminal, file system, browser localhost, atau repository kamu. Lengkapi checklist di perangkat kamu, lalu gunakan writing practice untuk menjelaskan project seperti kepada reviewer teknis.
Bagian ini memengaruhi progres lesson.
Quiz
WajibUji Kompetensi Local Next.js App
Jawab pertanyaan satu per satu. Kamu bisa ulang quiz jika belum mencapai target lulus.
Target lulus
70/100
Skor terbaik
0/100
Status
Belum dikerjakan
Blok ini wajib untuk menyelesaikan lesson. Progres quiz naik setelah skor mencapai target lulus.
Pertanyaan 1 dari 6
Target lulus: 70
Apa tujuan utama Local Next.js App milestone?
Project self-review checklist
WajibCek project lokal satu per satu:
- Project dibuat dengan create-next-app dan memakai App Router.
- `npm run dev` berjalan dari root project dan app terbuka di browser lokal.
- Ada root layout dan route dashboard serta child route courses.
- Dashboard layout merender children untuk page dan child route.
- Route courses memiliki loading.tsx dan error.tsx di folder yang benar.
- Error UI memakai client boundary hanya untuk recovery.
- Page courses memiliki metadata title dan description.
- .env.local, token, password, dan code test error tidak masuk commit.
- `git status` bersih setelah commit relevan.
- Project sudah dipush ke GitHub atau kamu memahami blocker autentikasi yang perlu diselesaikan.
Checklist ini bukan auto-validation. Jangan menandai selesai bila project belum pernah dijalankan atau belum diperiksa langsung.
Bagian ini memengaruhi progres lesson.
Writing practice
WajibLatihan menulis
Tulis 100-160 kata untuk bagian README atau project note. Jelaskan tujuan app, cara menjalankannya secara lokal, dua route yang tersedia, peran layout, loading/error UI, metadata, dan status repository GitHub. Tulis seolah-olah menyerahkan project kepada reviewer teknis.
Tulis draft dulu sebelum menandai writing practice selesai.
0/80 karakter
Checklist panduan
Checklist ini hanya panduan. Kamu tidak harus mencentang semuanya.
Documentation Bridge
WajibDokumentasi untuk melanjutkan project lokal dengan mandiri
Gunakan halaman resmi saat kamu menemukan kebutuhan nyata di project, bukan untuk dibaca sekaligus. Setelah milestone ini, dokumentasi menjadi bagian workflow pengembangan lokalmu.
Next.js Docs
Installation
Fokus baca
- create-next-app dan recommended defaults.
- Script dev dari package.json dan local URL.
Abaikan dulu
- Manual installation dan configuration bundler lanjutan.
Next.js Docs
Layouts and Pages
Fokus baca
- page.tsx sebagai UI route.
- layout.tsx dan children untuk shared shell.
- Folder App Router yang membentuk URL.
Abaikan dulu
- Dynamic segment dan route group yang tidak dipakai project kecilmu.
Next.js Docs
loading.js file convention
Fokus baca
- Lokasi loading.tsx di route segment.
- Fallback ringan yang memberi context kepada user.
Abaikan dulu
- Streaming status code dan Suspense custom boundary.
Next.js Docs
Error Handling
Fokus baca
- error.tsx sebagai route error boundary.
- Client Component dan recovery callback pada error UI.
Abaikan dulu
- Server Functions, global error, dan error boundary tingkat component.
Next.js Docs
Metadata and OG images
Fokus baca
- metadata object untuk title dan description route.
- Metadata API pada Server Component.
Abaikan dulu
- Dynamic metadata dan Open Graph image.
GitHub Docs
Adding locally hosted code to GitHub
Fokus baca
- git status, commit, remote origin, dan push awal.
- Peringatan agar secret tidak di-add atau di-push.
Abaikan dulu
- GitHub CLI, organization setup, dan migration kompleks.
Aksi setelah membaca
Rapikan README project lokal dengan tujuan app, cara menjalankan, route yang tersedia, dan satu screenshot bila kamu sudah nyaman. Lanjutkan hanya ketika repository tidak berisi .env.local, token, atau kode test error sementara.
Bagian ini memengaruhi progres lesson.
Ringkasan
Wajib- Kamu siap melanjutkan bila dapat menjalankan App Router project lokal dan menjelaskan struktur utamanya.
- Route, layout, loading/error UI, metadata, dan Git workflow memiliki tanggung jawab berbeda namun terhubung.
- Self-review lokal dilakukan di perangkat dan repository sendiri, bukan dianggap lolos otomatis oleh FluentStack.
- Level berikutnya memasuki Production Next.js, dimulai dari Authentication and Session-Aware UI.
Bagian ini memengaruhi progres lesson.
Langkah berikutnya
Selesaikan bagian wajib checkpoint ini
Lanjutkan blok wajib berikutnya: Checkpoint: project lokal harus dapat dijalankan dan dijelaskan.