Skip to content

Dicoding submission project for "Menjadi React Web Developer Expert"

Notifications You must be signed in to change notification settings

basiooo/DiskusiYUK

Repository files navigation

Kriteria

  • 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

Saran

  • 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.

Kriteria

  • 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

  • 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.

Menjalankan Aplikasi

  • Dengan run_assist.sh (docker)

    ./run_assist.sh --run-dev
  • Tanpa docker

    npm install
    npm run dev

Build Aplikasi

  • Dengan run_assist.sh (docker)

    ./run_assist.sh --run-build
  • Tanpa docker

    npm install
    npm run build

Tests

  • Dengan run_assist.sh (docker)

    ./run_assist.sh --run-ci-test
  • Tanpa docker

    npm install
    npm run ci:test

Releases

No releases published

Packages

No packages published

Languages