FluentStack

Uji Kompetensi Practical Type Design

Mode tersedia: dark, light, paper
MasukDaftar
Intermediate · Level 6: TypeScriptIntermediate75 menitBahasa Indonesia

Uji Kompetensi Practical Type Design

Checkpoint kesiapan untuk union, narrowing, discriminated union, generics, utility types, dan type design yang aman.

StatusMemuat progres
ReadinessMemuat...

...

Memuat progres

Menyiapkan langkah berikutnya

Yang dicek

  • Mengecek pemahaman practical type design
  • Memodelkan UI state yang aman
  • Menjelaskan kenapa type design membuat invalid state lebih sulit terjadi
TypeScriptType DesignAssessment

Isi lesson

6 blok
  1. 1.
    Checkpoint: apakah type kamu membantu desain UI?Belum selesaiWajib
  2. 2.
    QuizBelum selesaiWajib
  3. 3.
    Coding practiceBelum selesaiWajib
  4. 4.
    Writing practiceBelum selesaiWajib
  5. 5.
    Docs bridge practical type designBelum selesaiWajib
  6. 6.
    RingkasanBelum selesaiWajib

Checkpoint: apakah type kamu membantu desain UI?

Wajib

Uji Kompetensi ini mengecek apakah TypeScript kamu sudah mulai membantu desain data, bukan hanya memberi annotation. Kamu akan memakai union, narrowing, discriminated union, generic result type, dan utility types dalam satu konteks frontend.

Targetnya sederhana: type membuat state yang salah lebih sulit ditulis, dan membuat branch UI lebih mudah dibaca.

Bagian ini memengaruhi progres lesson.

Quiz

Wajib

Uji Kompetensi Practical Type Design

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 5

Target lulus: 70

Type apa yang paling tepat untuk status yang hanya boleh `loading`, `success`, atau `error`?

Coding practice

WajibDibuka di workspace khusus

Model practical UI state

Checkpoint untuk union, narrowing, discriminated union, generic result, dan utility type dasar.

Tujuan awal: Fokus di tab TS.

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

Tombol selesai aktif setelah semua validasi wajib lolos.

7 cek otomatis5 checklist
Belum selesaiBuka practice

Writing practice

Wajib

Latihan menulis

Tulis penjelasan singkat tentang type design checkpoint kamu. Jelaskan state apa yang dimodelkan, branch mana yang aman, dan invalid state apa yang dicegah. Gunakan format: - State yang dimodelkan: - Branch aman: - Invalid state yang dicegah: - Kenapa lebih aman dari object besar dengan banyak optional field:

Tulis draft dulu sebelum menandai writing practice selesai.

Draft kosong

0/180 karakter

Checklist panduan

Checklist ini hanya panduan. Kamu tidak harus mencentang semuanya.

Blok ini wajib untuk menyelesaikan lesson.

Documentation Bridge

Wajib

Docs bridge practical type design

Baca bagian resmi TypeScript yang mendukung module ini. Fokus pada contoh yang dekat dengan kode aplikasi, bukan type puzzle.

TypeScript Handbook

Union Types

Fokus baca

  • union type
  • discriminating unions
  • status field sebagai pembeda

Abaikan dulu

  • intersection type lanjutan
  • exhaustiveness checking detail
  • advanced union patterns
Buka dokumentasi

TypeScript Handbook

Narrowing

Fokus baca

  • typeof narrowing
  • truthiness checks
  • control flow analysis
  • narrowing lewat equality checks

Abaikan dulu

  • type predicates
  • assertion functions
  • advanced control flow
Buka dokumentasi

TypeScript Handbook

Generics

Fokus baca

  • generic type parameter
  • generic function dasar
  • reusable type tanpa kehilangan informasi data

Abaikan dulu

  • generic constraints lanjutan
  • generic classes
  • keyof patterns
Buka dokumentasi

TypeScript Handbook

Utility Types

Fokus baca

  • Pick
  • Omit
  • Partial
  • Record

Abaikan dulu

  • Awaited
  • ConstructorParameters
  • ThisParameterType
  • utility types yang jarang dipakai di awal
Buka dokumentasi

Aksi setelah membaca

Buka satu contoh discriminated union di TypeScript docs, lalu bandingkan dengan UI state checkpoint kamu.

Bagian ini memengaruhi progres lesson.

Ringkasan

Wajib
  • Union type membatasi value ke pilihan yang valid.
  • Narrowing memberi bukti sebelum value dipakai.
  • Discriminated union membuat UI state lebih aman.
  • Generics dan utility types membantu reuse saat niatnya jelas.
  • Berikutnya, Typed Frontend Boundaries akan memakai type design ini untuk API responses, form data, dan data siap komponen.

Bagian ini memengaruhi progres lesson.

Langkah berikutnya

Selesaikan bagian wajib checkpoint ini

Lanjutkan blok wajib berikutnya: Checkpoint: apakah type kamu membantu desain UI?.