Hak cipta dan penggunaan kembali:
Lisensi ini mengizinkan setiap orang untuk menggubah, memperbaiki, dan membuat ciptaan turunan bukan untuk kepentingan komersial, selama anda mencantumkan nama penulis dan melisensikan ciptaan turunan dengan syarat yang serupa dengan ciptaan asli.
Copyright and reuse:
This license lets you remix, tweak, and build upon work
non-commercially, as long as you credit the origin creator
and license it on your new creations under the identical
terms.
BAB III
PELAKSANAAN KERJA MAGANG
3.1 Kedudukan dan Koordinasi
Selama pelaksanaan kerja magang di PT THJ Dinamika Indonesia sebagai Staff Informasi Teknologi dan Pengembangan, tugas yang diberikan adalah membangun sebuah website company profile dan menambahkan fitur booking. Kerja magang dikoordinasi oleh Bapak Chandra Manuel selaku Manager Informasi Teknologi dan Pengembangan yang berperan sebagai pembimbing serta memberikan arahan selama proses kerja berlangsung dan beberapa kali melakukan meeting bersama Direktur PT THJ Dinamika Indonesia untuk melaporkan proses proyek yang sedang dikerjakan serta memberikan revisi terhadap proyek tersebut.
3.2 Tugas yang Dilakukan
Realiasasi kerja magang ditunjukkan oleh Tabel 3.1 Tabel 3.1 Realisasi Kerja Magang Minggu Kegiatan
1 Briefing magang dan mencari referensi untuk pembuatan aplikasi website.
2 Diskusi dengan coordinator tentang pengerjaan website yang perlu dikembangkan.
3 Mengubah desain laman front end dan fungsionalitas lainnya.
4 Melakukan meeting untuk perkembangan back end serta melakukan revisi.
5 Melakukan input data baru ke database 6 Menambahkan fitur booking.
7 Melakukan testing dan debugging pada fitur yang ditambahkan.
8 Melakukan revisi yang diberikan serta membuat laporan akhir aplikasi untuk diberikan ke perusahaan.
3.3 Uraian Pelaksanaan Kerja Magang
Pelaksanaan kerja magang diuraikan menjadi 4 bagian, yaitu analisis requirement, proses pelaksanaan, kendala yang ditemukan, dan solusi atas kendala yang ditemukan.
3.3.1 Analisis Requirement
Analisis requirement dilakukan untuk menentukan kebutuhan yang diperlukan oleh sistem sehingga memenuhi permintaan owner. Requirement dari aplikasi ini adalah sebagai berikut.
1. Admin dapat melakukan proses create, read, update, dan delete pada laman back end.
2. User dapat melihat daftar dan spesifikasi produk yang tersedia pada perusahaan tersebut.
3. User dapat melakukan booking produk pada laman produk.
4. Admin dapat melihat list booking pada laman back end.
3.3.2 Proses Pelaksanaan
Pelaksanaan kerja magang terbagi menjadi dua tahap, yaitu perancangan dan implementasi. Aplikasi ini dibangun dengan framework Codeigniter dan menggunakan basis data MySQL.
A. Perancangan
Perancangan aplikasi pada penelitian ini meliputi sitemap aplikasi yang berfungsi untuk menjabarkan gambaran umum dari aplikasi, flowchart yang berfungsi untuk menggambarkan alur proses yang berjalan pada aplikasi, Data Flow Diagram
yang berfungsi untuk menggambarkan aliran data dari suatu proses ke proses yang lain pada aplikasi, Entity Relationship Diagram dan database schema yang berfungsi untuk menggambarkan hubungan antara tabel pada basis data yang digunakan oleh aplikasi, struktur tabel berfungsi untuk menggambarkan secara detail struktur dari setiap tabel pada basis data, dan rancangan antarmuka yang berfungsi untuk menggambarkan tampilan aplikasi secara garis besar.
A.1 Data Flow Diagram
Data Flow Diagram digunakan untuk menjelaskan setiap alur data yang terjadi dalam sistem.
Gambar 3.1 Context Diagram
Gambar 3.1 adalah context diagram dari aplikasi. Terdapat 3 entitas utama, yaitu admin, user, dan owner. Context diagram menjabarkan seluruh data yang berinteraksi dengan aplikasi.
Gambar 3.2 Data Flow Diagram Level 1 Diagram level 1 memiliki 5 buah proses yaitu sebagai berikut.
1. Proses login admin yang berfungsi untuk menggambarkan aliran data yang terjadi ketika admin ingin melakukan login ke aplikasi.
2. Proses pengolahan data yang berfungsi untuk melakukan proses create, read,
3. Akses menu beranda yang berfungsi untuk menggambarkan aliran data yang terjadi ketika user mengakses menu beranda pada halaman front end aplikasi.
4. Akses menu daftar produk yang berfungsi untuk menggambarkan aliran data yang terjadi ketika user mengakses menu daftar produk pada halaman front end aplikasi.
5. Akses menu kontak kami yang berfungsi untuk menggambarkan aliran data yang terjadi ketika user mengakses menu kontak kami pada halaman front end aplikasi.
Gambar 3.3 Data Flow Diagram Level 2 Proses Pengolahan Data
Gambar 3.3 adalah data flow diagram untuk proses pengolahan data pada back- end. Terdapat 5 menu yang menggambarkan 4 tabel data yang dapat admin. 5 menu tersebut terdiri dari pencarian data product, data product, data jenis product, gambar product, dan data contact.
A.2 Sitemap
Sitemap adalah salah satu alat bantu untuk pengenalan peta situs didalam website.
Gambar 3.4 Sitemap Front-End
Gambar 3.4 adalah gambar sitemap pada bagian front-end. Terdapat 3 menu utama pada bagian beranda yaitu produk, tentang kami, dan kontak kami.
Gambar 3.5 Sitemap Back-End
Gambar 3.5 merupakan gambar sitemap pada bagian back-end. Dimulai dari login form, setelah login akan masuk ke bagian dashboard. Lalu terdapat 5 menu pada bagian dashboard yaitu product, jenis product, list booking, contacts, dan image slider.
A.3 Flowchart
Flowchart merupakan diagram yang menggambarkan langkah-langkah istruksi dari suatu sistem. Berikut adalah flowchart dari website company profile PT THJ Dinamika Indonesia.
Gambar 3.6 Flowchart Login Admin
Gambar 3.6 merupakan flowchart login admin yang menjelaskan langkah- langkah ketika admin melakukan login ke sistem. Proses diawali dengan melakukan input data berupa username dan password ke sistem, kemudian username dan password tersebut akan dicocokkan dengan data user yang terdapat pada basis data.
Apabila username dan password tersebut sesuai, maka login berhasil dan masuk pada halaman read dashboard, apabila tidak sesuai, diminta memasukkan input username dan password kembali.
Gambar 3.7 Flowchart Read Product
Gambar 3.7 merupakan flowchart halaman read product dimana admin dapat melihat data produk yang diambil dari basis data. Pada halaman ini, dapat dilakukan beberapa proses pengolahan data produk seperti tambah produk, edit produk, delete produk, dan tambah gambar produk. Untuk menghapus produk, admin hanya perlu menekan tombol delete pada produk yang ingin dihapus. Untuk menambahkan produk, admin hanya perlu menekan tombol add. Untuk melakukan edit pada produk, admin hanya perlu menekan tombol edit pada produk yang ingin diubah.
Gambar 3.8 Flowchart Halaman Add Product
Gambar 3.8 merupakan flowchart halaman add product dimana admin dapat menambahkan produk baru. Admin diharuskan mengisi form data produk baru dan menekan tombol submit untuk menambahkan produk baru pada basis data.
Gambar 3.9 Flowchart Halaman Edit Product
Gambar 3.9 merupakan flowchart halaman edit product dimana admin dapat melakukan update data produk pada basis data. Aplikasi akan menampilkan form yang berisi data lama terlebih dahulu, lalu admin dapat mengubah data tersebut dan menekan tombol submit untuk melakukan proses update data tersebut pada basis data.
Gambar 3.10 Flowchart Halaman Add Gambar
Gambar 3.10 merupakan flowchart halaman add gambar produk dimana admin dapat melihat dan menambahkan data gambar produk. Admin diharuskan mengisi form data gambar produk dan menekan tombol submit untuk menambahkan gambar produk pada basis data.
Gambar 3.11 Flowchart Halaman Read Jenis Product
Gambar 3.11 merupakan flowchart halaman Read jenis produk dimana admin dapat melihat data jenis produk yang diambil dari basis data. Pada halaman ini, dapat dilakukan 2 buah proses seperti mengubah menghapus jenis produk dan edit jenis produk. Untuk menghapus, admin hanya perlu menekan tombol delete pada jenis produk yang ingin diubah. Untuk melakukan edit pada jenis produk, admin hanya perlu menekan tombol edit pada jenis produk yang ingin diubah.
Gambar 3.12 Flowchart Halaman Edit Jenis Product
Gambar 3.12 merupakan flowchart halaman edit jenis product dimana admin dapat melakukan update data jenis produk pada basis data. Aplikasi akan menampilkan form yang berisis data lama terlebih dahulu, lalu admin dapat mengubah data tersebut dan menekan tombol submit untuk melakukan proses update data tersebut pada basis data.
Gambar 3.13 Flowchart Halaman Contact
Gambar 3.13 merupakan flowchart halaman contact dimana admin dapat melihat data contact yang diambil dari basis data.
Gambar 3.14 Flowchart Halaman Booking
Gambar 3.14 merupakan flowchart halaman booking dimana user dapat melakukan booking produk.
A.4 Entity Relationship Diagram
Gambar 3.15 Entity Relationship Diagram Aplikasi
Gambar 3.15 merupakan entity relationship diagram dari aplikasi yang berfungsi untuk mengambarkan entitas-entitas yang memiliki hubungan satu dengan yang lain. Terdapat 6 buah entitas yang berhubungan yaitu entitas product dengan asphalt mixing plant, entitas product dengan batching plant, entitas product dengan stone crusher, entitas product dengan accessories, dan entitas product dengan gambar.
A.5 Database Schema
Gambar 3.16 Database Schema Aplikasi
Gambar 3.16 merupakan database schema yang berfungsi untuk menggambarkan hubungan antara tabel-tabel yang terdapat pada basis data aplikasi.
Terdapat 6 buah tabel yang sudah ada dan saling berhubungan, yaitu tbl_product, tbl_amp, tbl_bp, tbl_sc, tbl_aksesoris, dan tbl_gambar. Kemudian terdapat 3 buah tabel yang tidak memiliki hubungan, yaitu tbl_users, tbl_contact, dan tbl_book.
A.6 Struktur Tabel
1. Tabel tbl_product
Tabel 3.2 Struktur Tabel tbl_product
Nama Field Tipe Data Constraint Keterangan id_product int(11) Primary Key Kode unik dari produk
nama_product_id varchar 30 Nama produk dalam
bahasa Indonesia
kemampuan_kerja_id text Kemampuan kerja produk
dalam bahasa Indonesia
keterangan_id text Keterangan produk dalam
bahasa Indonesia
gambar_utama varchar(250) Gambar utama untuk
produk
nama_product_en varchar(30) Nama produk dalam
bahasa inggris
kemampuan_kerja_en text Kemampuan kerja produk
dalam bahasa inggris
keterangan_en text Keterangan produk dalam
bahasa inggris
Tabel 3.2 merupakan struktur dari tabel tbl_product yang berfungsi untuk menyimpan data-data produk.
2. Tabel tbl_contact
Tabel 3.3 Struktur Tabel tbl_contact
Nama Field Tipe Data Constraint Keterangan id_contact int(11) Primary Key Kode unik untuk contact
nama varchar(200) Nama pengirim pesan
email varchar(200) Email pengirim pesan
pesan text Pesan yang dikirimkan
waktu timestamp Waktu pesan dikirim
Tabel 3.3 merupakan struktur dari tabel tbl_contact yang berfungsi untuk menyimpan data-data pesan yang dikirim ke admin.
3. Tabel tbl_amp
Tabel 3.4 Struktur Tabel tbl_amp
Nama Field Tipe Data Constraint Keterangan
model_amp Varchar(10) Primary Key Kode unik dari produk Asphalt Mixing Plant
id_product Int(11) Foreign Key Kode unik dari produk
kapasitas int(11) Kapasitas dari produk Asphalt
Mixing Plant
kekuatan_utama int(11) Kekuatan utama dari produk Asphalt Mixing Plant
kapasitas_mixer int(11) Kapasitas mixer dari produk Asphalt Mixing Plant
metode_dedusting varchar(20) Metode dedusting dari produk Asphalt Mixing Plant
akurasi text Akurasi dari produk Asphalt
Mixing Plant
pemanas_burner text Pemanas burner dari produk
Asphalt Mixing Plant
tangki_aspal varchar(20) Tangki aspal dari produk Asphalt Mixing Plant
Tabel 3.4 merupakan struktur dari tabel tbl_amp yang berfungsi untuk menyimpan data-data produk Asphalt Mixing Plant.
4. Tabel users
Tabel 3.5 Struktur Tabel users
Nama Field Tipe Data Constraint Keterangan id Int(11) Primary Key Kode unik dari user Username Varchar(255) Username dari user
Email varchar(255) Email dari user
Password Varchar(255) Kata sandi dari user
Created_at Datetime Waktu pembuatan akun dari user Tabel 3.5 merupakan struktur dari tabel users yang berfungsi untuk menyimpan seluruh data user.
5. Tabel tbl_bp
Tabel 3.6 Struktur Tabel tbl_bp
Nama Field Tipe Data Constraint Keterangan
model_bp varchar(10) Primary Key Kode unik dari produk Batching Plant
id_product int(11) Foreign Key Kode unik dari produk
tipe_angkat varchar(20) Tipe angkat dari produk Batching Plant
produktivitas int(11) Produktivitas dari produk Batching Plant
kapasitas int(11) Kapasitas dari produk Batching Plant
berat_presisi int(11) Berat presisi dari produk Batching Plant
kekuatan int(11) Kekuatan dari produk Batching Plant
Tabel 3.6 merupakan struktur dari tabel tbl_bp yang berfungsi untuk menyimpan data-data produk Batching Plant.
6. Tabel tbl_gambar
Tabel 3.7 Struktur Tabel tbl_gambar
Nama Field Tipe Data Constraint Keterangan
id_gambar int(11) Primary Key Kode unik dari gambar produk id_product int(11) Foreign Key Kode unik dari produk
nama_gambar varchar(250) Nama gambar dari produk token varchar(100) Token dari gambar produk
Tabel 3.7 merupakan struktur dari tabel tbl_gambar yang berfungsi untuk menyimpan data-data gambar produk.
7. Tabel tbl_sc
Tabel 3.8 Struktur Tabel tbl_sc
Nama Field Tipe Data Constraint Keterangan
model_sc varchar(20) Primary Key Kode unik dari produk Stone Crusher
id_product int(11) Foreign Key Kode unik dari produk
ukuran varchar(20) Ukuran dari produk Stone Crusher ukuran_max int(11) Ukuran maksimal dari produk Stone
Crusher
adj_range varchar(10) Jarak penyesuaian dari produk Stone Crusher
kapasitas varchar(10) Kapasitas dari produk Stone Crusher motor_power varchar(10) Kekuatan motor dari produk Stone
Crusher
Tabel 3.8 merupakan struktur dari tabel tbl_sc yang berfungsi untuk menyimpan data seluruh produk Stone Crusher.
8. Tabel tbl_aksesoris
Tabel 3.9 Stuktur Tabel tbl_aksesoris
Nama Field Tipe Data Constraint Keterangan id_aksesoris int(11) Primary Key Kode unik dari aksesoris id_product int(11) Foreign Key Kode unik dari produk nama_aksesoris_id varchar(50) Nama aksesoris dalam bahasa
Indonesia
keterangan_id text Keterangan aksesoris dalam
bahasa Indonesia
gambar_utama varchar(250) Gambar utama dari aksesoris nama_aksesoris_en varchar(30) Nama aksesoris dalam bahasa
inggris
keterangan_en text Keterangan aksesoris dalam
bahasa inggris
Tabel 3.9 merupakan struktur dari tabel tbl_aksesoris yang berfungsi untuk
9. Tabel tbl_book
Tabel 3.10 Stuktur Tabel tbl_book
Nama Field Tipe Data Constraint Keterangan
id int(11) Primary Key Kode unik dari booking
name varchar (200) Nama user yang booking
product_id int(11) Kode unik dari produk
product_id_acc_detail int(11) Keterangan aksesoris dalam bahasa Indonesia
email varchar (200) Email dari user yang booking
no_telpon varchar(20) Nomor telepon dari user yang
booking
created_at timestamp Tanggal yang dibooking oleh
user
alamat varchar(255) Alamat tempat tinggal user
start_date timestamp Waktu aktivitas pembuatan
data pada row yang bersangkutan
end_date timestamp Waktu aktivitas pembaharuan
data pada baris yang bersangkutan
Tabel 3.10 merupakan struktur dari tabel tbl_book yang berfungsi untuk menyimpan list data booking.
A.7 Rancangan Antarmuka
Gambar 3.17 Rancangan Antarmuka Halaman Beranda
Gambar 3.17 merupakan rancangan antarmuka halaman beranda. Terdapat header, tombol bahasa, dan menu utama pada bagian atas halaman. Lalu terdapat image slider dibawah menu utama dan dibagian tengah halaman terdapat teks informasi perusahaan. Kemudian di bagian bawah terdapat kumpulan beberapa daftar produk, jika ingin melihat produk secara detail maka dapat tombol baca selengkapnya. Pada bagian paling bawah halaman terdapat footer dari website.
Gambar 3.18 Rancangan Antarmuka Halaman Produk
Gambar 3.18 merupakan rancangan antarmuka halaman produk. Terdapat header, tombol bahasa, dan menu utama pada bagian atas halaman. Kemudian terdapat gambar serta informasi produk dibawah menu utama. Dibagian tengah halaman, terdapat tabel model dan spesifikasi dari produk tersebut. Lalu dibawah tabel ada form itu melakukan booking. Pada bagian bawah halaman terdapat footer dari website.
Gambar 3.19 Rancangan Antarmuka Halaman Tentang Kami
Gambar 3.19 merupakan rancangan antarmuka halaman tentang kami. Terdapat header, tombol bahasa, dan menu utama pada bagian atas halaman. Pada halaman bagian tengah terdapat konten dari halaman tentang kami. Pada halaman bagian bawah terdapat footer dari website.
Gambar 3.20 Rancangan Antarmuka Halaman Kontak Kami
Gambar 3.20 merupakan rancangan antarmuka halaman kontak kami. Terdapat header, tombol bahasa, dan menu utama pada bagian atas halaman. Pada halaman bagian tengah terdapat maps yang berisi lokasi dari perusahaan tersebut dan form pesan untuk mengirim pesan kepada admin. Pada halaman bagian bawah terdapat footer dari website.
Gambar 3.21 Rancangan Antarmuka Halaman Login Admin
Gambar 3.21 merupakan rancangan antarmuka halaman login admin. Pada bagian atas halaman terdapat header. Pada bagian tengah halaman terdapat form login yang digunakan untuk melakukan input data login. Terdapat 2 jenis input pada form login yaitu textbox dengan tipe teks dan textbox dengan tipe password. Lalu pada bagian bawah form terdapat button login.
Gambar 3.22 Rancangan Antarmuka Halaman Dashboard Admin
Gambar 3.22 merupakan rancangan antarmuka halaman dashboard pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada halaman bagian tengah kanan terdapat form view data dashboard.
Gambar 3.23 Rancangan Antarmuka Halaman Read Product
Gambar 3.23 merupakan rancangan antarmuka halaman read data produk pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada bagian tengah kanan utk menampilkan data dalam bentuk tabel.
Terdapat button add diatas tabel yang berfungsi untuk melakukan penambahan data dan searchbox yang berfungsi untuk melakukan pencarian data pada tabel. Juga terdapat button action pada bagian kanan tabel yang berfungsi untuk melakukan add, delete, dan edit gambar produk.
Gambar 3.24 Rancangan Antarmuka Halaman Add dan Edit Product
Gambar 3.24 merupakan rancangan antarmuka halaman add dan edit data produk pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada bagian tengah kanan terdapat form add dan edit data. Pada bagian bawah form terdapat button submit yang apabila ditekan maka akan menjalankan proses add dan edit data produk, button cancel dan button reset.
Gambar 3.25 Rancangan Antarmuka Halaman Add dan Edit Gambar Produk
Gambar 3.25 merupakan rancangan antarmuka halaman add dan edit gambar produk pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada halaman bagian tengah kanan terdapat form drag and drop gambar dan edit gambar. Pada bagian bawah form terdapat button submit yang apabila ditekan maka akan menjalankan proses add dan edit gambar produk, button cancel dan button reset.
Gambar 3.26 Rancangan Antarmuka Halaman Read Jenis Product
Gambar 3.26 merupakan rancangan antarmuka halaman read data jenis produk pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada bagian tengah kanan utk menampilkan data dalam bentuk tabel. Terdapat button add diatas tabel untuk melakukan penambahan data dan searchbox untuk melakukan pencarian data pada tabel. Pada halaman ini juga terdapat button action pada bagian kanan tabel yang berfungsi untuk melakukan edit, dan delete.
Gambar 3.27 Rancangan Antarmuka Halaman Add dan Edit Jenis Produk
Gambar 3.27 merupakan rancangan antarmuka halaman add dan edit data jenis produk pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada bagian tengah kanan terdapat form add dan edit data. Pada bagian bawah form terdapat button submit yang apabila ditekan maka akan menjalankan proses add dan edit data jenis produk, button cancel dan button reset.
Gambar 3.28 Rancangan Antarmuka Halaman Read Contact
Gambar 3.28 merupakan rancangan antarmuka halaman read contact pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada bagian tengah kanan utk menampilkan data dalam bentuk tabel.
Terdapat searchbox diatas tabel yang berfungsi untuk melakukan pencarian data pada tabel. Terdapat juga button action pada bagian kanan tabel yang berfungsi untuk melakukan delete.
Gambar 3.29 Rancangan Antarmuka Halaman List Booking
Gambar 3.29 merupakan rancangan antarmuka halaman list booking pada halaman admin. Pada bagian atas terdapat header dan pada bagian kanan dari header
terdapat sebuah icon angle-down. Bila icon tersebut ditekan akan menampilkan menu tambahan yaitu logout. Pada halaman bagian tengah kiri, terdapat menu utama dari halaman admin. Pada bagian tengah kanan utk menampilkan data dalam bentuk tabel.
Terdapat searchbox diatas tabel yang berfungsi untuk melakukan pencarian data pada tabel.
B. Implementasi
Gambar 3.30 Tampilan Halaman Beranda
Gambar 3.30 adalah tampilan pada halaman beranda website. Pada halaman ini user dapat melihat slider gambar produk dan beberapa daftar produk yang tersedia pada PT THJ Dinamika Indonesia.
Gambar 3.31 Tampilan Halaman Produk
Gambar 3.31 merupakan tampilan dari halaman produk. Terdapat beberapa gambar dan informasi mengenai produk. Pada bagian tengah halaman terdapat tabel model dan spesifikasi dari produk tersebut. Pada bagian bawah terdapat menu untuk melakukan booking produk.
Gambar 3.32 Tampilan Halaman Tentang Kami
Gambar 3.32 merupakan tampilan dari halaman tentang kami. Pada halaman ini user dapat melihat informasi yang tentang perusahaan PT THJ Dinamika Indonesia.
Gambar 3.33 Tampilan Halaman Kontak Kami
Gambar 3.33 merupakan tampilan dari halaman kontak kami. Pada halaman ini user dapat mengirimkan pesan kepada admin tentang pertanyaan maupun pemesanan dan pembelian.
Gambar 3.34 Tampilan Halaman Login Admin
Gambar 3.34 merupakan tampilan dari halaman login admin dimana admin mengisi username dan password untuk melakukan login.
Gambar 3.35 Tampilan Dashboard Admin
Gambar 3.35 merupakan tampilan halaman untuk menampilkan data dashboard dari aplikasi.
Gambar 3.36 Tampilan Halaman Read Product
Gambar 3.36 merupakan tampilan halaman untuk menampilkan data produk dari aplikasi. Admin dapat melakukan pengolahan data produk dengan menekan button action disebelah kanan tabel dan menambah data produk dengan menekan button add disebelah atas tabel.
Gambar 3.37 Tampilan Halaman Add Product
Gambar 3.37 merupakan tampilan dari halaman add data produk. Ketika ingin melakukan penambahan data produk, maka diwajibkan mengisi form tersebut lalu menekan tombol submit.
Gambar 3.38 Tampilan Halaman Edit Product
Gambar 3.38 merupakan tampilan halaman edit data produk. Ketika ingin melakukan perubahan data produk, maka diwajibkan mengisi form tersebut lalu menekan tombol submit.
Gambar 3.39 Tampilan Halaman Read Jenis Product
Gambar 3.39 merupakan tampilan halaman untuk menampilkan data jenis produk dari aplikasi. Admin dapat melakukan edit dan delete pada data tersebut.
Gambar 3.40 Tampilan Halaman Add Jenis Product
Gambar 3.40 merupakan tampilan dari halaman add data jenis produk. Ketika ingin melakukan penambahan data jenis produk, maka diwajibkan mengisi form tersebut lalu menekan tombol submit.
Gambar 3.41 Tampilan Halaman Edit Jenis Product
Gambar 3.41 merupakan tampilan halaman edit data jenis produk. Ketika ingin melakukan perubahan data jenis produk, maka diwajibkan mengisi form tersebut lalu menekan tombol submit.
Gambar 3.42 Tampilan Halaman List Booking
Gambar 3.42 merupakan tampilan halaman list booking produk. Ketika ingin melihat produk yang dibooking oleh user, maka admin dapat melihatnya berdasarkan nama, email, nomor telepon, nama produk, dan tanggal bookingnya.
Gambar 3.43 Tampilan Halaman Read Contact
Gambar 3.43 merupakan tampilan dari halaman read contact aplikasi. Pada halaman ini, admin dapat melihat dan menghapus pesan yang dikirimkan user untuk admin.
Gambar 3.44 Tampilan Halaman Image Slider
Gambar 3.44 merupakan tampilan dari halaman image slider produk. Pada halaman ini, admin dapat memasukkan dan menghapus gambar produk yang ingin ditampilkan pada gambar slider halaman beranda website.
3.3.3 Kendala yang Ditemukan
Kendala-kendala yang ditemukan selama proses pelaksanaan kerja magang adalah sebagai berikut.
1. Terjadi error pada pembuatan fitur booking yang tidak tersimpan ke dalam database.
2. Kurangnya kesempatan untuk bertanya kepada mentor di kantor dikarenakan mentor memiliki kesibukan untuk menjalankan tugasnya.
3.3.4 Solusi Atas Kendala yang Ditemukan
Solusi bagi kendala yang dihadapi adalah sebagai berikut.
1. Mencari berbagai referensi atau tutorial dari internet tentang penambahan fitur booking tersebut.
2. Bertanya dan meminta saran kepada orang lain yang berpengalaman dan mahir dalam web programming.
