Menjadi React Web Developer Expert | Submission 2
- Kriteria Utama 1: Automation Testing
- Buat minimal dua pengujian fungsi Reducer.
- Buat minimal dua pengujian Thunk Function.
- Buat minimal dua pengujian React Components.
- Buat minimal satu pengujian End-to-End untuk alur login aplikasi.
- Wajib menulis skenario pengujian pada masing-masing berkas pengujian.
- Pengujian dapat dijalankan dengan perintah npm test dan npm run e2e.
- Kriteria Utama 2: Deployment Aplikasi
- Deploy aplikasi dengan menggunakan teknik CI/CD.
- Continuous Integration diterapkan dengan GitHub Actions.
- Continuous Deployment diterapkan dengan Vercel.
- Memproteksi branch master.
- Melampirkan URL Vercel aplikasi Anda pada catatan submission.
- Melampirkan screenshot sebagai bukti telah menerapkan konfigurasi CI/CD dan branch protection dengan benar. Screenshot yang perlu dilampirkan:
- Kriteria Utama 3: Memanfaatkan Salah Satu Ecosystem React
- Kriteria Utama 4: Mempertahankan Kriteria Submission Sebelumnya
- Terdapat lebih dari tiga pengujian fungsi reducer.
- Terdapat lebih dari tiga pengujian fungsi thunks.
- Terdapat lebih dari tiga pengujian pada React Component.
- Memiliki minimal 2 stories komponen.
- Menerapkan saran pada submission sebelumnya seperti:
- fitur votes pada thread dan komentar;
- menampilkan leaderboard;
- filter daftar thread berdasarkan kategori
- Saran lainnya.:
- Aplikasi yang Anda bangun mudah untuk digunakan. Contohnya, tidak membuat pengguna bingung dan menggunakan warna yang mudah dalam membaca teks.
- menampilkan leaderboard;
- Aplikasi yang Anda bangun memiliki tampilkan yang menarik.
Menjadi React Web Developer Expert | Submission 1
- Kriteria Utama 1: Fungsionalitas Aplikasi
- Terdapat cara untuk mendaftar akun.
- Terdapat cara untuk login akun.
- Menampilkan daftar thread.
- Ketika item thread dipilih, menampilkan detail thread beserta komentar di dalamnya.
- Pengguna dapat membuat thread.
- Pengguna dapat membuat komentar di dalam sebuah thread.
- Menampilkan Loading bar ketika memuat data dari API.
- Kriteria Utama 2: Bugs Highlighting
- Menggunakan ESLint pada source code aplikasi. Indikasinya adalah terdapat berkas konfigurasi ESLint pada proyek.
- Menerapkan salah satu Code Convention berikut.
- AirBnB JavaScript Style Guide.
- Google JavaScript Style Guide.
- StandardJS Style Guide.
- Tidak ada indikasi error yang ditampilkan ESLint.
- Menggunakan React Strict Mode.
- Kriteria Utama 3: Arsitektur Aplikasi
- Hampir seluruh state aplikasi (terutama yang bersumber dari API) disimpan pada Redux Store. Form input atau controlled component diperbolehkan untuk mengelola state-nya sendiri.
- Tidak ada pemanggilan REST API yang dilakukan di dalam lifecycle atau efek pada komponen.
- Memisahkan kode UI dengan State di folder yang terpisah.
- React component bersifat modular dan reusable.
- Saran 1: Fitur Votes pada Thread dan Komentar
- Menyediakan tombol yang dapat digunakan untuk votes pada thread dan komentar.
- Menampilkan indikasi pada tombol bila pengguna sudah mem-vote thread dan komentar. Contohnya, mengubah warna tombol dari abu-abu menjadi merah bila pengguna sudah up-vote/down-vote.
- Mengedepankan User Experience dengan menerapkan Optimistically Apply Actions.
- Menampilkan jumlah votes pada thread dan komentar.
- Saran 2: Menampilkan Leaderboard
- Terdapat halaman untuk menampilkan leaderboard.
- Setiap item leaderboard, harus menampilkan informasi berikut ini.
- Nama pengguna.
- Avatar pengguna.
- Score.
- Saran 3: Filter Daftar Thread Berdasarkan Kategori
- Terdapat fitur untuk mem-filter item thread yang ditampilkan pada halaman daftar threads.
-
Dengan
run_assist.sh
(docker)./run_assist.sh --run-dev
-
Tanpa docker
npm install npm run dev
-
Dengan
run_assist.sh
(docker)./run_assist.sh --run-build
-
Tanpa docker
npm install npm run build
-
Dengan
run_assist.sh
(docker)./run_assist.sh --run-ci-test
-
Tanpa docker
npm install npm run ci:test