FluentStack

Uji Kompetensi Production Operations

Mode tersedia: dark, light, paper
MasukDaftar
Advanced · Level 11: Production Next.jsAdvanced80 menitBahasa Indonesia

Uji Kompetensi Production Operations

Memeriksa readiness untuk mendeploy Next.js app, menempatkan environment variable dengan aman, membaca log, dan merespons masalah production secara terstruktur.

StatusMemuat progres
ReadinessMemuat...

...

Memuat progres

Menyiapkan langkah berikutnya

Yang dicek

  • Menentukan alur GitHub ke Preview dan Production Deployment
  • Menempatkan configuration browser-safe dan secret pada boundary yang tepat
  • Membedakan bukti build, runtime, auth, dan cache saat terjadi masalah
  • Menulis production note yang dapat dipakai rekan developer
DeploymentVercelEnvironment VariablesLogsReadiness Checkpoint

Isi lesson

7 blok
  1. 1.
    Checkpoint: deployment adalah workflow yang dapat dijelaskan ulangBelum selesaiWajib
  2. 2.
    QuizBelum selesaiWajib
  3. 3.
    Coding practiceBelum selesaiWajib
  4. 4.
    Self-review deployment nyataBelum selesaiWajib
  5. 5.
    Writing practiceBelum selesaiWajib
  6. 6.
    Gunakan dokumentasi sebagai playbook production awalBelum selesaiWajib
  7. 7.
    RingkasanBelum selesaiWajib

Checkpoint: deployment adalah workflow yang dapat dijelaskan ulang

Wajib

Kamu sudah mempelajari alur yang perlu saling terhubung: build lokal sebelum push, Preview Deployment untuk review, Production Deployment dari branch yang tepat, environment variable yang scoped dan tidak bocor, log sesuai waktu error, serta cache sebagai keputusan freshness. Semua bagian ini perlu diperiksa bersama ketika app tidak bekerja seperti di localhost.

Uji Kompetensi ini tidak dapat mengakses GitHub repository, Vercel Dashboard, environment variable, callback URL, atau log production kamu. Gunakan hasilnya sebagai readiness checkpoint. Tandai self-review hanya setelah kamu melakukan langkah nyata pada Local Next.js App dan menyimpan catatan deployment tanpa credential. Bila belum memiliki project, selesaikan checkpoint struktural terlebih dahulu lalu jadikan daftar ini rencana implementasi lokal.

Bagian ini memengaruhi progres lesson.

Quiz

Wajib

Uji Kompetensi Production Operations

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 8

Target lulus: 70

Apa tujuan utama push perubahan ke feature branch setelah repository terhubung ke Vercel?

Coding practice

WajibDibuka di workspace khusus

Build production readiness checkpoint

Lengkapi readiness map yang menyatukan Git workflow, environment boundary, log diagnosis, dan pemeriksaan production tanpa mengklaim deployment sudah terjadi.

Tujuan awal: Fokus di tab TSX.

Practice ini dibuka di workspace khusus. Buka practice untuk memakai editor, preview, dan cek otomatis.

Tombol selesai aktif setelah semua validasi wajib lolos.

5 cek otomatis5 checklist
Belum selesaiBuka practice

Self-review deployment nyata

Wajib

Pada Local Next.js App yang sudah siap, lakukan cek manual berikut:

  • npm run build selesai di local tanpa mengandalkan warning yang tidak dipahami.
  • Repository sudah dipush ke GitHub dan terhubung ke Vercel Project yang benar.
  • Preview URL dibuka sebelum perubahan dipromosikan ke production branch.
  • Nama variable environment sudah dipetakan ke Preview atau Production tanpa menaruh nilainya di source control.
  • Secret server-only tidak memakai prefix NEXT_PUBLIC_.
  • Production URL, route penting, dan flow auth diperiksa setelah deploy.
  • Build log atau runtime log dibaca bila terjadi kegagalan; jangan log credential untuk diagnosis.
  • README atau production note menyebut cara deploy, route yang dicek, dan follow-up tanpa secret.

FluentStack tidak dapat memverifikasi dashboard atau project lokalmu. Jangan menandai selesai hanya karena checklist dibaca; gunakan hasil pengujian nyata sebagai dasar completion.

Bagian ini memengaruhi progres lesson.

Writing practice

Wajib

Latihan menulis

Tulis production note 120-180 kata untuk rekan developer. Sebut perubahan yang akan dideploy, jalur Preview ke Production, nama variable environment tanpa nilainya, route atau flow yang akan dicek, satu jenis log yang akan dibaca jika gagal, dan satu risiko atau follow-up. Jangan tulis credential, token, atau data user.

Tulis draft dulu sebelum menandai writing practice selesai.

Draft kosong

0/80 karakter

Checklist panduan

Checklist ini hanya panduan. Kamu tidak harus mencentang semuanya.

Blok ini wajib untuk menyelesaikan lesson.

Documentation Bridge

Wajib

Gunakan dokumentasi sebagai playbook production awal

Baca source resmi ini saat melakukan deployment pertama. Fokus pada alur yang sedang kamu jalankan; jangan memperluas scope ke custom CI/CD, Docker, observability lanjutan, atau strategi multi-region pada tahap ini.

Vercel Docs

Git integrations

Fokus baca

  • import Git repository ke Vercel
  • Preview Deployment dari branch non-production
  • Production Deployment dari production branch

Abaikan dulu

  • custom Git provider automation
  • monorepo workflow lanjutan
Buka dokumentasi

Vercel Docs

Environment Variables

Fokus baca

  • scope Preview dan Production
  • perubahan variable hanya berlaku pada deployment baru
  • nama variable yang diperlukan app tanpa membagikan value

Abaikan dulu

  • team-wide variable management
  • CLI automation
Buka dokumentasi

Vercel Docs

Logs

Fokus baca

  • perbedaan build log dan runtime log
  • mencari deployment dan route yang relevan
  • membaca error tanpa memaparkan credential

Abaikan dulu

  • log drains
  • enterprise audit logs
  • advanced observability
Buka dokumentasi

Next.js Docs

Deploying

Fokus baca

  • npm run build sebelum deploy
  • script build dan start pada project Next.js
  • jenis deployment yang didukung Next.js

Abaikan dulu

  • Docker deployment
  • adapter implementation
  • custom infrastructure
Buka dokumentasi

Next.js Docs

Caching and Revalidating

Fokus baca

  • fetch caching yang dipilih secara eksplisit
  • revalidation sebagai keputusan freshness
  • perbedaan data public dan user-specific

Abaikan dulu

  • advanced cache invalidation
  • cache handler custom
  • cache API yang belum dibutuhkan
Buka dokumentasi

Aksi setelah membaca

Buat section Deployment di README Local Next.js App: tulis production branch, route yang wajib dicek, nama variable menurut scope, lokasi membaca build/runtime log, dan langkah rollback atau follow-up tim. Jangan masukkan value credential ke README.

Bagian ini memengaruhi progres lesson.

Ringkasan

Wajib
  • Ready untuk production berarti dapat menjelaskan dan menjalankan deploy workflow, bukan hanya melihat status Ready.
  • Configuration dipisahkan menurut environment dan boundary browser/server agar credential tidak bocor.
  • Build log, runtime log, auth callback, dan caching adalah bukti yang perlu dibedakan saat mendiagnosis error.
  • Self-review lokal dan production note harus didasarkan pada pengujian nyata, bukan completion otomatis.
  • Berikutnya, kamu dapat memperdalam Forms, Validation, and Data Fetching untuk membuat flow data production lebih kuat dan teruji.

Bagian ini memengaruhi progres lesson.

Langkah berikutnya

Selesaikan bagian wajib checkpoint ini

Lanjutkan blok wajib berikutnya: Checkpoint: deployment adalah workflow yang dapat dijelaskan ulang.

Memuat progresReview module