FRONT-END ASSIGNMENT
untuk asset yang dibutuhkan pengerjaan test dapat didownload dari here
Hal paling penting adalah struktur dan bagaimana penerapan clean code dan bagaimana code dapat dimaintain. Gunakan javascript dan css untuk menyelesaikan soal berikut. Waktu pengerjaan maksimal 4 jam setelah test diterima, mohon tidak menyebar luaskan soal.
1. Buatlah Button semirip mungkin dengan design. Tambahkan fungsi hover pada button sesuai pada gambar kanan (Poin 0-10)
2. Buatlah layout Card semirip mungkin dengan design. Untuk width 152px, dan height 192px. Ketika ditekan tambahkan function untuk menduplikat Card ke kanan setelah 3 detik. Button ini dapat ditekan terus menerus untuk menduplikat Card, pada 1 baris maksimum memiliki 4 card. Margin antar card adalah 32px, dan posisi Card selalu di tengah halaman. Untuk lebih jelasnya sesuaikan dengan design diatas.(Poin 0-20)
3. Buatlah potongan design tersebut semirip mungkin.(poin 0-10)
4. Anda akan diminta untuk menampilkan daftar film populer, yang dapat di search dan dapat difilter sesuai dengan genre yang dipilih sesuai dengan design yang diberikan , untuk API anda dapat mengakses dari MovieDB, Anda dapat mengakses API MovieDB anda perlu mendaftar untuk mendapatkan api_key jika belum memiliki akun. (poin 0-25)
untuk API List Movie Favorite: https://api.themoviedb.org/3/discover/movie?api_key=***&language=en-US&sort_by=popularity.desc&include_adult=false&include_video=false
untuk API List Genre
https://api.themoviedb.org/3/genre/movie/list?api_key=*****
5. Ketika Tombol i disebelah sinopsis ditekan maka akan memunculkan modal yang berisi sinopsis dari film tersebut, ketika tombol tutup ditekan maka modal akan tertutup.(poin 0-15)
6. Ketika Genre dipilih, maka isi table akan menampilkan sesuai dengan genre yang dipilih.(poin 0-15)
7. Tambahkan satu tombol lagi jenis apapun ketika ditekan maka search dan genre akan menghilang, dan ketika ditekan lagi maka kolom search dan genre akan tampil lagi.(poin 0-5)