Lewati ke konten
  • Jenjang 2 · Climb Up Skills
  • Kredensial terverifikasi

Aplikasi Frontend dengan React dan TypeScript

Bangun aplikasi React yang mengambil data dari API, mengelola state, memvalidasi formulir, dan punya tes. Hasilnya aplikasi yang bisa Anda tunjukkan dan jelaskan keputusan teknisnya, dinilai reviewer bernama.

Solvera AI & Technology AcademyBahasa Indonesia · terbit 14 Oktober 2026

Ringkasan

Untuk siapa • Lulusan kelas Dasar Pemrograman Web atau developer yang sudah lancar JavaScript dasar. • Developer backend yang perlu menguasai frontend modern. • Desainer yang ingin mewujudkan rancangannya sendiri menjadi aplikasi. Yang akan Anda bangun Aplikasi katalog di atas API publik pilihan Anda (buku, film, atau produk): daftar dengan pencarian dan filter, halaman rincian, daftar favorit, dan formulir yang divalidasi, lengkap dengan tes dan terbit di internet. Setelah kelas ini Anda mampu • Menyusun antarmuka dari komponen React dengan props, state, dan hooks. • Memakai TypeScript untuk menangkap kesalahan sebelum aplikasi dijalankan. • Mengambil data dari API dengan keadaan loading, galat, dan kosong yang tertangani. • Membangun formulir dengan validasi yang membantu pengguna. • Menguji komponen dan menerbitkan aplikasi ke layanan hosting. Prasyarat • Lancar JavaScript dasar: fungsi, array, objek, dan fetch. • Terbiasa memakai Git untuk commit dan push. Cara belajar Belajar mandiri sesuai waktu Anda, sekitar 40 jam termasuk mengerjakan karya. Tidak ada jadwal sesi langsung. Karya dikerjakan dalam empat tahap (kerangka, draf, revisi, final), dan setiap tahap direview oleh reviewer bernama yang memberi umpan balik tertulis. Rubrik penilaian bisa Anda baca sebelum mulai mengerjakan. Kredensial Lulus tahap final dengan skor berbobot minimal 70% akan memberi Anda kredensial Terverifikasi Exelern dengan halaman verifikasi publik. Halaman itu memuat karya Anda, nama reviewer, dan rubrik yang dipakai, sehingga pemberi kerja bisa memeriksanya sendiri.

Yang Anda dapatkan

  • 9 materi yang bisa dibuka kapan saja
  • Karya 4 tahap, tiap tahap dibalas reviewer bernama
  • Kredensial yang bisa diperiksa siapa pun tanpa login, bila karya Anda lulus

Kelas ini berada di Jenjang 2 · Climb Up Skills: karyanya mengandaikan Anda pernah membuat sesuatu di bidang ini.

Karya & rubrik

Kelas ini ditutup dengan karya yang dinilai reviewer bernama memakai rubrik di bawah — rubrik yang sama persis dengan yang dipakai menilai pekerjaan Anda nanti.

  1. 1Kerangka
  2. 2Draf
  3. 3Revisi
  4. 4Final
  1. Aplikasi katalog React dengan pencarian, filter, formulir tervalidasi, dan tes

    Pilih satu API publik yang datanya menarik bagi Anda. Bangun aplikasi katalog dengan React dan TypeScript: daftar, pencarian, filter, halaman rincian, favorit yang tersimpan, dan satu formulir (misalnya ulasan atau permintaan) dengan validasi. Tulis minimal 8 tes. Tahapan pengerjaan • Kerangka: API yang dipilih beserta alasannya, peta halaman, dan rancangan pohon komponen. • Draf: Alur utama berjalan dengan data nyata dari API: daftar, pencarian, dan rincian. • Revisi: Keadaan loading, galat, dan kosong tertangani; aksesibilitas diperbaiki; tes ditambahkan sesuai umpan balik reviewer. • Final: Aplikasi terbit, README menjelaskan keputusan teknis, dan laporan Lighthouse terlampir.

    Yang diserahkan: Tautan aplikasi yang sudah terbit, tautan repositori dengan README berisi keputusan teknis (struktur komponen, pengelolaan state, alasan library), hasil tes, dan laporan Lighthouse.

    Kriteria penilaian

    Lulus mulai 70%
    • Fungsi dan penanganan keadaanbobot 30% · skor 0–4

      Seluruh fitur berjalan, dan keadaan loading, galat, serta kosong ditangani dengan jelas bagi pengguna.

    • Struktur komponen dan statebobot 25% · skor 0–4

      Komponen terpecah masuk akal, state berada di tempat yang tepat, dan tipe TypeScript dipakai dengan benar.

    • Pengujianbobot 20% · skor 0–4

      Minimal 8 tes yang menguji perilaku penting, bukan sekadar menambah jumlah.

    • Aksesibilitas dan responsifbobot 15% · skor 0–4

      Bisa dipakai dengan papan ketik, kontras cukup, dan tampilan layak di ponsel.

    • Keputusan teknis tertulisbobot 10% · skor 0–4

      README menjelaskan pilihan dan trade-off dengan jujur.

Lihat bagaimana kredensial diperiksa

Silabus

Isi materi terbuka setelah Anda terdaftar.

  1. 1Komponen, props, dan JSXTeks
  2. 2TypeScript secukupnya untuk ReactTeks
  3. 3State dan hooksTeks
  4. 4Mengambil data dari API: loading, galat, dan cacheTeks
  5. 5Routing dan tata letak halamanTeks
  6. 6Formulir dan validasiTeks
  7. 7Styling dengan Tailwind CSS dan aksesibilitasTeks
  8. 8Menguji komponenTeks
  9. 9Build, deploy, dan refactor berbantuan AI yang amanTeks

Pengajar

Solvera AI & Technology Academy terverifikasi

Tim pengajar Solvera untuk kelas teknologi, AI, data, dan keuangan di Exelern. Setiap kelas ditutup dengan karya nyata yang dinilai reviewer memakai rubrik terbuka, bukan kuis pilihan ganda.

  • AI generatif
  • Rekayasa perangkat lunak
  • Data dan analitik
  • Cloud dan keamanan siber
  • Keuangan dan akuntansi

Pertanyaan yang sering diajukan

Bagaimana karya saya dinilai?
Reviewer bernama memberi skor per kriteria memakai rubrik di bagian Karya & rubrik — rubrik yang sama dengan yang dipakai menilai Anda nanti. Anda lulus bila skor berbobotnya mencapai 70%. Kredensial terbit hanya bila karya final Anda lulus, dan memuat karya, rubrik, serta nama penilainya.
Apakah ada tenggat pengerjaan?
Tidak. Kelas mandiri dimulai kapan saja. Karya dikerjakan bertahap — kerangka, draf, revisi, final — dan setiap tahap dibalas reviewer sebelum Anda lanjut.
Bisakah kantor saya membiayai kelas ini?
Bisa. Panduan klaim biaya ke kantor memuat templat email ke atasan dan bukti yang biasanya diminta: bukti pembayaran dan tautan kredensial yang bisa diperiksa tanpa login.
Apa beda kredensial Exelern dengan sertifikat kehadiran?
Kredensial hanya terbit dari karya yang lulus review, bukan dari jam tayang. Siapa pun bisa memeriksa keabsahannya di halaman verifikasi, lengkap dengan karya, rubrik, dan penilainya.

Untuk tim

Kelas yang sama untuk satu orang, satu tim, atau satu angkatan khusus organisasi Anda.

  • Klaim ke kantor

    Templat email ke atasan dan bukti yang biasanya diminta bagian keuangan.

    Buka panduan
  • Daftarkan tim

    Beberapa orang di kelas ini, dengan kredensial yang bisa Anda periksa satu per satu.

    Ceritakan kebutuhan tim
  • Angkatan privat

    Satu angkatan khusus organisasi Anda, dengan karya yang disesuaikan pekerjaan tim.

    Ajukan angkatan privat

Kelas terkait