Page 31 - 4817070273 - Aida aida
P. 31

24




                        Pada gambar 3.9 dapat dilihat bahwa dalam Modal react-bootstrap menampilkan
                        beberapa  komponen  didalamnya  yaitu  Input  untuk  search  member,  data  list

                        member, dan juga button Add yang di tempatkan pada masing-masing data member.


                        Jika  sebelumnya  adalah  tampilan  untuk  Add  New  Member  di  bawah  ini  adalah
                        tampilan  dari  fitur  List  Member,  dimana  menampilkan  list  para  member  yang

                        bertanggung jawab dalam pengerjaaan project Shopify Design Language System.

                        Pembuatan  Fitur  List  Member  ini  sama  seperti  Add  New  Member  dimana
                        menggunakan Modal react-bootstrap untuk menampilkan data list para member,

                        yang  membedakan  dari  fitur  ini  adalah  ada  button  yang  berfungsi  untuk

                        menambahkan  member  baru  dalam  list  member.  Serta  bukan  button  Add  yang
                        ditempatkan pada masing-masing data member melainkan button dengan tanda ‘x’

                        yang berfungsi untuk delete atau menghapus member dalam list member. Berikut
                        merupakan tampilan dari List Member.
































                                              Gambar 3.10 Tampilan Fitur List Member

                        Selain tampilan user interface pada bagian navbar, penulis juga membuat tampilan
                        untuk menampilkan list task yang berjalan pada project Shopify Design Language

                        System. Didalam list task tersebut, menampilkan data-data berupa nama dari Taks,
                        status  pengerjaan,  tanggal  dateline,  dan  member  yang  bertanggug  jawab  dalam

                        menyelesaikan task tersebut.
                              Jurusan Teknik Informatika dan Komputer - Politeknik Negeri Jakarta
   26   27   28   29   30   31   32   33   34   35   36