ABSTRAK
Saat ini perkembangan teknologi sangatlah pesat termasuk salah satunya dibidang informasi dan website. Banyak orang yang ingin untuk memajukan dunia website baik secara tampilan yang “dipercantik” maupun dalam kemudahannya dalam mengaksesnya. Di dunia bisnis sekarang, juga sangat berkembang dengan pesat dan sedang dalam trend mengenai bisnis “online”. Oleh karena itu, tugas akhir ini bertujuan untuk memperkenalkan dan menerangkan pengaplikasian bisnis online terutama di bidang makanan yang masih jarang ditemui untuk saat ini, yaitu Website Informasi dan Pemesanan Catering. Perancangan Website ini bertujuan untuk menunjukan sistem informasi dan pemesanan catering secara online lebih mudah dan daerah pemasarannya lebih luas. Selain itu juga berguna untuk pemesanan dalam masalah bisnis online terutama makanan bisa dibuat sistem yang lebih modern.
i
Universitas Kristen Maranatha
ABSTRACT
Now, very rapid technological developments including the one in the field of information and website, many people who want to advance the world of websites either display the "enhanced" as well as the ease of access. Today's business world is also growing rapidly and is in the trend of the business "online". Therefore, scientific work is aimed to introduce and explain the application of any online business, especially in the field of foods that are rarely encountered in this time, namely information and catering orders website. Website design is to present information and ordering system online catering easier and more extensive marketing area. It is also useful for booking online business, especially in matters of food could be a more modern system.
ii
Universitas Kristen Maranatha
DAFTAR ISI
Abstrak ................................................................................................................ i Abstract ............................................................................................................... ii Kata Pengantar .................................................................................................... iii Daftar Isi.............................................................................................................. v Daftar Tabel ........................................................................................................ viii Daftar Gambar ..................................................................................................... ix Bab I Pendahuluan............................................................................................ 1 1.1 Latar Belakang ....................................................................................... 1 1.2 Identifikasi Masalah ............................................................................... 2 1.3 Tujuan Masalah ...................................................................................... 2 1.4 Pembatasan Masalah .............................................................................. 2 1.5 Sistematika Penelitian ............................................................................ 3 Bab II Landasan Teori ..................................................................................... 4 2.1 Pengenalan PHP .................................................................................... 4 2.1.1. Tipe Data ..................................................................................... 4 2.1.2. Variabel ....................................................................................... 6 2.1.3. Operator....................................................................................... 6 2.2 MySQL .................................................................................................. 8 2.3 Database ................................................................................................ 13 2.4 HTML .................................................................................................... 13 2.5 XAMPP .................................................................................................. 15 2.6 EditPlus .................................................................................................. 16 2.7 CSS(Cascading Style Sheets) ................................................................. 16
v
Universitas Kristen Maranatha
2.6.1 Penggunaan Atribut ID dalam Tag............................................... 17 2.6.2 Penggunaan Kelas ........................................................................ 18 2.8 JavaScript .............................................................................................. 18 2.9 JQuery .................................................................................................... 18 Bab III Perancangan dan Pemodelan ............................................................. 21 3.1 Blok Diagram ......................................................................................... 21 3.2 Peta Situs ................................................................................................ 23 3.3 Flowchart ............................................................................................... 24 3.4 Pembuatan Website Menggunakan EditPlus .......................................... 36 3.4.1. Pembuatan Tampilan Awal ......................................................... 37 3.4.2. Pembuatan Daftar Menu yang Disediakan dan Harganya .......... 38 3.4.3. Tampilan Memilih Menu ............................................................ 40 3.4.4. Guestbook.................................................................................... 43 3.4.5. Contact Us................................................................................... 46 3.4.6. Halaman Administrator ............................................................... 47 3.5 Program XAMPP ................................................................................... 49 3.6 Pembuatan Database ............................................................................. 50 3.7 Pembuatan Koneksi ............................................................................... 53 Bab IV Hasil dan Pembahasan ........................................................................ 54 4.1 Tampilan Awal Website Line Catering ................................................. 54 4.2 Tampilan Menu Website Line Catering ................................................. 62 4.3 Tampilan Halaman Admin Website Line Catering ................................ 89 4.4 Tabel Database ....................................................................................... 102 Bab V Kesimpulan dan Saran.......................................................................... 104 5.1 Kesimpulan ............................................................................................ 104 5.2 Saran…. ................................................................................................. 104
vi
Universitas Kristen Maranatha
Daftar Pustaka ..................................................................................................... 105 LAMPIRAN A .................................................................................................... A-1
vii
Universitas Kristen Maranatha
DAFTAR TABEL
Tabel 2.1 Daftar operator matematika ................................................................ 7 Tabel 2.2 Daftar operator pembanding ............................................................... 7 Tabel 2.3 Kemungkinan hasil operasi dengan and, or, dan xor.......................... 8 Tabel 2.4 Tipe data untuk bilangan ..................................................................... 11 Tabel 2.5 Tipe data untuk tanggal dan jam ......................................................... 12 Tabel 2.6 Tipe data untuk karakter ..................................................................... 12
viii
Universitas Kristen Maranatha
DAFTAR GAMBAR
Gambar 2.1 Jendela program XAMPP................................................................ 15 Gambar 2.2 Jendela program EditPlus ................................................................ 16 Gambar 3.1 Blok diagram pengunjung website yang tidak mendaftar ............... 21 Gambar 3.2 Blok diagram pengunjung website yang sudah mendaftar .............. 22 Gambar 3.3 Peta situs website Line catering ...................................................... 23 Gambar 3.4 Flowchart pilihan menu awal .......................................................... 24 Gambar 3.5 Flowchart about us.......................................................................... 25 Gambar 3.6 Flowchart services .......................................................................... 26 Gambar 3.7 Flowchart gallery ............................................................................ 27 Gambar 3.8 Flowchart guestbook ....................................................................... 28 Gambar 3.9 Flowchart contact us ....................................................................... 29 Gambar 3.10 Flowchart sejarah .......................................................................... 30 Gambar 3.11 Flowchart semboyan ..................................................................... 30 Gambar 3.12 Flowchart karier ............................................................................ 31 Gambar 3.13 Flowchart mengapa harus Line catering ? ......................................... 31 Gambar 3.14 Flowchart paket pernikahan mejaan .................................................. 32 Gambar 3.15 Flowchart paket pernikahan prasmanan ............................................. 33 Gambar 3.16 Flowchart paket ulang tahun............................................................. 34 Gambar 3.17 Flowchart paket menu harian............................................................ 35
ix
Universitas Kristen Maranatha
Gambar 3.18 Tampilan jendela program EditPlus .............................................. 36 Gambar 3.19 Tampilan halaman EditPlus .......................................................... 36 Gambar 3.20 Hasil tampilan awal website .......................................................... 38 Gambar 3.21 Daftar menu yang disediakan dan harganya ................................. 39 Gambar 3.22 Tampilan memilih menu ............................................................... 42 Gambar 3.23 Tampilan memilih menu(lanjutan) ................................................ 43 Gambar 3.24 Form untuk guestbook ................................................................... 45 Gambar 3.25 Form untuk contact us ................................................................... 47 Gambar 3.26 Tampilan halaman admin .............................................................. 49 Gambar 3.27 Tampilan XAMPP control panel .................................................. 50 Gambar 3.28 ERD Entity Relationship Diagram) database .................................... 51 Gambar 3.29 Database catering ................................................................................. 52 Gambar 3.30 Membuat tabel ....................................................................................... 52 Gambar 4.1 Tampilan awal website Line catering ............................................. 54 Gambar 4.2 Tampilan about us website Line catering ....................................... 55 Gambar 4.3 Tampilan sejarah website Line catering.......................................... 56 Gambar 4.4 Tampilan semboyan website Line catering ..................................... 57 Gambar 4.5 Tampilan karier website Line catering............................................ 57 Gambar 4.6 Tampilan mengapa harus Line catering ? ....................................... 58 Gambar 4.7 Tampilan cara pemesanan website Line catering .......................... 59 Gambar 4.8 Tampilan download website Line catering ..................................... 59
x
Universitas Kristen Maranatha
Gambar 4.9 Tampilan bank pembayaran website Line catering......................... 60 Gambar 4.10 Tampilan set rekening user website Line catering........................ 60 Gambar 4.11 Tampilan untuk mengisi/menambahkan rekening ........................ 61 Gambar 4.12 Tampilan rekening yang akan disimpan........................................ 61 Gambar 4.13 Tampilan formulir registrasi yang sudah diisi............................... 62 Gambar 4.14 Tampilan untuk login .................................................................... 63 Gambar 4.15 Tampilan untuk mengisi rekening ................................................. 63 Gambar 4.16 Memilih rekening yang digunakan untuk membayar .................... 64 Gambar 4.17 Tampilan jenis-jenis paket mejaan ................................................ 65 Gambar 4.18 Memilih paket silver dan mengisi jumlah paket ........................... 65 Gambar 4.19 Pilih menu paket pernikahan mejaan silver................................... 66 Gambar 4.20 Pilih menu paket pernikahan mejaan silver(lanjutan) ................... 67 Gambar 4.21 Pilih menu paket pernikahan mejaan silver(lanjutan1) ................. 67 Gambar 4.22 Daftar pesanan paket silver yang sudah dipilih ............................. 68 Gambar 4.23 Pesan yang ditampilkan jika pesanan berhasil .............................. 68 Gambar 4.24 Memilih paket gold dan mengisi jumlah paket ............................. 69 Gambar 4.25 Pilih menu paket pernikahan mejaan gold .................................... 69 Gambar 4.26 Pilih menu paket pernikahan mejaan gold(lanjutan) ..................... 70 Gambar 4.27 Pilih menu paket pernikahan mejaan gold(lanjutan1) ................... 70 Gambar 4.28 Daftar pesanan paket gold yang sudah dipilih .............................. 71 Gambar 4.29 Memilih paket diamond dan mengisi jumlah paket ...................... 72
xi
Universitas Kristen Maranatha
Gambar 4.30 Pilih menu paket pernikahan mejaan diamond ............................. 72 Gambar 4.31 Pilih menu paket pernikahan mejaan diamond(lanjutan) .............. 73 Gambar 4.32 Pilih menu paket pernikahan mejaan diamond(lanjutan1) ............ 73 Gambar 4.33 Daftar pesanan paket diamond yang sudah dipilih........................ 74 Gambar 4.34 Pilih menu paket pernikahan prasmanan ....................................... 75 Gambar 4.35 Pilih menu paket pernikahan prasmanan(lanjutan) ....................... 76 Gambar 4.36 Pilih menu paket pernikahan prasmanan(lanjutan1) ..................... 76 Gambar 4.37 Menanyakan akan menambah paket buffet ................................... 77 Gambar 4.38 Pilih menu paket pernikahan buffet ............................................... 78 Gambar 4.39 Pilih menu paket pernikahan buffet(lanjutan) ............................... 78 Gambar 4.40 Pilih menu paket pernikahan buffet(lanjutan1) ............................. 79 Gambar 4.41 Pilih menu paket pernikahan buffet(lanjutan2) ............................. 79 Gambar 4.42 Pilih menu paket pernikahan buffet(lanjutan3) ............................. 80 Gambar 4.43 Daftar pesanan paket prasmanan yang sudah dipilih .................... 80 Gambar 4.44 Daftar pesanan paket buffet yang sudah dipilih ............................ 81 Gambar 4.45 Tampilan jenis paket ulang tahun.................................................. 82 Gambar 4.46 Memilih paket tumpeng dan mengisi jumlah paket ...................... 82 Gambar 4.47 Tampilan paket tumpeng ............................................................... 83 Gambar 4.48 Menanyakan akan menambah paket nasi boks ............................. 83 Gambar 4.49 Paket nasi boks dan mengisi jumlah paket .................................... 84 Gambar 4.50 Memilih menu paket nasi boks(lanjutan) ...................................... 84
xii
Universitas Kristen Maranatha
Gambar 4.51 Memilih menu paket nasi boks(lanjutan1) .................................... 85 Gambar 4.52 Daftar pesanan paket tumpeng yang sudah dipilih........................ 86 Gambar 4.53 Daftar pesanan paket boks yang sudah dipilih .............................. 86 Gambar 4.54 Daftar menu harian ........................................................................ 87 Gambar 4.55 Memasukan jumlah pesan catering harian .................................... 88 Gambar 4.56 Daftar paket harian yang sudah dipilih ......................................... 88 Gambar 4.57 Tampilan awal halaman admin ..................................................... 89 Gambar 4.58 Tampilan manajemen user ............................................................ 90 Gambar 4.59 Tampilan untuk mengubah data pelanggan ................................... 90 Gambar 4.60 Tampilan manajemen halaman...................................................... 91 Gambar 4.61 Tampilan mengubah halaman about us......................................... 91 Gambar 4.62 Tampilan mengubah halaman sejarah ........................................... 92 Gambar 4.63 Tampilan manajemen slide image ................................................. 92 Gambar 4.64 Tampilan manajemen guestbook ................................................... 93 Gambar 4.65 Tampilan manajemen download ................................................... 94 Gambar 4.66 Tampilan manajemen hubungi kami ............................................. 94 Gambar 4.67 Tampilan manajemen rekening bank ............................................ 95 Gambar 4.68 Tampilan manajemen upload image ............................................. 95 Gambar 4.69 Tampilan tambah kategori makanan ............................................. 96 Gambar 4.70 Tampilan tambah menu makanan ................................................. 97 Gambar 4.71 Tampilan manajemen paket makanan ........................................... 97
xiii
Universitas Kristen Maranatha
Gambar 4.72 Tampilan menambahkan menu makanan ...................................... 98 Gambar 4.73 Tampilan manajemen tarif paket ................................................... 98 Gambar 4.74 Tampilan mengisi harga dari paket yang ada ................................ 99 Gambar 4.75 Tampilan lihat order masuk .......................................................... 99 Gambar 4.76 Tampilan lihat order masuk(lanjutan)........................................... 100 Gambar 4.77 Tampilan mengubah status pesanan .............................................. 100 Gambar 4.78 Tampilan data pemesan ................................................................. 101 Gambar 4.79 Tampilan faktur pembelian ........................................................... 101 Gambar 4.80 Tabel pada database ...................................................................... 102 Gambar 4.81 Database tabel order jenis 2 ......................................................... 103 Gambar 4.82 Database tabel order jenis 3 ......................................................... 103
xiv
Universitas Kristen Maranatha