i SKRIPSI RANCANG BANGUN APLIKASI FRONT OFFICE BERBASIS WEB DAN ANDROID DI TOKO PUJI COLLECTION KUDUS HALAMAN JUDUL - Welcome to Repositori Universitas Muria Kudus - Repositori Universitas Muria Kudus

(1)

i SKRIPSI

RANCANG BANGUN APLIKASIFRONT OFFICEBERBASISWEBDAN

ANDROIDDI TOKO PUJI COLLECTION KUDUS HALAMAN JUDUL

OLEH :

RYAN OKTAVIANTO 2010-51-017

SRIPSI DIAJUKAN SEBAGAI SALAH SATU SYARAT UNTUK MEMPEROLEH GELAR SARJANA KOMPUTER

PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS TEKNIK

UNIVERSITAS MURIA KUDUS 2015

i SKRIPSI

RANCANG BANGUN APLIKASIFRONT OFFICE BERBASISWEBDAN

OLEH :

UNIVERSITAS MURIA KUDUS 2015

i SKRIPSI

RANCANG BANGUN APLIKASIFRONT OFFICE BERBASISWEBDAN

OLEH :

(2)

ii

UNIVERSITAS MURIA KUDUS PENGESAHAN STATUS SKRIPSI

JUDUL : RANCANG BANGUN APLIKASI FRONT OFFICE BERBASIS WEB

DANANDROIDDI TOKO PUJI COLLECTION KUDUS

SAYA : RYAN OKTAVIANTO

Mengizinkan skripsi Teknik Informatika ini disimpan di perpustakaan program studi Teknik Informatika Universitas Muria Kudus dengan syarat-syarat kegunaan sebagai berikut :

1. Skripsi adalah hal milik program studi Teknik Informatika UMK

2. Perpustakaan Teknik Informatika UMK dibenarkan membuat salinan untuk tujuan referensi saja

3. Perpustakaan juga dibenarkan membuat salinan skripsi ini sebagai bahan pertukaran antar institusi pendidikan tinggi

4. Berikut tanda √ sesuai dengan kategori skripsi

Sangat Rahasia (Mengandung isi tentang keselamatan/kepentingan Negara Republik Indonesia)

Rahasia (Mengandung isi tentang kerahasiaan dari suatu organisasi/badan tempat penelitian skripsi ini dikerjakan)

Desa Getas Pejaten Rt 08 Rw III Kec. Jati Kab. Kudus

Tanggal : 29 Juli 2015

Pembimbing Utama

Arief Susanto, S.T,M.Kom NIDN. 0603047104 Tanggal :29 Juli 2015

√

ii

Pembimbing Utama

√

ii

Pembimbing Utama

(3)

iii

UNIVERSITAS MURIA KUDUS PERNYATAAN PENULIS

NIM : 2010-51-017

“Saya Menyatakan dan bertanggung jawab dengan sebenarnya bahwa skripsi ini adalah hasil karya saya sendiri kecuali cuplikan dan ringkasan yang masing-masing telah saya jelaskan sumbernya, jika pada waktu selanjutnya ada pihak lain yang, mengklaim bahwa skripsi ini sebagai karyanya, yang disertai dengan bukti-bukti yang cukup, maka saya bersedia untuk membatalkan gelar Sarjana Komputer saya beserta segala hak dan kewajiban yang melekat pada gelar tersebut”.

Kudus, 27 Agustus 2015

Ryan Oktavianto Penulis

iii

NIM : 2010-51-017

Ryan Oktavianto Penulis

iii

NIM : 2010-51-017

(4)

iv

UNIVERSITAS MURIA KUDUS PERSETUJUAN SKRIPSI

NIM : 2010-51-017

Laporan ini telah diperiksa dan disetujui, Kudus, 29 Juli 2014

Pembimbing 1

NIM : 2010-51-017

Pembimbing 1

NIM : 2010-51-017

(5)

v

UNIVERSITAS MURIA KUDUS PENGESAHAN SKRIPSI

NIM : 2010-51-017

Skipsi ini telah diujikan dan dipertahankan di hadapan Dewan Penguji pada Sidang Skripsi tanggal 20 Agustus 2015. Menurut pandangan kami, Skripsi ini memadai dari segi kualitas untuk tujuan penganugerahan gelar Sarjana Komputer (S.Kom).

Ketua Penguji

Rochmad Winarso, ST., MT NIS. 0610701000001138

NIM : 2010-51-017

Ketua Penguji

NIM : 2010-51-017

Ketua Penguji

Kaprogdi Teknik Informatika

(6)

vi ABSTRACK

Design of a web-based front office applications and android in stores Praise

Collection used to build something that is required by the store and the customer that

is growing toward computerization. The method used is the method by Sammerville

Ian Waterfall. Research results with such systems make it easier for stores Praise

Collection can promote and sell products more easily, effectively and efficiently. The

system was developed using PHP programming language. Then proceed with the use

of android-based system in order to make it easier for customers and shopkeepers to

access the application. Expected useful systems developed optimally.

(7)

vii ABSTRAK

Rancang bangun aplikasi front office berbasis web dan android di toko Puji Collection Kudus digunakan untuk membangun sesuatu yang diperlukan oleh pihak toko maupun customer yang sedang berkembang ke arah komputerisasi. Metode penelitian yang digunakan adalah Metode Waterfall oleh Sammerville Ian. Hasil penelitian dengan adanya sistem tersebut lebih memudahkan toko Puji Collection Kudus dapat mempromosikan dan menjual produk dengan lebih mudah, efektif dan efisien. Sistem dikembangkan dengan menggunakan menggunakan bahasa pemrograman PHP. Kemudian dilanjutkan dengan penggunaan sitem berbasis android agar lebih memudahkan para customer maupun pemilik toko untuk mengakses aplikasi tersebut. Diharapkan sistem yang dikembangkan bermanfaat seoptimal mungkin.

(8)

viii

KATA PENGANTAR

Puji syukur kehadirat Allah SWT karena atas Rahmat dan Hidayah-Nya penulis mampu menyelesaikan penyusunan skripsi ini dengan judul “Rancang Bangun Aplikasi Front Office Berbasis Web dan Android di Toko Puji Collection Kudus”.

Skripsi ini disusun guna melengkapi salah satu persyaratan untuk memperoleh Gelar Kesarjanaan Progam Studi Teknik Informatika Fakultas Teknik Universitas Muria Kudus. Kiranya dalam penyusunan skripsi ini tidak akan terselesaikan dengan baik tanpa bantuan dari berbagai pihak. Untuk itu pada kesempatan ini penulis mengucapkan terima kasih yang sebesar-besarnya, penghargaan yang setinggi-tingginya dan permohonan maaf atas segala kesalahan yang pernah penulis lakukan kepada semua pihak yang telah membantu dalam penyelesaian skripsi ini, terutama kepada :

1. Allah SWT yang telah memberikan Ridho, Rahmat dan Hidayah-Nya. 2. Bapak Dr.Suparnyo, SH, MS, selaku Rektor Universitas Muria Kudus.

3. Bapak Rochmad Winarso, ST, MT, selaku Dekan Fakultas Teknik Universitas Muria Kudus.

4. Bapak Ahmad Jazuli, S.Kom, M.Kom, selaku Ketua Program Studi Teknik Informatika Universitas Muria Kudus.

5. Bapak Arief Susanto, S.T,M.Kom selaku pembimbing utama Skripsi. 6. Ibu Tutik Khotimah, M.Kom, selaku pembimbing Skripsi penulis.

7. Ibu dan Bapak tercinta yang selalu memberikan dukungan moral dan materiil. 8. Semua pihak yang telah membantu penyusunan skripsi ini yang tidak bisa penulis

sebutkan satu persatu.

Penulis menyadari sepenuhnya bahwa dalam penyusunan skripsi ini masih terdapat banyak kekurangan, untuk itu penulis mengharap kritik dan saran dari berbagai pihak untuk sempurnanya sebuah karya tulis.

Kudus, 29 Juli 2015

(9)

ix DAFTAR ISI

HALAMAN JUDUL...i

PENGESAHAN SKRIPSI...ii

PERNYATAAN PENULIS...iii

PERSETUJUAN SKRIPSI...iv

PENGESAHAN SKRIPSI...v

ABSTRACK...vi

ABSTRAK...vii

KATA PENGANTAR...viii

DAFTAR ISI...ix

DAFTAR TABEL...xii

DAFTAR GAMBAR...xiii

DAFTAR LAMPIRAN...xvi

BAB I PENDAHULUAN...1

1.1 Latar Belakang... 1

1.2 Identifikasi Masalah ... 2

1.3 Batasan Masalah ... 2

1.4 Rumusan Masalah ... 3

1.5 Tujuan Penelitian... 4

1.6 Manfaat Penelitian... 4

1.6.1 Manfaat Bagi Toko Tas Puji Collection Kudus... 4

1.6.2 Manfaat Bagi Masyarakat... 4

1.6.3 Manfaat Bagi IPTEK ... 4

BAB II TINJAUAN PUSTAKA...5

2.1 Penelitian Terkait... 5

2.2 Landasan Teori ... 6

2.2.1 Diagram Aliran Data /Data Flow Diagram(DFD) ... 6

2.2.2 Penyimpanan (Data Store) ... 9

2.2.3 Diagram Konteks (Context Diagram) ... 11

(10)

x

2.2.5 Diagram Rinci (Level Diagram)... 11

2.2.6 Kamus Data ... 12

2.2.7 Entity Relationship Diagram(ERD) ... 13

2.2.8 Website... 15

2.2.9 Java Script... 16

2.2.10 PHP... 16

2.2.11 MySQL ... 17

2.2.12 Dreamweaver... 18

2.2.13Android... 18

2.2.13.1 Sejarah dan PengertianAndroid... 18

2.2.13.2 Macam-macam VersiAndroid... 18

2.2.14 Eclipse... 22

2.3 Kerangka Pemikiran ... 23

BAB III METODE PENELITIAN...24

3.1 Study Literature... 24

3.2 Pengumpulan Data dan Analisis... 24

3.3 Metode Pengerjaan ... 24

BAB IV ANALISA, PERANCANGAN DAN DESAIN INPUT OUTPUT...26

4.1 Gambaran Umum Aplikasi Front Office Berbasis Web dan Android... 26

4.2 Analisis Masalah... 27

4.2.1 Analisis Sistem yang Berjalan ... 28

4.2.2 Analisis Sistem yang Diusulkan ... 29

4.2.3 Analisis Kebutuhan Data dan Informasi ... 29

4.2.4 Analisis Kebutuhan Aplikasi Untuk Perancangan ... 29

4.2.4.1 Analisa Kebutuhan Perangkat Keras ... 29

4.2.4.2 Analisa Kebutuhan Perangkat Lunak... 29

4.2.5 Perancangan Sistem ... 29

4.3 Perancangan Basis Data... 33

4.3.1 ERD (Entity Relationship Diagram)... 33

4.4 Skema Tabel atau Relasi Antar Tabel ... 35

4.5 Perancangan Database ... 35

(11)

xi

BAB V IMPLEMENTASI SISTEM...52

5.1 Implemetasi Basis Data ... 52

5.2 Implemetasi Sistem ... 56

5.2.1 UploadAplikasi ke Server ... 56

5.3 Pengujian Sistem ... 68

5.3.1 Hasil Pengujian Untuk Proses Registrasi/Pendaftaran Customer ... 68

5.3.2 Hasil Pengujian Untuk ProsesLogin Customer ... 69

5.3.3 Hasil Pengujian Untuk Proses PemesananCustomer ... 69

5.3.4 Halaman PengujianLoginAdmin ... 70

5.3.5 Halaman Pengujian Konfirmasi Pemesanan Admin ... 70

5.3.6 Pengujian Instalasi Aplikasi diHandphone Android ... 72

5.4 Rekapitulasi Hasil Kuisioner ... 73

BAB VI PENUTUP...75

6.1 Kesimpulan ... 75

6.1 Saran ... 75

(12)

xii

DAFTAR TABEL

Tabel 2.1 Simbol-simbol DFD... 7

Tabel 2.2 Penomeran Proses...Error! Bookmark not defined. Tabel 4.1 Tabel Admin... 36

Tabel 4.2 Tabel Kategori... 36

Tabel 4.3 Tabel Produk... 36

Tabel 4.4 Tabel Order Produk... 37

Tabel 4.5 Tabel Detail Transaksi... 37

Tabel 4.6 Tabel Pelanggan... 38

Tabel 4.7 Tabel Ongkir... 38

Tabel 4.8 Tabel Kota... 39

Tabel 4.9 Tabel Jasa... 39

Tabel 5.1Tabel Pengujian Proses Registrasi ... 68

Tabel 5.2Tabel Pengujian ProsesLogin Customer... 69

Tabel 5.3Tabel Pengujian Proses PemesananCustomer... 69

Tabel 5.5Tabel Pengujian Login Admin... 70

Tabel 5.6Tabel Pengujian KonfirmasiPesanan Admin ... 71

Tabel 5.7Tabel Pengujian Aplikasi di Handphone Android ... 72

(13)

xiii

DAFTAR GAMBAR

Gambar 2.1 Kesatuan Luar ... 7

Gambar 2.2 Proses ... 8

Gambar 2.3 Penyimpanan (Data Store) ... 9

Gambar 2.4 Entitas... ..Error! Bookmark not defined. Gambar 2.5 Atribut ... 14

Gambar 2.6 Relationship... 14

Gambar 2.7 Kerangka Pemikiran... 23

Gambar 3.1 Metodologi Waterfall ... 25

Gambar 4.1 Context Diagram Aplikasi Front Office Toko ... 30

Gambar 4.2 DFD Level 0 Aplikasi Front Office Toko... 31

Gambar 4.3 DFD Level 1 Pendataan Toko... 32

Gambar 4.4 DFD Level 1 Order Produk... 33

Gambar 4.5 ERD (Entity Relationship Diagram... 34

Gambar 4.6 Relasi Antar Tabel... 35

Gambar 4.7 Halaman Desain Aplikasi Untuk Pelanggan dan Pengunjung ... 40

Gambar 4.8 Halaman Utama Untuk Pelanggan dan Pengunjung ... 40

Gambar 4.9 Halaman login dan Sign up untuk Pelanggan dan Pengunjung ... 41

Gambar 4.10 Halaman Detail Produk untuk Pelanggan dan Pengunjung ... 42

Gambar 4.11 Halaman Cart untuk Pelanggan... 42

Gambar 4.12 Halaman Selesai Belanja untuk Pelanggan ... 43

Gambar 4.13 Halaman Detail Transaksi untuk Pelanggan ... 44

Gambar 4.14 Halaman Desain Aplikasi untuk Admin... 44

Gambar 4.15 Halaman Login Untuk Admin... 45

Gambar 4.16 Halaman Data Pelanggan Untuk Admin ... 45

Gambar 4.17 Halaman Input Kategori Untuk Admin... 46

Gambar 4.18 Halaman Data Kategori Untuk Admin... 46

Gambar 4.19 Halaman Input Produk Untuk Admin ... 47

Gambar 4.20 Halaman Data Produk Untuk Admin ... 47

Gambar 4.21 Halaman Data Order Produk Untuk Admin... 48

(14)

xiv

Gambar 4.23 Halaman Data Ongkos Kirim Untuk Admin... 49

Gambar 4.24 Halaman Input Jasa Kirim Untuk Admin... 49

Gambar 4.25 Halaman Data Jasa Kirim Untuk Admin... 50

Gambar 4.26 Halaman Input Kota Kirim Untuk Admin... 50

Gambar 4.27 Halaman Data Kota Kirim Untuk Admin ... 51

Gambar 5.1 Tabel Admin... 52

Gambar 5.2 Tabel Pelanggan ... 52

Gambar 5.3 Tabel Kategori... 53

Gambar 5.4 Tabel Produk ... 53

Gambar 5.5 Tabel Jasa ... 53

Gambar 5.6 Tabel Kota ... 54

Gambar 5.7 Tabel Ongkir ... 54

Gambar 5.8 Tabel Order ... 55

Gambar 5.9 Tabel Detail Transaksi ... 55

Gambar 5.10 Tabel Relasi Antar Tabel... 56

Gambar 5.11 Masukan Domain dan Pasword... 57

Gambar 5.12 Konfirmasi Order ... 57

Gambar 5.13 Konfirmasi Domain Berhasil Dibuat ... 58

Gambar 5.14 Halaman Menu File... 58

Gambar 5.15 Instal File Manager... 59

Gambar 5.16 Direktori File manager ... 59

Gambar 5.17 Direktori file Manager /public_html ... 60

Gambar 5.18 Menu File Database... 60

Gambar 5.19 Halaman PHP MyAdmin ... 61

Gambar 5.20 Halaman importing Database ... 62

Gambar 5.21 Halaman Direktori File Manager Folder Puji ... 62

Gambar 5.22 Edit file Koneksi.php... 63

Gambar 5.23 Halaman Pelanggan dan Pengunjung... 63

Gambar 5.24 Gambar Produk Detail... 64

Gambar 5.25 Gambar Login Pelanggan... 64

Gambar 5.26 Menu Cart... 65

(15)

xv

(16)

xvi

DAFTAR LAMPIRAN

Lampiran 1 : Biodata