| Nama | : | Agung Hidayat |
| Kelas | : | VueJS |
| Video Demo | : | Link |
| Link Website | : | Link |
Desain yang saya buat sangat sederhana, sedikit warna dan tidak memiliki pola atau gambar, dengan harapan supaya mudah digunakan oleh orang awam terutama orang awan usia 40-50 tahun. Desain sekilas mirip dengan google form namun saya modifikasi dibeberapa bagian dan agar sesuai dengan panduan dari Jabar Design System yang telah di berikan di materi.
Saya menggunakan jenis kolom input dengan posisi label berada diatas dan berukuran lebih kecil daripada Kolom Input, yang bertujuan supaya pengguna lebih mudah melihat mana kolom untuk diisi dan mana label.
Dalam mempermudah pengisian sama menggunakan placeholder yang berisikan contoh atau keterangan apa yang harus diisikan atau apa yang harus dilakukan pengguna untuk mengisi kolom tersebut.
Dalam memvalidasi form saya menggunakan validasi langsung dan tidak langsung :
- Validasi langsung, validasi langsung yang mana ketika data yang diinput kurang tepat maka kolom akan merespon dan memberitahukan apa kesalahannya dibawah kolom input yang sedang aktif.
- Validasti tidak langsung, validasi ini saya gunakan ketika pengguna menekan tombol simpan. Sistem akan melakukan validasi terhadap seluruh kolom input apakah sudah sesuai atau belum dan jika salah akan menampilkan informasi kesalahannya dibawah kolom input yang tidak sesuai.
- Tipe Dialog, saya menggunakan jenis ini untuk menampilkan informasi gagal menyimpan. Sebab, dengan jenis notifikasi ini akan memudahkan pengguna untuk menekan tombol simpan kembali.
- Tipe Pindah Halaman, saya menggunakan tipe ini pada saat data berhasil disimpan. Sebab, dengan begitu pengguna akan fokus dan mengetahui bahwa data yang tadi diinput telah disimpan tanpa terganggu dengan tampilan lainnya.
npm install
npm run serve
npm run build
npm run lint