TUGAS AKHIR PENGGUNAAN TEKNOLOGI INTERNET (E-COMMERCE...

TUGAS AKHIR

PENGGUNAAN TEKNOLOGI INTERNET (E-COMMERCE) DALAM MELAKUKAN TRANSAKSI PERDAGANGAN

(STUDI KASUS DI COMPUSHOP PT. SOLO JALA BUANA)

Diajukan Untuk Memenuhi Tugas dan Syarat-syarat Guna Memperoleh Gelar

Sarjana Teknik pada Fakultas Teknik Jurusan Teknik Elektro Universitas Muhammadiyah Surakarta

Oleh :

AYUB INDRA PERDANA

NIM : D 400 030 094

JURUSAN ELEKTRO FAKULTAS TEKNIK UNIVERSITAS MUHAMMADIYAH SURAKARTA

2011

MOTTO

If You Can't Explain it Simply, You Don't Understand It Well Enough.

~ Albert Einstein ~

Make It Simple But Not Simpler.

~ Albert Einstein ~

Bhinneka Tunggal Ika.

~ Mpu Tantular ~

v

ABSTRAKSI

CompuShop merupakan toko yang menjual berbagai macam hardware

dan software dan bernaung dibawah manajemen PT. Solo Jala Buana. Guna

memperluas pemasaran produknya, maka dibangun sebuah sistem penjualan

online dengan media internet dimana pembelian dan pembayaran bisa dilakukan

secara online. Sistem penjualan online CompuShop dibangun menggunakan

bahasa pemrograman PHP dan basis data MySQL. Sistem ini menjadikan

kegiatan transaksi jual beli dapat berjalan dengan lancar, mudah, cepat dan

akurat. Para calon pembeli dapat dengan mudah memilih, melihat, membeli serta

membayar produk yang dibeli secara online.

Pengujian sementara dilakukan menggunakan melalui localhost dengan

web server Apache pada komputer stand alone, untuk pengujian lanjutan, sistem

akan di-upload ke internet menggunakan web hosting yang mendukung bahasa

pemrograman PHP dan memiliki server basis data MySQL. Sehingga dapat

diketahui respon sistem jika diakses lebih dari satu user.

Kata Kunci : Jual Beli, Internet, CompuShop, PHP, MySQL.

vi

KATA PENGANTAR

Puji syukur Alhamdulillah, penulis panjatkan kehadirat Allah SWT yang

telah memberikan Rahmat, Hidayah dan Karunia-Nya, sehingga penulis dapat

menyelesaikan tugas akhir ini dengan judul “PENGGUNAAN TEKNOLOGI

INTERNET (E-COMMERCE) DALAM MELAKUKAN TRANSAKSI

PERDAGANGAN (STUDI KASUS DI COMPUSHOP PT. SOLO JALA

BUANA)”. Sebagai salah satu syarat untuk menempuh gelar Sarjana Teknik

Elektro pada Fakultas Teknik Elektro Universitas Muhammadiyah Surakarta.

Penulis menyadari bahwa selesainya penulisan tugas akhir ini tidak

terlepas dari pihak-pihak yang telah memberikan bantuan moril maupun materiil.

Dengan segala kerendahan hati, pada kesempatan ini penulis menyampaikan rasa

terima kasih yang sedalam-dalamnya kepada :

1. Ir. Agus Riyanto, M.T. selaku Dekan Fakultas Teknik Universitas

Muhammadiyah Surakarta yang telah memberikan ijin penulisan tugas

akhir ini.

2. Ir. Jatmiko, M.T. selaku Ketua Jurusan Teknik Elektro.

3. Endah Sudarmilah, S.T., M.Eng. selaku Pembimbing Akademik dan juga

merangkap Pembimbing I dalam penyelesaian tugas akhir ini, yang telah

banyak membimbing selama menempuh studi di Teknik Elektro UMS dan

vii

memberikan pengarahan kepada penulis sehingga dapat menyelesaikan

tugas akhir ini.

4. Umi Fadlilah, S.T. selaku Pembimbing II yang telah memberikan banyak

nasehat, bimbingan, dorongan, bantuan dan pengarahan kepada penulis

sehingga dapat menyelesaikan tugas akhir ini.

5. Bapak, Ibu dan adik-adikku tercinta yang tak pernah letih memberikan

do’a, dukungan, semangat dan dengan segala kekurangan dan kelebihan

yang dimiliki dapat menjadikanku seperti yang sekarang ini.

6. All DjinggaCommunity (Hana ”Uban”, Topik, Affandi Noor ”Pandik”,

Eko ”Plorok”, Endro, Yayan, Yudhi, Udin ”Petonx”, Bambang, Ahmad,

Rizky ”Si Bos”, Wiryo, Sabari, dll.) Terimakasih banyak kawan..!!

7. Semua pihak yang tidak bisa disebutkan satu-persatu yang sangat

membantu hingga terselesainya tugas akhir ini.

Akhir kata, penulis menyadari bahwa Tugas Akhir ini masih jauh dari

kesempurnaan. Saran dan kritik yang membangun sangat penulis harapkan.

Semoga karya ini dapat bermanfaat untuk rekan-rekan mahasiswa dan pihak-pihak

yang berkepentingan.

Surakarta, Maret 2011

Penulis

viii

DAFTAR ISI

HALAMAN JUDUL ......................................................................................

LEMBAR PERSETUJUAN ...........................................................................

HALAMAN PENGESAHAN.........................................................................

DAFTAR KONTRIBUSI ...............................................................................

HALAMAN MOTTO ....................................................................................

HALAMAN ABSTRAKSI ............................................................................

KATA PENGANTAR ....................................................................................

DAFTAR ISI ..................................................................................................

DAFTAR GAMBAR .....................................................................................

DAFTAR TABEL ..........................................................................................

BAB I PENDAHULUAN

1.1 Latar Belakang .....................................................................

1.2 Rumusan Masalah ................................................................

1.3 Tujuan Penelitian .................................................................

1.4 Batasan Masalah ..................................................................

1.5 Manfaat Penelitian ...............................................................

1.6 Sistematika Penulisan ..........................................................

BAB II LANDASAN TEORI

2.1 Data ......................................................................................

2.2 Sistem ..................................................................................

2.1.1 Karakteristik Sistem .................................................

i

ii

iii

iv

v

vi

vii

ix

xiii

xiv

1

1

3

4

4

5

5

7

7

8

8

ix

2.3 Informasi ..............................................................................

2.3.1 Kualitas Informasi ...................................................

2.4 Penjualan ..............................................................................

2.5 Sistem Informasi ..................................................................

2.6 Internet .................................................................................

2.7 HTML (HyperText Markup Language) ...............................

2.7.1 Bagian-Bagian HTML .............................................

2.8 PHP (PHP: Hypertext Preprocessor) ..................................

2.9 Penggabungan PHP dan HTML ..........................................

2.9.1 Embedded Script ......................................................

2.9.2 Non Embedded Script ..............................................

2.10 CSS (Cascading Style-Sheet) ...............................................

2.11 Javascript .............................................................................

2.11.1 Kelebihan Javascript ...............................................

2.12 Basis Data ............................................................................

2.12.1 MySQL .....................................................................

2.13 Web Server ...........................................................................

2.13.1 Apache .....................................................................

BAB III PERANCANGAN DAN PEMBUATAN SISTEM

3.1 Perancangan Sistem .............................................................

3.1.1 Administrator ...........................................................

3.1.2 Pengunjung (Calon pembeli) ...................................

3.2 Implementasi Perancangan ..................................................

9

10

10

11

12

13

13

15

16

16

17

17

18

20

20

21

21

23

25

25

25

25

25

x

3.3 Instalasi dan Konfigurasi Sistem .........................................

3.3.1 Instalasi Apache, PHP dan MySQL .........................

3.3.1.1 Instalasi WampServer ................................

3.3.1.2 Menjalankan WampServer ........................

3.4 Struktur Basis Data ..............................................................

3.4.1 Relasi Antar Tabel ...................................................

3.5 Perancangan Struktur Web ...................................................

3.6 Data Flow Diagram (DFD) ..................................................

3.7 Bagan Alir (Flowchart) Program .........................................

BAB IV PENGUJIAN DAN ANALISIS SISTEM

4.1 Komponen Sistem ..............................................................

4.1.1 Kebutuhan Perangkat Keras/Hardware ...................

4.1.1.1 Komputer Server ........................................

4.1.1.2 Komputer Client ........................................

4.1.2 Kebutuhan Perangkat Lunak/Software ....................

4.1.2.1 Komputer Server ........................................

4.1.2.2 Komputer Client ........................................

4.1.3 Kebutuhan Operator/Brainware ...............................

4.1.4 Kebutuhan Internet ...................................................

4.2 Pengujian Sistem .................................................................

4.2.1 Akses Pengunjung Terhadap Halaman Depan

Sistem .......................................................................

27

27

29

31

33

39

40

42

43

48

48

48 48 49 50 50 51 52 52 53 53

xi

4.2.2 Akses Pengunjung Terhadap Halaman Semua

Produk ......................................................................

4.2.3 Akses Pengunjung Terhadap Halaman Hasil

Pencarian ..................................................................

4.2.4 Akses Pengunjung Terhadap Halaman Detail Info

Produk ......................................................................

4.2.5 Akses Pengunjung Terhadap Halaman Keranjang

Belanja .....................................................................

4.2.6 Akses Pengunjung Terhadap Halaman Hubungi

Kami .........................................................................

4.2.7 Akses Administrator Terhadap Halaman

Administrator ...........................................................

4.3 Analisis Hasil Perancangan Sistem ......................................

4.3.1 Analisa Pengunjung Dalam Mengirim Pesan .........

4.3.2 Analisa Untuk Halaman Administrator ...................

4.3.3 Analisa Sistem Dalam Pemesanan Produk ..............

4.3.4 Perbandingan Tampilan Sistem Antar Peramban

(Browser) .................................................................

4.4 Hasil Pengujian Sistem ........................................................

BAB V PENUTUP

5.1 Kesimpulan ..........................................................................

5.2 Saran ....................................................................................

DAFTAR PUSTAKA

54 55 56 57 58 59 60 61 61 62 63 67 71 71 71 73

xii

DAFTAR GAMBAR

Gambar 3.1

Gambar 3.2

Gambar 3.3

Gambar 3.4

Gambar 3.5

Gambar 3.6

Gambar 3.7

Gambar 3.8

Gambar 3.9

Gambar 3.10

Gambar 3.11

Gambar 3.12

Gambar 3.13

Gambar 3.14

Gambar 3.15

Gambar 3.16

Gambar 3.17

Gambar 3.18

Gambar 3.19

Gambar 3.20

Gambar 4.1

Ikon WampServer2.1a-x32.exe ..............................................

Instalasi WampServer 2.1 .......................................................

Persetujuan WampServer 2.1 ..................................................

Lokasi instalasi WampServer 2.1 ...........................................

Pusat kontrol WampServer 2.1 ...............................................

Localhost WampServer 2.1 .....................................................

Hubungan antar tabel basis data .............................................

Tampilan halaman utama pengunjung ....................................

Tampilan halaman detail info produk .....................................

Tampilan halaman login administrator ...................................

Tampilan halaman utama administrator ..................................

Diagram Alir Data ..................................................................

Flowchart halaman utama .......................................................

Flowchart halaman home ........................................................

Flowchart halaman semua produk ..........................................

Flowchart pencarian kata ........................................................

Flowchart menampilkan konten statis ....................................

Flowchart keranjang belanja ...................................................

Flowchart hubungi kami .........................................................

Flowchart halaman administrator ...........................................

Tampilan halaman utama ........................................................

29

30

30

31

32

32

39

40

41

41

42

42

43

44

44

45

45

46

46

47

53

xiii

Gambar 4.2

Gambar 4.3

Gambar 4.4

Gambar 4.5

Gambar 4.6

Gambar 4.7

Gambar 4.8

Gambar 4.9

Gambar 4.10

Gambar 4.11

Gambar 4.12

Gambar 4.13

Gambar 4.14

Gambar 4.15

Gambar 4.16

Gambar 4.17

Gambar 4.18

Tampilan halaman semua produk ...........................................

Tampilan halaman pencarian ..................................................

Tampilan halaman detail info produk .....................................

Tampilan peringatan masih kosong ........................................

Tampilan halaman keranjang belanja .....................................

Tampilan halaman hubungi kami ...........................................

Tampilan halaman login administrator ...................................

Tampilan halaman menu administrator ..................................

Tampilan peringatan ...............................................................

Tampilan pemberitahuan sukses mengirim pesan ..................

Tampilan peringatan ...............................................................

Tampilan halaman menu administrator ..................................

Tampilan halaman utama dengan google chrome ..................

Tampilan halaman utama dengan firefox ...............................

Tampilan halaman utama dengan internet explorer ................

Penilaian pelanggan terhadap setiap pertanyaan .....................

Penilaian administrator terhadap setiap pertanyaan ................

54

55

56

57

58

59

60

60

61

61

62

62

64

65

66

69

70

xiv

xv

DAFTAR TABEL

Tabel 3.1

Tabel 3.2

Tabel 3.3

Tabel 3.4

Tabel 3.5

Tabel 3.6

Tabel 3.7

Tabel 3.8

Tabel 3.9

Tabel 3.10

Tabel 3.11

Tabel 4.1

Tabel 4.2

Tabel admins ..........................................................................

Tabel hubungi .........................................................................

Tabel kategori .........................................................................

Tabel kota ...............................................................................

Tabel mod_ym .......................................................................

Tabel modul ...........................................................................

Tabel orders ............................................................................

Tabel orders_detail .................................................................

Tabel orders_temp ..................................................................

Tabel produk ..........................................................................

Tabel statistik .........................................................................

Tabel data penelitian terhadap pengunjung ............................

Tabel data penelitian terhadap administrstor .........................

33

34

34

35

35

35

36

37

37

38

38

68

68

Surat Pernyataan Publikasi Karya Ilmiah

Bismillahirrohmanirrohim Yang bertanda Tangan dibawah ini, saya

Nama : Ayub Indra Perdana NIM : D 400 030 094 Fakultas/Jurusan : Teknik/Teknik Elektro Jenis : Skripsi Judul : PENGGUNAAN TEKNOLOGI INTERNET (E-

COMMERCE) DALAM MELAKUKAN TRANSAKSI PERDAGANGAN (STUDI KASUS DI COMPUSHOP PT. SOLO JALA BUANA)

Dengan ini menyatakan bahwa saya menyetujui untuk

1. Memberikan hak bebas royalty kepada pihak perpustakaan UMS atas penulisan karya ilmiah saya,demi pengembangan ilmu pengetahuan.

2. Memberikan hak menyimpan,mengalih mediakan/mengalih formatkan, mengelola dalam bentuk pangkalan data database), mendistribusikanya, serta menampilkanya dalam bentuk softcopy untuk kepentingan akademis perpustakaan UMS dengan meminta ijin kepada saya selama tetap mencantumkan nama saya sebagai penulis/pencipta.

3. Bersedia menjamin untuk menanggung secara pribadi tanpa melibatkan pihak perpustakaan UMS, dari semua bentuk tuntutan hukum yang timbul atas pelanggaran hak cipta dalam karya ilmiah ini.

Bersedia menjamin untuk menanggung secara pribadi tanpa melibatkan pihak perpustakaan UMS,dari semua bentuk tuntutan hukum yang timbul atas pelanggaran hak cipta dalam karya ilmiah ini. Demikian pernyataan ini saya buat dengan sesungguhnya dan semoga dapat digunakan sebagaimana mestinya. Surakarta,12 Maret 2011 Yang menyatakan Ayub Indra Perdana

BAB I

PENDAHULUAN

1.1 Latar Belakang

Perdagangan di era teknologi Internet, atau yang lebih dikenal

dengan istilah e-commerce (electronic commerce) akhir-akhir ini telah

marak dengan bermunculannya ribuan bahkan lebih perusahaan yang

menawarkan barang dagangannya melalui website. Perusahaan -

perusahaan ini seakan - akan berlomba untuk menjajakan barang

dagangannya melalui internet karena adanya peluang pasar yang begitu

besar. Pasar yang demikian besar yang terdapat pada komunitas internet

sangat sayang untuk dilewatkan begitu saja. Banyak para pelaku pasar

baru dari macam-macam produk telah melirik untuk masuk di dalam

bisnis di dunia maya ini dan mendirikan tokonya disini. Persaingan yang

ketat tentunya membuat para pelaku pasar berlomba-lomba untuk

menyediakan berbagai fasilitas dan kemudahan untuk melirik konsumen

memasuki website-nya dengan tujuan terakhir tentu saja untuk membeli

produk yang mereka jual. Salah satu fasilitas dan kemudahan yang

ditawarkan tentunya juga kemudahan para calon pembeli untuk menyusuri

data-data barang dan cara pemesanan. Para calon pembeli yang merasakan

bagaimana mudahnya menyelusuri serta memesan atau membeli melalui

website suatu perusahaan tertentu pasti akan sangat tertarik, atau paling

1

2

tidak mereka tidak segan-segan untuk mencoba kembali lagi bila mereka

hendak memesan barang.

Website (situs) yang nantinya akan berisi katalog barang yang

hendak dijual, dimana pengunjung toko dapat memesan barang yang

dikehendaki. Sistem katalog dan pemesanan barang yang digunakan

adalah sebuah aplikasi database yang terkoneksi ke sebuah server

database yang menggunakan database server MySQL dan bahasa scripting

PHP. Database yang dibuat memudahkan para user yang mengunjungi

situs ini untuk melihat -lihat data maupun memesan barang.

Dalam pelaksanaan tugas akhir ini akan dibuat suatu website yang

kurang lebih mempunyai fungsi yang sama dengan toko-toko biasa hanya

saja toko ini berada di internet dengan menggunakan MySQL sebagai

server databasenya dan PHP sebagai bahasa scriptingnya. Latar belakang

digunakannya MySQL sebagai server database yang utama karena MySQL

cukup cepat dan sangat banyak library serta contoh program yang dapat

digunakan. MySQL juga memiliki beberapa lapisan sekuritas seperti level

subnetmask, nama host, dan user. Kecepatan query MySQL bisa sepuluh

kali lebih cepat daripada Postgresql dan lima kali lebih cepat ketimbang

InterBase untuk query yang dilakukan oleh single user. MySQL

mendukung beberapa bahasa scripting yaitu : bahasa scripting C, Perl,

ASP, JSP dan PHP. Bahasa C adalah bahasa scripting untuk keperluan

umum jadi secara prinsipil bahasa C dapat digunakan untuk apa saja,

namun pada kenyataannya bahasa C lebih sering digunakan untuk program

3

yang berdiri sendiri dari pada pemrograman web. Satu alasan lain adalah

penggunaan bahasa C tidak semudah Perl atau PHP untuk pemrosesan teks

dan manajemen memori, sehingga lebih berat untuk digunakan pada

aplikasi web. Bahasa scripting Perl juga seperti Bahasa C, cocok untuk

penulisan program yang berdiri sendiri, tetapi Perl juga cukup berguna

untuk pengembangan website, seperti contohnya dalam penggunaan modul

CGI.pm. Hal ini yang membuat Perl sebagai bahasa yang cukup mudah

digunakan untuk penulisan aplikasi yang menghubungkan MySQL dengan

web, sedangkan bahasa scripting PHP memang didesain untuk penulisan

aplikasi web, maka jelas apabila PHP adalah yang paling cocok dalam hal

ini. Lebih jauh lagi akses database adalah salah satu kekuatan terbesar dari

PHP jadi pilihan cocok untuk aplikasi web yang berhubungan dengan

MySQL. Oleh karena latar belakang inilah maka disini digunakan PHP

sebagai bahasa scriptingnya.

Berdasarkan dari uraian diatas, maka saya menyimpulkan untuk

mengambil judul “Penggunaan Teknologi Internet (E-Commerce)

Dalam Melakukan Transaksi Perdagangan (Studi Kasus Di

CompuShop PT. Solo Jala Buana)“.

1.2 Rumusan Masalah

Sesuai dengan latar belakang yang telah dipaparkan, maka rumusan

masalah yang akan dikaji dalam penelitian ini adalah :

1. Bagaimana merancang dan membuat aplikasi e-commerce nya.

4

2. Bagaimana menerapkan sistem penjualan online di

CompuShop.

1.3 Tujuan Penelitian

Perancangan dan penelitian ini bertujuan untuk :

1. Merancang dan membuat aplikasi e-commerce pada

CompuShop.

2. Menerapkan sistem penjualan online di CompuShop.

1.4 Batasan Masalah

Agar dalam pembuatan website berbasis e-commerce ini dapat

mencapai sasaran dan tujuan yang diharapkan, maka permasalahan yang

ada dibatasi sebagai berikut :

1. Pembuatan website e-commerce menggunakan bahasa

pemrograman PHP.

2. Webserver menggunakan WampServer 2.0i. Merupakan

satu paket software yang didalamnya terdapat Apache

2.2.11, MySQL 5.1.36, dll.

3. Fasilitas untuk memasukkan produk-produk yang dijual.

4. Fasilitas untuk melihat rincian barang yang akan dibeli

melalui keranjang belanja.

5. Pengujian akan dilakukan secara online.

5

1.5 Manfaat Penelitian

Manfaat yang diharapkan dapat diperoleh dari Tugas Akhir ini

adalah :

1. Memudahkan dalam proses transaksi yang dapat dilakukan

kapan saja dan dimana saja selama masih terkoneksi

dengan jaringan internet.

2. Tersedianya e-commerce pada CompuShop.

3. Menambah pengetahuan penulis dalam pemrograman web.

1.6 Sistematika Penulisan

Tugas Akhir ini nantinya disusun dengan sistematika penulisan

sebagai berikut :

BAB I PENDAHULUAN

Bab ini membahas tentang latar belakang masalah,

perumusan masalah, tujuan tugas akhir, metode penelitian

yang digunakan untuk pembuatan tugas akhir dan sistematika

penulisan.

BAB II LANDASAN TEORI

Berisi mengenai teori penunjang dalam perancangan dan

pembuatan Tugas Akhir. Mulai dari E-Commerce, Konsep

Dasar Jaringan, Programming, Web Server dan Web

Browser, dsb.

6

BAB III PERANCANGAN DAN PEMBUATAN SISTEM

Membahas langkah dari proses perancangan dan pembuatan

sistem.

BAB IV PENGUJIAN SISTEM

Menunjukkan bentuk pengujian dan hasil pengujian dari

perancangan aplikasi e-commerce disertai dengan analisa

sehingga didapatkan bukti kuat dari hipotesis yang dilakukan.

BAB V PENUTUP

Menguraikan kesimpulan Tugas Akhir dan saran-saran

sebagai bahan pertimbangan untuk pengembangan penelitian

selanjutnya.

BAB II

LANDASAN TEORI

2.1 Data

Data sering disebut sebagai bahan mentah informasi. Tapi menurut

Murdick,dkk (1984) merumuskan bahwa data adalah fakta yang tidak

sedang digunakan pada proses keputusan, biasanya dicatat dan diarsipkan

tanpa maksud untuk segera diambil kembali untuk pengambilan

keputusan. Menurut Zulkifli Amsyah (1987) data adalah fakta yang sudah

ditulis dalam bentuk catatan atau direkam ke dalam berbagai bentuk media

(Gultom et al, 2005).

Dalam dunia usaha dewasa ini, pengaruh data dan informasi dapat

dikatakan sangat memegang peranan penting. Adapun istilah data adalah

suatu istilah majemuk dari datum yang berarti fakta atau bagian dari fakta

yang mengandung arti, yang berhubungan dengan kenyataan, simbol-

simbol, gambar-gambar, kata-kata, angka-angka, huruf-huruf atau simbol-

simbol yang menunjukkan ide, objek, kondisi atau situasi. Jelasnya data itu

dapat berupa apa saja dan dapat ditemui dimana saja. Kegunaan data

adalah sebagai bahan dasar yang objektif dalam proses penyusunan

kebijakan dan keputusan. Dalam kaitannya dengan pengolahan data

dengan komputer, pengerian data dapat dibatasi pada fakta-fakta yang

dapat direkam. Dalam setiap pengolahan data, data merupakan sumber

informasi yang dapat dihasilkan.

7

8

2.2 Sistem

Terdapat dua kelompok pendekatan dalam mendefinisikan sistem,

yaitu yang menekankan pada prosedurnya dan yang menekankan pada

komponen atau elemennya. Suatu sistem adalah suatu jaringan kerja untuk

melakukan suatu kegiatan atau untuk menyelesaikan suatu sasaran

tertentu. Sedangkan pengertian prosedur itu sendiri menurut Richard F.

Neuschel, prosedur suatu urutan- operasi klerikal (tulis menulis), biasanya

melibatkan beberapa orang dalam satu atau lebih departemen, yang

diterapkan untuk menjamin penanganan yang seragam dari transaksi-

transaksi bisnis yang terjadi. (Yogianto, 1989).

2.2.1 Karakteristik Sistem

Suatu sistem mempunyai karakteristik atau sifat-sifat yang

tertentu, yaitu mempunyai komponen-komponen (components),

sistem data (boundary), lingkungan luar sistem (environments),

penghubung (interface), masukan (input), keluaran (output),

pengolahan (proses) dan sasaran (objectives) atau tujuan (goal).

Komponen-komponen sistem atau elemen-elemen sistem dapat

berupa suatu subsistem atau bagian-bagian dari sistem. Batasan

sistem merupakan daerah yang membatasi antara suatu sistem

dengan sistem yang lainnya atau dengan lingkungan luarnya.

Lingkungan luar dari suatu sistem adalah apapun diluar dari batas

sistem yang mempengaruhi operasi sistem. Penghubung

merupakan media penghubung antara suatu subsistem dengan

9

subsistem yang lainnya. Keluaran dari suatu subsistem akan

menjadi masukan untuk subsistem yang lainnya dengan melalui

penghubung. Masukan adalah energi yang dimasukkan ke dalam

sistem dapat berupa masukan perawatan dan masukan sinyal.

Masukan perawatan dimasukkan supaya sistem dapat beroperasi

sedangkan sinyal untuk mendapatkan keluaran. Keluaran adalah

hasil dari energi yang diperoleh dan diklasifikasikan menjadi

keluaran yang berguna dari sisi pembuangan. Suatu sistem dapat

mempunyai suatu bagian pengolah yang akan merubah masukan

menjadi keluaran. Suatu sistem pasti mempunyai tujuan atau

sasaran. Kalau suatu sistem tidak mempunyai sasaran, maka

operasi sistem tidak akan ada gunanya. Sasaran dari sistem sangat

menentukan sekali masukan yang dibutuhkan sistem dan keluaran

yang dihasilkan sistem (Yogianto, 1989).

2.3 Informasi

Informasi adalah data yang dibentuk menjadi bentuk yang lebih

berguna dan lebih berarti bagi penerimanya. (Yogianto, 1989). Menurut

George R. Terry, bahwa informasi adalah data yang memberikan

pengetahuan yang berguna. Sedangkan menurut Gordon B. Davis

informasi adalah suatu data yang lebih diolah menjadi sebuah bentuk yang

penting bafi penerima dan mempunyai nilai yang nyata atau yang dapat

dirasakan dalam keputusan-keputusan yang sekarang atau yang akan

10

datang. Informasi akan memiliki arti manakala informasi tersebut memiliki

unsur-unsur sebagai berikut :

1. Relavan artinya informasi yang diinginkan benar-benar ada

relevansi dengan masalah yan dihadapi.

2. Kejelasan artinya terbebas dari istilah-istilah yang

membingungkan.

3. Akurasi artinya bahwa informasi yang hendak disajikan harus

secara teliti dan lengakp.

4. Tepat waktu artinya data yang disajikan adalah data terbaru

dan mutakhir.

2.3.1 Kualitas Informasi

Kualitas dari suatu sistem informasi (quality of information)

tergantung dari 3 hal, yaitu informasi harus akurat (accurate),

tepat pada waktunya (timeliness) dan relevan (relevance). Yang

dimaksud dengan akurat berarti informasi harus bebas dai

kesalahan-kesalahan dan tidak bisa atau menyesatkan. Sedangkan

tepat waktu berarti, informasi yang datang pada penerima tidak

boleh terlambat, dan yang terakhir relevan, berarti informasi

tersebut mempunyai manfaat untuk pemakainya. (Yogiyanto,

1989).

2.4 Penjualan

Penjualan adalah suatu sistem keseluruhan dari kegiatan usaha

yang ditujukan untuk merencanakan, menentukan harga, mempromosikan

11

dan mendistribusikan barang, jasa, ide kepada pasar sasaran agar dapat

mencapai tujuan organisas (Basu Swastha, 1989).

2.5 Sistem Informasi

Sistem informasi adalah suatu sistem di dalam suatu organisasi

yang mempertemukan kebutuhan pengolahan transaksi harian, mendukung

operasi, bersifat manajerial dan kegiatan strategi dari suatu organisasi dan

menyediakan pihak luar tertentu dengan laporan-laporan yang diperlukan

(Yogiyanto, 1989). Menurut Simkin Mark G dalam bukunya yang berjudul

“computer information system for bussiness”, sistem informasi adalah

sekumpulan elemen yang bekerja secara bersama-sama baik secara manual

ataupun berbasis komputer dalam melaksanakan pengolahan data yang

berupa pengumpulan, penyimpanan, pemrosesan data untuk menghasilkan

informasi yang bermakna dan berguna bagi proses pengambilan

keputusan. Menurut Burch dan Strater dalam bukunya “information

system : theory and practice”, sistem informasi adalah suatu kumpulan

fungsi-fungsi yang bergabung secara formal dan sistematis yaitu :

1. Melaksanakan pengolahan data transaksi operasional.

2. Menghasilkan informasi untuk mendukung manajemen

dalam melaksanakan aktifitas perencanaan, pengendalian

dan pengambilan keputusan.

3. Menghasilkan berbagai laporan bagi kepentingan eksternal

organisasi.

12

Dari definisasi diatas terlihat bahwa sistem informasi merupakan

satu kesatuan unsur (manusia dan peralatan) yang bekerjasama secara

untuk melaksanakan pengolahan informasi dari mulai mengumpulan,

pengolahan, penyimpangan sampai pendistribusiannya.

2.6 Internet

Internet adalah jaringan luas dari komputer, yang lazim disebut

dengan worldwide network. Dengan internet maka anda akan dapat

mencari jutaan infomasi, mulai dari informasi kota-kota dunia,

pemerintahan, budaya, teknologi, pribadi, berita (majalah dan koran dari

seluruh dunia), software komputer, iklan-iklan perusahaan dari seluruh

dunia, iklan-iklan pribadi, informasi barang-barang terbaru dan lain-lain.

Selain itu internet juga bisa digunakan untuk mencari teman, kontak jodoh,

megirim berita, alat komunikasi, alat hiburan seperti game dan lain-lain.

Internet terdiri dari berjuta-juta halaman, dan setiap halaman disebut

dengan web. Sedangkan halaman yang pertama kali muncul ketika anda

membuka browser (Internet Explorer atau Netscape Communication)

disebut dengan Homepage. Tetapi web sering juga disebut dengan website

atau homepage. Contoh-contoh web (WEBSITE/HOMEPAGE):

1. http://www.yahoo.com

2. http://www.detik.com

3. http://www.ilmukomputer.com

Web browser adalah suatu program atau perangkat lunak yang

digunakan untuk mengakses internet, contoh web browser adalah internet

13

explorer (produk Microsft Corporation), Netscape communicator (Produk

Netscape) dan lain-lain.

2.7 HTML (HyperText Markup Language)

HyperText Markup Language merupakan kepanjangan dari kata

HTML. HTML sendiri adalah suatu dokumen teks biasa yang mudah

dimengerti dibanding bahasa pemrograman lainnya, dan karena bentuknya

itu maka HTML dapat dibaca oleh berbagai platform seperti : Windows,

Linux, Macintosh. Kata “Markup Language” pada HTML menunjukkan

fasilitas yang berupa tanda tertentu dalam skrip HTML yang bisa

digunakan untuk mengatur judul, garis, tabel, gambar, dan lain-lain dengan

perintah yang telah ditentukan pada elemen HTML. HTML sendiri

dikeluarkan oleh W3C (World Wide Web Consortin), setiap terjadi

perkembangan level HTML, harus dievakuasi ketat dan disetujui oleh

W3C.

2.7.1 Bagian-Bagian HTML

HTML terdiri dari beberapa bagian yang fungsinya sebagai

penanda suatu kelompok perintah tertentu, misalnya kelompok

perintah form yang ditandai dengan kode <form>, judul dengan

<title>dan sebagainya. Untuk lebiih lanjut mengenai bagian-bagian

HTML perhatian skema dibawah ini :

14

<html> <head>

<title>Judul halaman</title> </head> <body>

..isi dari halaman web.. </body>

</html> Keterangan :

1. Dokumen HTML, selalu diawali dengan tanda

pembuka <html> dam diakhiri dengan tanda tag

penutup </html>.

2. Pada elemen head <head></head>, dapat disisipkan

kode-kode untuk menuliskan keterangan tentang

dokumen HTML, atau dapat juga disisipi script-

script pemrograman web seperti JavaScript,

VBScript atau CSS untuk menambahkan daya tarik

pada situs yang dibuat agar lebih menarik dan

dinamis.

3. Elemen body <body></body> berisi tag-tag untuk

isi atau layout tampilan situs, seperti :

<font></font>,<table></table>,<form></form>.

4. Jadi jelas bahwa elemen adalah suatu bagian yang

besar yang terdiri dari kode-kode tag tersebut.

Sedangkan tag hanyalah merupakan bagain dari

elemen. Tag adalah kode-kode yang digunakan

untuk mengatur dokumen HTML. Secara garis besar

15

bentuk umum tag adalah sebagai berikut : <tag

awal> TEKS <tag akhir> Namun ada juga tag yang

tidak perlu ada penutup seperti <br>, <hr>, <img>,

dan lain-lain.

2.8 PHP (PHP: Hypertext Preprocessor)

PHP adalah bahasa pemrograman web atau scripting language

yang didesain untuk web. PHP dibuat pertama kali oleh satu orang yaitu

Rasmus Lerdorf, yang pada awalnya dibuat untuk menghitung jumlah

pengunjung pada homepagenya. Pada waktu itu PHP bernama FI (Form

Interpreter). Pada saat tersebut PHP adalah sekumpulan script yang

digunakan untuk mengolah data form dari web. Perkembangan selanjutnya

adalah Rasmus melepaskan kode sumber tersebut dan menamakannya

PHP/FI, pada saat tersebut kepanjangan dari PHP/FI adalah Personal

Home Page/Form Interpreter. Pelepasan kode sumber ini menjadi open

source, maka banyak programmer yang tertarik untuk ikut

mengembangkan PHP.

Pada tahun 1997 sebuah perusahaan bernama Zend, menulis ulang

interpreter PHP menjadi lebih bersih, lebih baik dan lebih cepat.

Kemudian pada Juni 1998 perusahaan tersebut merilis interpreter baru

untuk PHP dan meresmikan nama rilis tersebut menjadi PHP 3.0. Pada

pertengahan tahun 1999, Zend merilis interpreter PHP baru dan rilis

tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah versi PHP yang paling

banyak dipakai. Versi ini banyak dipakai sebab versi ini mampu dipakai

16

untuk membangun aplikasi web kompleks tetapi tetap memiliki kecepatan

proses dan stabilitas yang tinggi. Pada Juni 2004 Zend merilis PHP 5.0.

Versi ini adalah versi mutakhir dari PHP. Dalam versi ini, inti dari

intpreter PHP mengalami perubahan besar. Dalam versi ini juga

dikenalkan model pemograman berorientasi objek baru untuk menjawab

perkembangan bahas pemograman kearah pemograman kearah

pmograman berorientasi objek.

2.9 Penggabungan PHP dan HTML

Bahasa pemrograman PHP dapat digabungkan dengan HTML

dengan terlebih dahulu memberikan tanda tag buka dilanjutkan tanda tanya

dan text “php” (<?php) kemudian ditutup dengan tanda tanya dilanjutkan

tanda tag tutup (?>). Ada dua tipe penggabungan antara PHP dan HTML,

yaitu :

2.9.1 Embedded Script

Yakni penulisan tag PHP di sela-sela tag HTML. Dengan

cara ini, penulisan tag PHP digunakan untuk mengapit bagian-

bagian tertentu dalam dokumen yang memerlukan script PHP

untuk proses di dalam server. Embedded Script menempatkan

sebagai bagian dari script HTML. Contoh penulisan dapat dilihat

di bawah ini :

<html> <head>

<title> Testing</title> </head> <body>

<?php echo “test123”; ?>

17

</body> </html>

2.9.2 Non Embedded Script

Cara penulisan tag PHP dibagian paling awal dan paling

akhir dokumen. Dengan cara ini, penulisan tag PHP digunakan

untuk mengawali dan mengakhiri keseluruhan bagian dalam

sebuah dokumen. Non Embedded Script HTML sebagai bagian

dari script PHP. Contoh penulisan dapat dilihat dibawah ini :

<?php echo ‘<html>’; echo ‘<head>’; echo ‘<title>Testing</title>; echo ‘</head><body>’; echo ‘Hallo World’; echo ‘ </body>’; echo ‘</html>’; ?>

2.10 CSS (Cascading Style-Sheet)

CSS adalah singkatan dari Cascading Style-Sheet, sebuah

pengembangan atas kode HTML yang sudah ada sebelumnya. CSS bisa

sangat membantu dalam menentukan sebuah struktur dasar halaman web

secara lebih mudah dan cepat, serta irit ukuran. Cara mudah untuk

menerangkan CSS adalah dengan memberikan contoh berikut. Kode di

bawah ini sebagai contoh, kode ini dimasukkan dibagian head halaman

web karena setiap client web anda akan dapat melihat style sheets web itu.

<style type = “text/css”> <!—

BODY { background-color: white; color: black ;

18

font-family: Arial, Helvetica, sans-serif; }

--> </style> Kode di atas akan membuat halaman anda mempunyai latar

belakang putih dan teks berwarna hitam. Teks pada BODY akan

menggunakan font Arial, Helvetica, ataupun jika tidak terdapat kedua-

duanya, ia akan menggunakan typeface/font Sans-serif.

Pada perkembangannya CSS sudah masuk level 3 untuk sekarang,

dimana dimulai CSS level 1 atau yang sering disebut CSS saja, kemudian

level 2 yang merupakan alternatif bahasa pemrograman web masa yang

akan datang, dimana mempunyai banyak keuntungan, diantaranya :

1. Ukuran file lebih kecil.

2. Load file lebih cepat.

3. Dapat berkolaborasi dengan JavaScript.

4. Pasangan setia XHTML.

5. Menghemat pekerjaan tentunya, dimana hanya membuat 1

halaman CSS.

6. Mudah mengganti-ganti tampilan dengan hanya merubah

file CSS-nya saja.

2.11 Javascript

Javascript merupakan modifikasi dari bahasa c++ dengan pola

penulisan yang lebih sederhana. Interpreter bahasa ini sudah disediakan

19

ASP ataupun internet explorer. Secara khusus beberapa hal yang penting

dalam javascript adalah :

1. Mengunakan blok awal “{“ dan blok akhir :}”

2. Automatic conversion dalam pengoperasian tipe data yang

berbeda.

3. Sensitive case, sehingga programmer java harus ekstra hati-

hati dalam menggunakan nama variabel, fungsi dan lain-

lain.

4. Ekstention umumnya menggunakan “*.js”

5. Setiap statement dapat diakhiri dengan “,” sebagaimana c++

tetapi dapat juga tidak.

6. Jika tidak didukung oleh browser versi lama, scriptnya

dapat disembunyikan diantara tag “<!--“ dan “-- >”.

7. Jika program dalam satu baris terlalu panjang dapat

disambung dengan karakter “\”.

Seperti CSS yang menggunakan tag :

<style></style>

Javascript menggunakan tag :

<script></script>

Tag ini boleh diletakkan beberapa kali di dalam sebuah dokumen,

sama seperti tag-tag HTML yang lain.

20

<html> <head> <script language =”javascript”>  </script> </head> <body> <script language=”javascript”>  </script> </body> </html> Anda boleh meletakkan kode javascirpt pada bagian HEAD atau

BODY. Terdapat beberapa keadaan dimana javascript digunakan sebagai

skrip luar yang mana file tersebut ditulis dan disimpan dalam format “js”.

File ini boleh dipanggil menggunakan attribute “src”.

<html> <head></head> <body>

<script src = “namafile.js”> </script>

</body> </html>

2.11.1 Kelebihan Javascript

Javascript berinteraksi dengan HTML, ini membolehkan

pembuat web untuk memasukkan web mereka dengan

kandungan-kandungan yang dinamik, menukar warna

background, menukar banner, efek mouse, menu interaktif dan

sebagainya.

2.12 Basis Data

Basis data adalah suatu kumpulan data komputer yang teintegrasi,

diorganisasikan dan disimpan menurut cara yang memudahkan

21

pengambilan kembali. Tujuan utama konsep basis data adalah

meminimumkan pengulangan (Gultom et al, 2005).

2.12.1 MySQL

MySQL merupakan salah satu perangkat lunak sistem

pengelola basis data (Data Base Management System). MySQL

juga dapat dikategorikan sebagai Relational Data Base

Management System (RDBMS), karena dalam pembuatan basis

data pada MySQL dapat dipilah-pilah ke dalam berbagai tabel 2

(dua) dimensi. Setiap tabel pada MySQL terdiri atas lajur

horizontal dan lajur vertical.

MySQL pada saat ini, banyak digunakan oleh pemrograman

web untuk membangun situs yang memerlukan basis data sebagai

data dan pengolahan data.

2.13 Web Server

Web server adalah software yang menjadi tulang belakang dari

world wide web (www). Web server menunggu permintaan dari client yang

menggunakan browser seperti Google Chrome, Netscape Navigator,

Internet Explorer, Mozilla, dan program browser lainnya. Jika ada

permintaan dari browser, maka web server akan memproses permintaan

itu kemudian memberikan hasil prosesnya berupa data yang diinginkan

kembali ke browser. Data ini mempunyai format yang standar, disebut

dengan format SGML (Standar General Markup Language). Data yang

berupa format ini kemudian akan ditampilkan oleh browser sesuai dengan

22

kemampuan browser tersebut. Contohnya, bila data yang dikirim berupa

gambar, browser yang hanya mampu menampilkan teks (misalnya lynx)

tidak akan mampu menampilkan gambar tersebut, dan jika ada akan

menampilkan alternatifnya saja. Web server, untuk berkomunikasi dengan

client-nya (web browser) mempunyai protokol sendiri, yaitu HTTP

(hypertext transfer protocol). Dengan protokol ini, komunikasi antar web

server dengan client-nya dapat saling dimengerti dan lebih mudah. Seperti

telah dijelaskan diatas, format data pada world wide web adalah SGML.

Tapi para pengguna internet saat ini lebih banyak menggunakan format

HTML (hypertext markup language) karena penggunaannya lebih

sederhana dan mudah dipelajari. Kata HyperText mempunyai arti bahwa

seorang pengguna internet dengan web browsernya dapat membuka dan

membaca dokumen-dokumen yang ada dalam komputernya atau bahkan

jauh tempatnya sekalipun. Hal ini memberikan cita rasa dari suatu proses

yang tridimensional, artinya pengguna internet dapat membaca dari satu

dokumen ke dokumen yang lain hanya dengan mengklik beberapa bagian

dari halaman-halaman dokumen (web) itu.

Proses yang dimulai dari permintaan web client (browser), diterima

web server, diproses, dan dikembalikan hasil prosesnya oleh web server ke

web client lagi dilakukan secara transparan. Setiap orang dapat dengan

mudah mengetahui apa yang terjadi pada tiap-tiap proses. Secara garis

besarnya web server hanya memproses semua masukan yang diperolehnya

dari web clientnya.

23

2.13.1 Apache

Apache merupakan web server yang paling banyak

dipergunakan di Internet. Program ini pertama kali didesain untuk

sistem operasi lingkungan UNIX. Namun demikian, pada

beberapa versi berikutnya Apache mengeluarkan programnya

yang dapat dijalankan di Windows NT. Berdasarkan sejarahnya,

Apache dimulai oleh veteran developer NCSA httpd (National

Center for Supercomputing Application). Saat itu pengembangan

NCSA httpd sebagai web server mengalami stagnasi. ROB MC

COOL meninggalkan NCSA dan memulai sebuah proyek baru

bersama para webmaster lainnya, menambal bug, dan

menambahkan fitur pada NCSA httpd. Mereka mengembangkan

program ini lewat mailing list. Dengan berpijak pada NCSA httpd

versi 1.3, Team Apache mengeluarkan rilis pertama kali secara

resmi Apache versi 0.6.2. Nama Apache diambil dari kata "A

Patchy Server", server perbaikan yang penuh dengan tambalan

(patch). Tambalan yang dimaksud adalah penambahan fitur dan

penambalan bug dari NCSA httpd Versi 1.3.

Saat ini Apache dipergunakan secara luas. Hal ini

disebabkan karena programnya yang gratis, dengan kinerja relatif

stabil. Dalam pengembangannya pun mempergunakan sistem

Bazaar, yakni tiap orang dibuka kesempatan seluas-luasnya untuk

dapat memberikan kontribusi dalam mengembangkan program.

24

Kontribusi dikomunikasikan lewat mailing list. Tim Apache

mempunyai mailing list yang terbuka untuk siapa saja yang ingin

ambil bagian. Untuk mendaftar cukup kirim email ke

[email protected] dengan baris pertama dari email

bertuliskan "subscribe newhttpd". Perlu dicatat bahwa proyek

pengembangan Apache ini mempunyai sistem meritokrasi.

Semakin banyak yang Anda sumbangkan, semakin banyak yang

boleh dikerjakan.

BAB III

PERANCANGAN DAN PEMBUATAN SISTEM

3.1 Perancangan Sistem

Demi terciptanya keselarasan dalam pemanfaatan, pembangun

sistem diwajibkan mengerti dan memahami konsep dasar sistem penjualan

yang sedang berlaku saat ini. Sehingga dapat memberikan kemudahan dan

kenyaman bagi pelanggan untuk melakukan pembelian pada toko

khususnya CompuShop. Untuk memaksimalkan sistem, maka hak akses

dalam sistem ini hanya akan dibagi menjadi dua jenis hak akses, yaitu :

3.1.1 Administrator

Administrator mempunyai hak yang paling besar. Seorang

administrator dapat memasukkan informasi maupun mengedit ke

dalam sistem.

3.1.2 Pengunjung (Calon pembeli)

Pengunjung (calon pembeli) dapat melihat informasi pada

situs ini sekaligus dapat langsung melakukan pembelanjaan tanpa

perlu mendaftarkan diri.

3.2 Implementasi Perancangan

Setelah tahap perancangan selesai penulis melanjutkan ke langkah

implementasi perancangan. Perancangan sistem ini dilakukan dengan

menggunakan laptop Dell Inspiron 1318 dengan sistem operasi Windows

25

26

Vista Home Basic dan beberapa perangkat lunak lainnya dengan rincian

sebagai berikut :

Perangkat keras yang dipergunakan adalah :

1. Pembuat Sistem : Dell Inc.

2. Model Sistem : Inspiron 1318

3. Versi BIOS : Phoenix ROM BIOS PLUS Version 1.10

A06

4. Prosesor : Intel(R) Core(TM)2 Duo CPU T5800 @

2.00GHz (2 CPUs), ~2.0GHz

5. Memori : 2038MB

6. Kartu Grafis : Mobile Intel(R) 965 Express Chipset

Family

7. Dll.

Perangkat lunak yang dipergunakan adalah :

1. Sistem Operasi. Penulis menggunakan sistem operasi

Windows Vista™ Home Basic (6.0, Build 6002) Service

Pack 2 (6002.vistasp2_gdr.101014-0432).

2. Notepad++ berguna sebagai text editor. Notepad++

memiliki fitur yang banyak sehingga memudahkan penulis

dalam pembuatan sistem.

3. MySQL sebagai bahasa pemrograman untuk database

dalam bahasa SQL (Structured Query Language) yang

digunakan dalam mengelola basis data.

27

4. PHP sebagai bahasa pemrograman server side, dapat

membuat perintah query pada pemrogramannya seperti

perintah dasar SQL.

5. Web Server sebagai server lokal dalam pengetesan halaman

web sebelum file-file dan script web dipublikasikan pada

internet, seperti PWS (Personal Web Server) atau Apache

Web Server seperti yang digunakan penulis.

6. Browser sebagai tempat melihat output atau tampilan

halaman web, misal Google Chrome, Internet Explorer,

Mozilla Firefox, Netscape Navigator, dll.

3.3 Instalasi dan Konfigurasi Sistem

3.3.1 Instalasi Apache, PHP dan MySQL

Sebelum dapat membuat ataupun melihat hasil kerja,

langkah awal yang harus dilakukan adalah mengintalasi beberapa

perangkat lunak pendukung, yaitu Apache, PHP, dan MySQL.

Penginstalasiannya dilakukan secara satu per satu. Perangkat

lunaknya dapat diperoleh dari situs http://www.apache.org untuk

Apache,. http://www.php.net untuk PHP, dan

http://www.mysql.com untuk MySQL. Tahap instalasinya dimulai

dengan menginstalasi Apache, kemudian disusul dengan

menginstalasi PHP dan MySQL. Setelah instalasi selesai

dilanjutkan dengan melakukan pengaturan konfigurasi yang

diberikan setelah instalasi selesai. Namun hal ini memerlukan

28

pengaturan yang sedikit rumit. Alternatif lain yang digunakan

penulis adalah dengan menginstalasi WampServer Versi 2.1.

WampServer merupakan salah satu paket perangkat lunak web

server yang dapat diinstal di Windows. WAMP adalah

kepanjangan dari Windows - Apache – MySQL - PHP5.

Perangkat lunak WampServer versi 2.1 dapat di unduh

secara gratis pada situs http://www.wampserver.com. Perangkat

lunak ini dibutuhkan sebagai :

1. Server web. Di dalam paket WampServer terdapat

aplikasi Apache Web Server. Server Web adalah

sebuah program yang berfungsi sebagai penerima

dan mengolah permintaan browser web. Kode

pemrograman server side seperti script PHP, dikirim

dan dijalankan pada server, kemudian Server Web

mengirimkan hasilnya pada komputer klien dan

klien hanya dapat menerima hasilnya saja.

2. PHP. Pada paket WampServer ini juga dapat

ditemui aplikasi PHP sebagai program

pengeksekusian script PHP.

3. MySQL. Paket WampServer juga menyediakan

aplikasi MySQL sebagai tempat penampungan dan

penyimpanan data dari database.

29

4. WampServer bisa menyediakan 3 aplikasi

pendukung sekaligus dan sangat mudah dalam

melakukan penginstalan tanpa perlu lagi melakukan

konfigurasi yang rumit terhadap ketiga aplikasi

tersebut.

3.3.1.1 Instalasi WampServer

Menginstal WampServer secara otomatis

menginstal ketiga perangkat lunak utama yang akan

digunakan pada pembangunan web penjualan online

yaitu Apache, PHP, dan MySQL, tanpa perlu konfigurasi

yang rumit, serta dalam pengetesan ataupun untuk

melihat hasil halaman web.

Adapun tahap-tahap instalasinya adalah sebagai

berikut :

1. Klik ganda file “WampServer2.1a-x32.exe”.

Gambar 3.1 Ikon WampServer2.1a-x32.exe

30

2. Klik tombol next.

Gambar 3.2 Instalasi WampServer 2.1

3. Pilih “I Accept the agreement” untuk menerima

persetujuan, lalu klik tombol next.

Gambar 3.3 Persetujuan WampServer 2.1

4. Melokasikan letak instalasi WampServer. Penulis

menyarankan agar letak instalasi tidak perlu dirubah,

lalu klik tombol next.

31

Gambar 3.4 Lokasi instalasi WampServer 2.1

5. Tunggu proses instalasi sampai selesai. Proses ini

memerlukan waktu yang cukup lumayan lama.

3.3.1.2 Menjalankan WampServer

Setelah proses instalasi selesai, langkah

selanjutnya ialah menjalankan WampServer. Jalankan

aplikasi WampServer dengan klik ganda icon

WampServer yang ada di desktop, sehingga muncul icon

tray pada taskbar. Secara otomatis Apache dan MySQL

telah aktif. Klik kiri pada icon tersebut untuk mengatur

WampServer, dari sana anda bisa membuka localhost,

folder situs-situs anda, setting Apache, PHP, MySQL.

32

Gambar 3.5 Pusat kontrol WampServer 2.1

Gambar 3.6 Localhost WampServer 2.1

Setelah dapat menggunakan WampServer, lalu

aktifkan modul rewrite_modul dengan cara klik kiri pada

icon tray WampServer pilih Apache > Apache Modules,

centang pada rewrite_modul.

33

3.4 Struktur Basis Data

Basis data dapat diumpamakan sebagai sebuah tempat

penyimpanan data yang terstruktur agar dapat diakses dengan cepat dan

mudah. Membangun sebuah basis data merupakan langkah awal

pembuatan aplikasi, termasuk aplikasi yang akan dibuat di sini.

Dalam perancangan web CompuShop ini, penulis membuat 11

(sebelas) tabel dalam basis data compushop, berikut daftar serta fungsi

masing-masing tabel yang dibuat :

1. Tabel admins

Tabel admin digunakan untuk menampung data dari

admin pada web ini. Berikut ini adalah field-field yang

dibuat dalam tabel admin beserta keterangannya.

Tabel 3.1 Tabel admins

Field Name Tipe data Ukuran Keterangan

username varchar 50 username * password varchar 50 password

nama_lengkap varchar 100 nama pemegang akun email varchar 100 alamat email no_telp varchar 20 nomor telepon level varchar 20 hak akses blokir enum ‘Y’,’N’ status akun

* Primary key

2. Tabel hubungi

Tabel hubungi digunakan untuk menampung dan

menyimpan data dari form hubungi kami. Berikut ini adalah

field-field yang dibuat dalam tabel hubungi beserta

keterangannya.

34

Tabel 3.2 Tabel hubungi


id_hubungi int 5 id pesan * nama varchar 50 nama pengirim email varchar 100 email pengirim pesan subjek varchar 100 subjek pesan pesan text isi pesan tanggal date tanggal pesan dikirim

* Primary key

3. Tabel kategori

Tabel kategori digunakan untuk menampung dan

menyimpan data berbagai kategori produk yang natinya

akan mengelompokkan produk berdasarkan kategori.

Berikut ini adalah field-field yang dibuat dalam tabel

kategori beserta keterangannya.

Tabel 3.3 Tabel kategori


id_kategori int 5 id kategori* nama_kategori varchar 100 nama kategori kategori_seo varchar 100 url kategori * Primary key

4. Tabel kota

Tabel kota digunakan untuk menyimpan data tarif

pengiriman pesanan dari ke berbagai kota. Berikut ini

adalah field-field yang dibuat dalam tabel kota beserta

keterangannya.

35

Tabel 3.4 Tabel kota


id_kota int 3 id kota * nama_kota varchar 100 nama kota

ongkos_kirim int 10 ongkos kirim * Primary key

5. Tabel mod_ym

Tabel mod_ym berfungsi untuk menyimpan alamat

akun yahoo messenger. Berikut ini adalah field-field yang

dibuat dalam tabel mod_ym beserta keterangannya.

Tabel 3.5 Tabel mod_ym


id int 11 id akun * nama varchar 255 nama akun

username varchar 50 username akun * Primary key

6. Tabel modul

Tabel modul berguna untuk menyimpan keterangan

mengenai modul yang akan digunakan. Berikut ini adalah

field-field yang dibuat dalam tabel modul beserta

keterangannya.

Tabel 3.6 Tabel modul


id_modul int 5 id modul * nama_modul varchar 50 nama modul

link varchar 100 url modul static_content text isi dari url

gambar varchar 100 nama gambar status enum ‘user’,’admin’ level modul aktif enum ‘Y’,’N’ status modul urutan int 5 nomor urut modul

* Primary key

36

7. Tabel orders

Tabel orders digunakan untuk menampung dan

menyimpan data jumlah item, harga, total harga, dan lain-

lain. Berikut ini adalah field-field yang dibuat dalam tabel

orders beserta keterangannya.

Tabel 3.7 Tabel orders


id_orders int 5 id pesanan * nama_kustomer varchar 100 nama pembeli

alamat text alamat pembeli telpon varchar 20 nomor telpon pembeli email varchar 50 email pembeli

status_order varchar 50 status pesanan tgl_order date tanggal pesan jam_order time jam pesan id_kota int 5 id kota tujuan pengiriman

** nama_shipping varchar 100 nama tujuan pengiriman alamat_shipping text alamat tujuan pengiriman telpon_shipping varchar 20 nomor telpon tujuan

pengiriman * Primary key ** Foreign key

8. Tabel orders_detail

Tabel orders_detail berguna untuk menampung detail

pesanan dari nomor pesanan yang sudah di buat. Berikut ini

adalah field-field yang dibuat dalam tabel orders_detail

beserta keterangannya.

37

Tabel 3.8 Tabel orders_detail


id_orders int 5 id pesanan ** id_produk int 5 id produk ** jumlah int 5 jumlah pesanan per id produk

** Foreign key

9. Tabel orders_temp

Tabel orders_temp digunakan untuk menyimpan dan

menampung data barang pesanan yang akan dibeli. Berikut

ini adalah field-field yang dibuat dalam tabel orders_temp

beserta keterangannya.

Tabel 3.9 Tabel orders_temp


id_orders_temp int 5 id pesanan sementara * id_produk int 5 id produk ** id_session varchar 100 id session jumlah int 5 jumlah pesanan per id produk

tgl_order_temp date tanggal pemasukan produk jam_order_temp time jam pemasukan produk

stok_temp int 5 jumlah stok produk sementara * Primary key ** Foreign key

10. Tabel produk

Tabel produk digunakan untuk menampung dan

menyimpan semua data produk dan akan dihubungkan

dengan kategori. Berikut ini adalah field-field yang dibuat

dalam tabel order beserta keterangannya.

38

Tabel 3.10 Tabel produk


id_produk int 5 id produk * id_kategori int 5 id kategori ** nama_produk varchar 100 nama produk produk_seo varchar 100 url produk deskripsi text keterangan produk harga int 20 harga produk stok int 5 jumlah stok produk berat decimal 5,2 berat produk

tgl_masuk date tanggal pemuatan produk gambar varchar 100 nama file gambar produk dibeli int 5 jumlah produk yang telah dibeli

* Primary key ** Foreign key

11. Tabel statistik

Tabel statistik berguna untuk menyimpan informasi

dari pengunjung web. Berikut ini adalah field-field yang

dibuat dalam tabel statistik beserta keterangannya.

Tabel 3.11 Tabel statistik


ip varchar 20 ip pengunjung tanggal date tanggal berkunjung hits int 10 jumlah kunjungan online varchar 255 jumlah ip yang sedang berkunjung

Tabel 3.1 sampai tabel 3.11 merupakan kumpulan data-data yang

akan memberikan semua isi dan fungsi yang dibutuhkan pada website.

39

3.4.1 Relasi Antar Tabel

Berikut ini adalah relasi dari tabel yang dijabarkan diatas.

Gambar 3.7 Hubungan antar tabel basis data

Gambar 3.7 menunjukkan hubungan antara entitas yang

berbeda dimana pertama-tama penulis mengasumsikan hanya ada

satu administrator sistem di dalam CompuShop.

40

Sebagai tambahan, 1 pengunjung dapat memesan n orders.

Berikutnya, 1 produk dapat mempunyai n orders atau 1 orders

dapat dipunyai n produk dan 1 kategori mempunyai n produk.

Pada akhirnya adminstrator bisa mengatur data n kategori, n

produk. Bentuk ini diadopsi untuk memandu perancangan sistem

basis data MySQL CompuShop. Oleh sebab itu dalam

perancangan basis data compushop, terdapat 11 tabel yang

berbeda untuk menyimpan jenis data yang berbeda. Diantara 11

tabel tersebut ada yang saling berhubungan dan ada yang berdiri

sendiri.

3.5 Perancangan Struktur Web

Adapun perancangan halaman-halaman dalam website ini dibagi

atas dua macam yaitu bagi admin dan bagian pengunjung (calon pembeli).

Rancangan ini dapat dilihat dari gambar 3.8 sampai gambar 3.11.

Gambar 3.8 Tampilan halaman utama pengunjung

Header

TwitterCompuShop

Konten UtamaBerdasar Menu Utama

Produk Terlaris

Daftar Kategori

Lokasi Web

Menu Utama

Footer

41

Gambar 3.9 Tampilan halaman detail info produk

Gambar 3.10 Tampilan halaman login administrator

42

Gambar 3.11 Tampilan halaman utama administrator

3.6 Data Flow Diagram (DFD)

Data Flow Diagram (DFD) merupakan diagram alir data, mulai

dari memasukkan data, memproses data hingga menghasilkan

informasi.DFD ini bisa dipergunakan untuk sistem secara nyata, sehingga

orang mengerti kenyataan tentang sistem yang sedang berjalan.

Gambar 3.12 Diagram Alir Data

43

3.7 Bagan Alir (Flowchart) Program

Flowchart sendiri merupakan gambaran yang menampilkan

struktur, hierarki dan isi halaman per halaman, berikut gambarannya :

1. Flowchart halaman utama

Gambar 3.13 Flowchart halaman utama

Mulai

Tampilkan Menu

Home

Proses Pesanan

Keranjang Belanja

Pencarian

Konten Statis

Tampilkan Semua Produk

Tampilkan Hasil

Pencarian

Tampilkan Konten Statis

Tampilkan Isi

Keranjang Belanja

Tampilkan Form Data Pembeli

Stop

Keluar

Ya

Tidak

Ya

Ya

Ya

Ya

Ya

Tidak

Tidak

Tidak

Tidak

Tidak

44

2. Flowchart halaman home

Gambar 3.14 Flowchart halaman home

3. Flowchart halaman semua produk

Gambar 3.15 Flowchart halaman semua produk

45

4. Flowchart halaman pencarian produk

Gambar 3.16 Flowchart pencarian kata

ProsedurPencarian

Isi Kata Yang Dicari

Kata Sudah Diisi ? Cari Di Basis Data Ketemu ?

Pindah Ke Halaman Hasil

Pencarian

Pindah Ke Halaman Hasil

Pencarian

TampilkanTidak Ada Hasil

Tampilkan Produk

Ya

Tidak

Ya

Tidak

5. Flowchart halaman konten statis

Gambar 3.17 Flowchart menampilkan konten statis

46

6. Flowchart halaman keranjang belanja

Gambar 3.18 Flowchart keranjang belanja

7. Flowchart halaman hubungi kami

Gambar 3.19 Flowchart hubungi kami

47

8. Flowchart halaman administrator

Gambar 3.20 Flowchart halaman administrator

Flowchart pada Gambar 3.13 sampai Gambar 3.20 merupakan

gambaran dari setiap program yang akan dibuat guna membentuk suatu

sistem penjualan yang telah diharapkan.

BAB IV

PENGUJIAN DAN ANALISIS SISTEM

Pengujian sistem dilakukan secara online, dengan menggunakan web

hosting SoloNet dan domainnya bernama www.jalabuana.com.

4.1 Komponen Sistem

Agar mengetahui sistem yang telah dirancang dan dibangun dapat

berjalan baik atau tidak, maka perlu kiranya dilakukan pengujian terhadap

sistem. Untuk itu dibutuhkan beberapa komponen utama mencakup

perangkat keras (hardware), perangkat lunak (software), operator

(brainware) dan tentu saja koneksi internet. Komponen-komponen yang

mencakup seperti diatas sangat dibutuhkan untuk menjalankan sistem ini.

4.1.1 Kebutuhan Perangkat Keras/ Hardware

Perangkat keras merupakan komponen-komponen peralatan

yang membentuk suatu sistem komputer dan peralatan-peralatan

tambahan lainnya yang memungkinkan komputer untuk

menjalankan tugasnya sesuai dengan yang diberikan. Komponen

ini bersifat nyata secara fisik, artinya dapat dilihat dan dipegang.

4.1.1.1 Komputer Server

Komputer server bertugas melayani permintaan

client terhadap akses data di dalam jaringan,

menggunakan sebuah PC Desktop yang sudah tersedia

ketika berlangganan web hosting. Spesifikasi minimal

48

49

komputer server yang dapat digunakan agar sistem dapat

berjalan baik adalah sebagai berikut :

1. Monitor Super VGA (Optional).

2. CPU (Central Processing Unit), setara

dengan Intel Pentium 4.

3. Harddisk sebagai media penyimpanan

minimal 20GB.

4. Memori atau biasa disebut RAM, minimal

128 MB.

5. Keyboard dan Mouse (Optional).

4.1.1.2 Komputer Client

Komputer client digunakan untuk mengakses

sistem yang telah dibuat dan di hostingkan di komputer

server dihubungkan melalui internet dengan media

transmisi menggunakan kabel UTP (Unshielded twisted-

pair). Spesifikasi minimal komputer client yang dapat

digunakan agar sistem dapat berjalan baik adalah sebagai

berikut :

1. Monitor Super VGA.

2. CPU (Central Processing Unit), setara

dengan Intel Pentium 4.

3. Harddisk sebagai media penyimpanan

minimal 20GB.

50

4. Memori atau biasa disebut RAM, minimal

128 MB.

5. Keyboard dan Mouse.

4.1.2 Kebutuhan Perangkat Lunak/ Software

Perangkat keras tidak dapat menjalankan tugasnya tanpa

adanya perangkat lunak yang terinstal. Perangkat lunak

merupakan komponen di dalam sistem data berupa program atau

instruksi untuk mengontrol suatu sistem. Perangkat lunak yang

diperlukan untuk menjalankan sistem terbagi menjadi 2 fungsi,

yaitu:

4.1.2.1 Komputer Server

Perangkat lunak untuk komputer yang bertugas

sebagai server harus terinstal perangkat lunak minimal

sebagai berikut :

1. Sistem operasi sebagai platform dari

perangkat lunak lainnya. Ubuntu server

memiliki performa bagus dan juga

merupakan sistem operasi yang gratis.

2. MySQL sebagai bahasa pemrograman

untuk database dalam bahasa SQL

(Structured Query Language) yang

digunakan untuk mengelola basis data.

51

3. PHP sebagai bahasa pemrograman server

side, dapat membuat perintah query pada

pemrogramannya seperti perintah dasar

SQL.

4. Web Server sebagai server lokal dalam

pengetesan halaman web sebelum file-file

dan script web dipublikasikan pada

internet, seperti PWS (Personal Web

Server) atau Apache Web Server seperti

yang digunakan penulis.

4.1.2.2 Komputer Client

Perangkat lunak untuk komputer yang bertugas

sebagai client harus terinstal perangkat lunak minimal

sebagai berikut :

1. Sistem operasi Windows XP SP2.

2. Browser sebagai tempat melihat output

atau tampilan halaman web, misal Google

Chrome, Internet Explorer, Mozilla

Firefox, Netscape Navigator, dll.

52

4.1.3 Kebutuhan Operator/Brainware

Perangkat operator (brainware) merupakan faktor sumber

daya manusia yang bertugas untuk menangani berbagai fasilitas

sistem yang telah dibuat. Sumber daya manusia tersebut adalah

orang-orang memiliki keahlian pada bidang masing-masing dan

merupakan unsur pendukung dalam sistem ini yang meliputi :

1. Administrator.

Administrator bertugas sebagai pengelola

seluruh isi dari sistem.

2. Pengunjung.

Pengunjung merupakan sumber daya manusia

inti dari sistem yang telah dibangun karena

pengunjung adalah calon pembeli.

4.1.4 Kebutuhan Internet

Sistem yang sudah dibangun bertujuan untuk menjual

barang secara online dengan menggunakan media internet. Server

dan client harus saling terhubung ke internet agar keduanya dapat

berkomunikasi antara satu dengan lainnya.

53

4.2 Pengujian Sistem

Sistem yang telah dibuat akan dilakukan pengujian dari hasil

implementasi perancangan yang dilakukan sebelumnya. Tujuan pengujian

ini adalah untuk mengetahui apakah sistem yang dibuat sudah bekerja

seperti yang diharapkan atau belum. Beberapa hal yang diujikan meliputi :

4.2.1 Akses Pengunjung Terhadap Halaman Depan Sistem

Halaman depan program adalah halaman saat pertama kali

pengunjung mengetikkan ”http://www.jalabuana.com/bbcc/” pada

address bar di web browser Google Chrome. Pada halaman ini

akan ditampilkan beberapa menu pilihan antara lain : home,

semua produk, cara pembelian, profil kami, hubungi kami dan

pilihan menu kategori produk. Tampilan halaman depan seperti

pada Gambar 4.1.

Gambar 4.1 Tampilan halaman utama

54

4.2.2 Akses Pengunjung Terhadap Halaman Semua Produk

Halaman yang menyediakan daftar semua macam produk

yang ditawarkan, ditujukan kepada pengunjung sebagai acuan

dalam memilih barang yang akan dibelinya.

Gambar 4.2 Tampilan halaman semua produk

55

4.2.3 Akses Pengunjung Terhadap Halaman Hasil Pencarian

Halaman ini berfungsi menampilkan hasil pencarian dari

kata yang diinginkan. Ketikkan nama dari produk yang

diinginkan kemudian tekan tombol enter.

Gambar 4.3 Tampilan halaman pencarian

56

4.2.4 Akses Pengunjung Terhadap Halaman Detail Info Produk

Halaman ini berisi tentang informasi detail dari produk

yang akan dibeli oleh pengunjung.

Gambar 4.4 Tampilan halaman detail info produk

57

4.2.5 Akses Pengunjung Terhadap Halaman Keranjang Belanja

Halaman ini menampilkan produk-produk apa saja yang

telah pengunjung pesan, jika keranjang masih kosong maka

pengunjung akan diberikan peringatan dan akan dibawa kembali

ke halaman utama yang terbentuk dari script berikut :

<?php if($ketemu < 1){ ?> <script> window.alert('Keranjang

Belanja Masih Kosong.'); window.location=('home') </script> <?php } ?>

Gambar 4.5 Tampilan peringatan masih kosong

Jika keranjang belanja sudah terisi maka akan muncul daftar

belanjaan yang akan dibeli seperti terlihat pada gambar 4.6.

58

Gambar 4.6 Tampilan halaman keranjang belanja

4.2.6 Akses Pengunjung Terhadap Halaman Hubungi Kami

Halaman ini ditujukan bagi para pengunjung agar dapat

mengirim pesan ke pemilik toko atau mengetahui alamat lengkap

dimana toko berada.

59

Gambar 4.7 Tampilan halaman hubungi kami

4.2.7 Akses Administrator Terhadap Halaman Administrator

Halaman ini merupakan halaman penting, karena mengatur

semua data yang ada di dalam website seperti menambah produk,

menambah kategori, memeriksa pesanan, dan yang lainnya.

Halaman ini membutuhkan akun dengan hak akses sebagai

administrator.

60

Gambar 4.8 Tampilan halaman login administrator

Gambar 4.9 Tampilan halaman menu administrator

4.3 Analisis Hasil Perancangan Sistem

Hasil dari sistem yang telah diimplementasikan, selanjutnya akan

dilakukan analisa terhadap sistem meliputi :

61

4.3.1 Analisa Pengunjung Dalam Mengirim Pesan

Analisis ini bertujuan untuk memastikan apakah data yang

dimasukkan oleh seorang pengunjung masuk kedalam database

atau tidak. Ketika percobaan dilakukan, jika pengisian belum

lengkap, maka akan tampil peringatan seperti pada Gambar 4.10.

Gambar 4.10 Tampilan peringatan

Data dapat terkirim apabila pengunjung tersebut sudah

melengkapi semua input data yang diperlukan.

Gambar 4.11 Tampilan pemberitahuan sukses mengirim pesan

4.3.2 Analisa Untuk Halaman Administrator

Analisa ini bertujuan untuk mengetahui apakah seseorang

dapat login tanpa menggunakan username dan password yang

belum ada di database dan jika pengisian salah maka akan tampil

62

seperti pada Gambar 4.12 dan akan dikembalikan ke halaman

login administrator, berikut cuplikan scriptnya :

else{ echo"

<script> window.alert('Username / Password Salah.'); window.location=('index.php')

</script> "; }

Gambar 4.12 Tampilan peringatan

Halaman utama administrator yang terlihat pada Gambar

4.13 akan tampil jika username dan password yang digunakan

sudah terdaftar/benar dan tidak diblokir.

Gambar 4.13 Tampilan halaman menu administrator

63

4.3.3 Analisa Sistem Dalam Pemesanan Produk

Pemesanan produk dapat dilakukan oleh siapa pun tanpa

harus terdaftar ataupun login ke sistem terlebih dahulu dengan

batas pembayaran maksimal tiga hari setelah pemesanan dengan

syarat, pemesan memilih cara pembayaran selain paypal (pihak

ketiga). Pemesan dapat melakukan pembayaran melalui paypal

(pihak ketiga) dan setelah paypal mengirim kode konfirmasi yang

menandakan bahwa pembayaran sudah selesai, maka status

pesanan akan langsung di update oleh sistem menjadi “Lunas”.

4.3.4 Perbandingan Tampilan Sistem Antar Peramban (Browser)

Perbandingan antar peramban (browser) dilakukan guna

melihat seberapa banyak perbedaan tampilan sistem apabila

dibuka menggunakan browser yang berbeda-beda.

64

Gambar 4.14 Tampilan halaman utama dengan google chrome

65

Gambar 4.15 Tampilan halaman utama dengan firefox

66

Gambar 4.16 Tampilan halaman utama dengan internet explorer

Gambar 4.14 sampai gambar 4.16 sekilas tidak terdapat

perbedaan, namun jika diperhatikan dengan seksama maka

perbedaan yang paling mencolok yaitu mengenai lengkungan

pada tiap sudut nya yang biasa disebut dengan ”round corner”.

67

4.4 Hasil Pengujian Sistem

Guna mengetahui kepuasan pelanggan dalam penggunaan sistem

ini, maka dilakukan penelitian. Populasi dan sampel dalam penelitian ini

adalah administrator dan calon pembeli (pengunjung). Pengguna

berjumlah 6 orang yaitu 1 orang sebagai administrator dan 5 orang sebagai

pelanggan biasa/calon pembeli.

Untuk mengumpulkan data dalam penelitian ini menggunakan

instrumen angket atau biasa disebut kuisioner. Dalam penelitian ini

menggunakan dua jenis kuisioner, yang pertama untuk pelanggan biasa

dan yang kedua untuk administrator. Aturan penilaian jawaban kuisioner

dibuat sebagai berikut :

1. Jawaban 1 bernilai 1





Setelah angket disebar dan data sudah didapat dari angket yang

telah diisi, maka dilakukan perhitungan sesuai dengan aturan penelitian.

68

Tabel 4.1 Tabel data penelitian terhadap pengunjung

Nama Level Nilai Total

Ardy Pelanggan 26 Andha Pelanggan 28 Budi Pelanggan 33 Risa Pelanggan 30

Handoko Pelanggan 28 Total 145

Setelah memperoleh nilai dari data pelanggan maka nilai tersebut

dipresentase dengan nilai maksimum dengan perhitungan dibawah ini :

145175 100% 82,86%

Tabel 4.1 Tabel data penelitian terhadap administrstor

Nama Level Nilai Total

Widyo Ari Administrator 28 Total 28

2835 100% 80%

Presentase nilai yang didapat dari pengujian baik untuk

administrator maupun untuk pelanggan biasa lebih besar dari 50%, maka

dapat disimpulkan bahwa sistem ini secara keseluruhan dapat berjalan

sesuai dengan tujuan pembuatan. Prosentase tingkat keberhasilan untuk

tingkat pelanggan adalah 82.86% dan prosentase tingkat keberhasilan

untuk tingkat adminsitrator adalah 80%.

69

Analisa selanjutnya yaitu membuat grafik penilaian terhadap setiap

pertanyaan yang diajukan. Hasil analisa dapat dilihat pada grafik yang

tergambar di Gambar 4.14 dan Gambar 4.15.

0

5

10

15

20

25

Interface (Tampilan)

Web

Daya tarik web

Fasilitas pengunjung

Kemudahan melakukan transaksi

Kelengkapan data

Kecepatan akses

Penilaian web secara keseluruhan

Gambar 4.17 Penilaian pelanggan terhadap setiap pertanyaan

Gambar 4.17 menunjukkan grafik penilaian sistem dari sudut

pandang pelanggan. Dari grafik tersebut dapat disimpulkan bahwa sistem

penjualan online ini dapat memuaskan pelanggan dari segi tampilan,

kemudahan transaksi dan kecepatan akses. Kelengkapan data dalam sistem

ini menurut pelanggan dirasa kurang lengkap, hal ini dikarenakan sistem

ini masih dalam masa uji coba sehingga data atau produk yang

ditampilkan masih sedikit.

70

00.51

1.52

2.53

3.54

4.55

Interface (Tampilan)

Web

Daya tarik web

Fasilitas pengaturan

sistem

User friendly

Kecepatan akses

Keakuratan transaksi

Penilaian web secara keseluruhan

Gambar 4.18 Penilaian administrator terhadap setiap pertanyaan

Gambar 4.18 menunjukkan grafik penilaian sistem dari sudut

pandang sang administrator. Dilihat dari grafik tersebut, administrator

menilai bahwa sistem penjualan online ini dapat membantu dalam

penjualan produknya secara online, akan tetapi administrator menganggap

bahwa daya tarik terhadap sistem kurang memuaskan jika dilihat dan

dibandingkan dengan nilai yang didapat dengan pertanyaan yang lain.

BAB V

PENUTUP

5.1 Kesimpulan

Berdasarkan hasil dan analisa perancangan sistem yang telah

dijabarkan sebelumnya, maka dapat ditarik kesimpulan sebagai berikut :

1. Sistem yang dirancang dan dibuat adalah sebuah aplikasi sebagai sarana

penjualan produk secara online (e-commerce).

2. Penerapan sistem di CompuShop dapat berjalan dengan baik dan sesuai

harapan.

3. Sistem ini bersifat online yaitu disajikan melalui internet.

5.2 Saran

Penulis memberikan beberapa saran masukan kepada beberapa pihak

mengenai perancangan aplikasi peta digital online yang dilakukan ini. Adapun

saran tersebut sebagai berikut :

1. Bagi penulis selanjutnya diharapkan dapat menyempurnakan keamanan dari

sistem ini.

2. Agar selalu dipercaya oleh pelanggan maka hendaknya pihak CompuShop

selalu cepat dan tepat dalam memberikan layanan dan informasi yang

dibutuhkan pelanggan.

71

72

3. Sumber daya manusia yang menangani sistem harus memiliki kualitas yang

memadai karena kesalahan-kesalahan yang terjadi biasanya disebabkan

karena kurangnya kemampuan user dalam pengoperasian sistem.

4. Perlu adanya pengembangan dari segi desain, kelengkapan, detail produk,

tata cara pembayaran dan pengiriman yang cepat dan mudah kedepannya.

5. Kecepatan dalam membuka halaman web perlu diperhatikan, agar

pengunjung tidak merasa bosan karena harus menunggu lama untuk

membuka halaman web pada situs ini.

DAFTAR PUSTAKA

Andriana, D. 2003. “Pengenalan Pemrograman E-Commerce Dengan PHP dan

MySQL”. www.ilmukomputer.com/umum/dian/dian-ecommerce.zip.

Bulger, Brad., Greenspan, Jay., 2004 “MySQL®/PHP Database Applications,

Second Edition”, Wiley Publishing, Inc.

Churcher, Clare., 2007 “Beginning Database Design From Novice to

Professional”, Apress.

Darie, Cristian., Balanescu, Emilian., 2008 “Beginning PHP and MySQL E-

Commerce From Novice to Professional SECOND EDITION”, Apress.

E. Williams, Hugh., Lane, David., 2002 “Web Database Applications with PHP &

MySQL”, O'Reilly & Associates, Inc.

Kadir, A. 2002. “Pemrograman Web mencakup : HTML, CSS, Java Script &

PHP”. Andi Offset Yogyakarta.

Kurniawan, Y. 2002. “Aplikasi Web Database Dengan PHP Dan MySQL”. PT

Elex Media Komputindo Jakarta.

Norman, Matthew., 2004 “Database Design Manual: using MySQL™ for

Windows”, Springer-Verlag London.

Peacock, Michael., 2010 “PHP 5 e-commerce Development”, Packt Publishing

Ltd.

Purbo, Onno W., 2000, “Mengenal E-Commerce”, PT Elex Media Komputindo,

Jakarta.

Welling, Luke., Thomson, Laura., 2001 “PHP And MySQL Web Development”,

Sams Publishing.

73

http://www.ilmukomputer.com/umum/dian/dian-ecommerce.zip

Kuisioner

Sistem Penjualan Online CompuShop

(Pengunjung)

Beri penilaian anda tentang sistem penjualan online CompuShop dengan cara

melingkari angka yang ada. (angka 5 adalah penilaian yang paling tinggi).

1. Interface (Tampilan) Web 1 2 3 4 5

2. Daya tarik web 1 2 3 4 5

3. Fasilitas pengunjung 1 2 3 4 5

4. Kemudahan melakukan transaksi 1 2 3 4 5

5. Kelengkapan data 1 2 3 4 5

6. Kecepatan akses 1 2 3 4 5

7. Penilaian web secara keseluruhan 1 2 3 4 5

Saran untuk pengembangan sistem :

Terimakasih atas kesediaan anda mengisi kuisioner ini.

Kuisioner

Sistem Penjualan Online CompuShop

(Administrator)

Beri penilaian anda tentang sistem penjualan online CompuShop dengan cara

melingkari angka yang ada. (angka 5 adalah penilaian yang paling tinggi).

1. Interface (Tampilan) Web 1 2 3 4 5

2. Daya tarik website 1 2 3 4 5

3. Fasilitas pengaturan sistem 1 2 3 4 5

4. User friendly 1 2 3 4 5

5. Kecepatan akses 1 2 3 4 5

6. Keakuratan transaksi 1 2 3 4 5

7. Penilaian web secara keseluruhan 1 2 3 4 5

Saran untuk pengembangan sistem :

Terimakasih atas kesediaan anda mengisi kuisioner ini.

Kode Pembentuk Halaman Administrator

../bbcc/ng4d1m1n/index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="shortcut icon" href="images/favicon.ico" /> <title>SoloNet | Administration</title> <link rel="stylesheet" href="css/style.css" type="text/css" /> </head> <body> <script language="javascript"> function validasi(form){ if (form.username.value == ""){ alert("Anda belum mengisikan Username."); form.username.focus(); return (false); } if (form.password.value == ""){ alert("Anda belum mengisikan Password."); form.password.focus(); return (false); } return (true); } </script>  <div id="wrapper_sec">  <div id="masthead"> <div class="logo"><a href="#"><img src="images/adlogo.png" alt="" /></a></div> <div class="lock"><img src="images/login.png" alt="" /></div> <div class="clear"></div>  <div id="navigation"> <div class="clear"></div> </div> </div> <div class="clear"></div>  <div id="body"> <div class='box' style='width: 400px; min-height: 110px; margin-top: 40px; margin-left: auto; margin-right: auto;'> <div class='heading'> <h1 style='padding-left: 7px; padding-bottom: 0px; padding-top: 10px;'><img src='images/login/lockscreen.png'> <label style='position: relative; top: -6px; padding-left: 5px;'> SoloNet | CompuShop</label></h1>

</div> <div class='content' style='min-height: 100px;'> <form name="login" action="cek_login.php" method="POST" onSubmit="return validasi(this)"> <table style='width: 100%;'> <tr><td rowspan='7' style='text-align: center;' ><img src='images/login/login.png' alt='Masukkan Username Dan Password Anda.' /></td></tr> <tr> <td style='text-align: left; padding-left: 15px; padding-top: 10px;' ><label>Username</label></td> <td style='text-align: left; padding-left: 15px; padding-top: 10px;' ><input type="text" value="Username" id="username" name="username" onblur="if(this.value == '') { this.value = 'Username'; }" onfocus="if(this.value == 'Username') { this.value = ''; }"/></td> </tr> <div class="clear"></div> <tr> <td style='text-align: left; padding-left: 15px; padding-top: 10px;' ><label >Password</label></td> <td style='text-align: left; padding-left: 15px; padding-top: 10px;' ><input type="password" value="Password" id="password" name="password" onblur="if(this.value == '') { this.value = 'Password'; }" onfocus="if(this.value == 'Password') { this.value = ''; }"/></td> </tr> <div class="clear"></div> <tr><td></td> <td style='text-align: left; padding-left: 15px; padding-top: 10px;' ><span></span> <input style='cursor: pointer; width: 60px; height:25px; margin-left:90px;' type='submit' name='sublogin' value='Masuk'/> </td></tr> </table> </form> </div> </div> </div> <div id="footer"> <div class="txt"><p><label>© 2011 A Indra Perdana.</label></p> </div> </div> </div> </td></tr> </body> </html>

../bbcc/ng4d1m1n/media.php ?php ob_start(); error_reporting(0); session_start(); if (empty($_SESSION[username]) AND empty($_SESSION[passuser])){ header('Location:index.php'); } else{ ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="shortcut icon" href="images/favicon.ico" /> <title>SoloNet | Administration</title> <link rel="stylesheet" href="css/style.css" type="text/css" /> </head> <body> <script language="javascript" type="text/javascript"> tinyMCE_GZ.init({ plugins : 'style,layer,table,save,advhr,advimage, ...', themes : 'simple,advanced', languages : 'en', disk_cache : true, debug : false }); </script> <script language="javascript" type="text/javascript" src="../tinymcpuk/tiny_mce_src.js"></script> <script type="text/javascript"> tinyMCE.init({ mode : "textareas", theme : "advanced", plugins : "table,youtube,advhr,advimage,advlink,emotions,flash,searchreplace,paste,directionality,noneditable,contextmenu", theme_advanced_buttons1_add : "fontselect,fontsizeselect", theme_advanced_buttons2_add : "separator,preview,zoom,separator,forecolor,backcolor,liststyle", theme_advanced_buttons2_add_before: "cut,copy,paste,separator,search,replace,separator", theme_advanced_buttons3_add_before : "tablecontrols,separator,youtube,separator", theme_advanced_buttons3_add : "emotions,flash", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "bottom", extended_valid_elements : "hr[class|width|size|noshade]",

file_browser_callback : "fileBrowserCallBack", paste_use_dialog : false, theme_advanced_resizing : true, theme_advanced_resize_horizontal : false, theme_advanced_link_targets : "_something=My somthing;_something2=My somthing2;_something3=My somthing3;", apply_source_formatting : true }); function fileBrowserCallBack(field_name, url, type, win) { var connector = "../../filemanager/browser.html?Connector=connectors/php/connector.php"; var enableAutoTypeSelection = true; var cType; tinymcpuk_field = field_name; tinymcpuk = win; switch (type) { case "image": cType = "Image"; break; case "flash": cType = "Flash"; break; case "file": cType = "File"; break; } if (enableAutoTypeSelection && cType) { connector += "&Type=" + cType; } window.open(connector, "tinymcpuk", "modal,width=600,height=400"); } </script>  <div id="wrapper_sec">  <div id="masthead"> <div class="logo"><a href="#"><img src="images/adlogo.png" alt="" /></a></div> <div class="lock"><img src="images/login.png" alt="" /></div> <div class="clear"></div>  <div id="navigation"> <div class="clear"></div> </div> </div> <div class="clear"></div>  <div id="content_sec"> <div class="col1"> <?php include "menu.php"; ?> </div> <div class="col2">

<div class="admin"> <?php include "content.php";?> </div> </div> </div> <div class="clear"></div> <div id="footer"> <div class="txt"> <p><label>Copyleft © 2010 A Indra Perdana.</label></p> </div> </div> </div> </td></tr> </body> </html> <?php } ob_flush(); ?>

../bbcc/ng4d1m1n/menu.php

<div class="category"> <h3 class="head">Menu Pengaturan</h3> <div class="arrowlistmenu"> <?php include "../config/koneksi.php"; if ($_SESSION[leveluser]=='admin'){ $sql=mysql_query("select * from modul where aktif='Y' order by urutan"); } else{ $sql=mysql_query("select * from modul where status='user' and aktif='Y' order by urutan"); } echo "<a href=?module=home class='menuheader'>Home</a>"; while ($m=mysql_fetch_array($sql)){ echo "<a href='$m[link]' class='menuheader'>$m[nama_modul]</a>"; } echo "<a href=logout.php class='menuheader'>Logout</a>"; ?> </div> <div class="clear"></div> </div>

../bbcc/ng4d1m1n/logout.php ?php ob_start(); session_start();

session_destroy(); echo "<center>Anda telah sukses keluar sistem <b>[LOGOUT]<b>"; // Apabila setelah logout langsung menuju halaman utama website, aktifkan baris di bawah ini: header('location:index.php'); ob_flush(); ?> ../bbcc/ng4d1m1n/cek_login.php ?php include "../config/koneksi.php"; function antiinjection($data){ $filter_sql = mysql_real_escape_string(stripslashes(strip_tags(htmlspecialchars($data,ENT_QUOTES)))); return $filter_sql; } $username = antiinjection($_POST[username]); $pass = antiinjection(md5($_POST[password])); $login=mysql_query("SELECT * FROM admins WHERE username='$username' AND password='$pass' AND blokir='N'"); $ketemu=mysql_num_rows($login); $r=mysql_fetch_array($login); // Apabila username dan password ditemukan if ($ketemu > 0){ session_start(); session_register("namauser"); session_register("namalengkap"); session_register("passuser"); session_register("leveluser"); $_SESSION[namauser] = $r[username]; $_SESSION[namalengkap] = $r[nama_lengkap]; $_SESSION[passuser] = $r[password]; $_SESSION[leveluser] = $r[level]; header('location:media.php?module=home'); } else{ echo" <script> window.alert('Username / Password Salah.'); window.location=('index.php') </script>"; } ?>

Kode Pembentuk Halaman Pengunjung ../bbcc/index.php <?php header('location:home'); ?> ../bbcc/ng4d1m1n/utama.php <?php ob_start(); error_reporting(0); session_start(); include "config/koneksi.php"; include "config/fungsi_indotgl.php"; include "config/class_paging.php"; include "config/fungsi_combobox.php"; include "config/library.php"; include "config/fungsi_autolink.php"; include "config/fungsi_rupiah.php"; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="robots" content="index, follow"> <meta name="description" content="<?php include "dina_meta1.php"; ?>"> <meta name="keywords" content="<?php include "dina_meta2.php"; ?>"> <meta name="google-site-verification" content="AK1nZ-w8s3Zf0Qy5mXHmzVCaa2pXc2lM1xa8oZSkRXY" /> <meta http-equiv="Copyright" content="iVash"> <meta name="author" content="A Indra Perdana"> <meta http-equiv="imagetoolbar" content="no"> <meta name="language" content="Indonesia"> <meta name="revisit-after" content="7"> <meta name="webcrawlers" content="all"> <meta name="rating" content="general"> <meta name="spiders" content="all"> <title><?php include "dina_titel.php"; ?></title> <link rel="shortcut icon" href="images/favicon.ico" /> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="rss.xml" />  <link rel="stylesheet" href="css/style.css" type="text/css" />

layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL }, 'google_translate_element'); } </script> <script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>  <div id="navigation"> <div id="smoothmenu1" class="ddsmoothmenu"> <ul> <li><a href="home">Home</a></li> <li><a href="semua-produk.html">Semua Produk</a></li> <li><a href="cara-pembelian.html">Cara Pembelian</a></li> <li><a href="profil-kami.html">Profil Kami</a></li> <li><a href="hubungi-kami.html">Hubungi Kami</a></li> </ul> <br style="clear: left" /> </div> <div class="search"> <form method="POST" action="hasil-pencarian.html"> <input type="text" value="Pencarian" name="kata" onblur="if(this.value == '') { this.value = 'Pencarian'; }" onfocus="if(this.value == 'Pencarian') { this.value = ''; }" class="bar" /> <input style='cursor: pointer; width: 16px; height:16px; margin-right:5px; margin-top:3px; float:right;' type='image' src="images/go.gif" value=' '/> </form> </div> <div class="clear"></div> </div> </div> <div class="clear"></div>    <div id="crumb"> <label><?php include "loconsite.php";?></label> </div> <div class="clear"></div>  <div id="content_sec"> <div class="col1"> <?php include "leftcont.php";?> </div>

<div class="col2"> <?php include "rightcont.php";?> </div> </div> <div class="clear"></div>  <div id="footer"> <?php include "footer.php";?> </div> </div> </body> </html> <?php ob_flush(); ?> ../bbcc/utama.php <?php ob_start(); error_reporting(0); session_start(); include "config/koneksi.php"; include "config/fungsi_indotgl.php"; include "config/class_paging.php"; include "config/fungsi_combobox.php"; include "config/library.php"; include "config/fungsi_autolink.php"; include "config/fungsi_rupiah.php"; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="robots" content="index, follow"> <meta name="description" content="<?php include "dina_meta1.php"; ?>"> <meta name="keywords" content="<?php include "dina_meta2.php"; ?>"> <meta name="google-site-verification" content="AK1nZ-w8s3Zf0Qy5mXHmzVCaa2pXc2lM1xa8oZSkRXY" /> <meta http-equiv="Copyright" content="iVash"> <meta name="author" content="A Indra Perdana"> <meta http-equiv="imagetoolbar" content="no"> <meta name="language" content="Indonesia"> <meta name="revisit-after" content="7"> <meta name="webcrawlers" content="all"> <meta name="rating" content="general"> <meta name="spiders" content="all"> <title><?php include "dina_titel.php"; ?></title> <link rel="shortcut icon" href="images/favicon.ico" />

<div id="content_sec"> <div class="col1"> <?php include "leftcont.php";?> </div> <div class="col2"> <?php include "rightcont.php";?> </div> </div> <div class="clear"></div>  <div id="footer"> <?php include "footer.php";?> </div> </div> </body> </html> <?php ob_flush(); ?> ../bbcc/footer.php <div class="rights" align="right"> <label> <ul> <li class="first"><a href="home">Home</a></li> <li><a href="cara-pembelian.html">Cara Pembelian</a></li> <li><a href="profil-kami.html">Profil Kami</a></li> <li><a href="hubungi-kami.html">Hubungi Kami</a></li> </ul> <div class="clear"></div><br /><br /><br /><br /> <p> Powered By: <a href="http://www.solonet.co.id">SoloNet</a> <br /> © 2011 <a href="ymsgr:sendIM?trigun_094">A Indra Perdana</a>. </p> </label> </div> <?php // Statistik user $ip = $_SERVER['REMOTE_ADDR']; // Mendapatkan IP komputer user $tanggal = date("Ymd"); // Mendapatkan tanggal sekarang $waktu = time(); // // Mencek berdasarkan IPnya, apakah user sudah pernah mengakses hari ini $s = mysql_query("SELECT * FROM statistik WHERE ip='$ip' AND tanggal='$tanggal'"); // Kalau belum ada, simpan data user tersebut ke database if(mysql_num_rows($s) == 0){

mysql_query("INSERT INTO statistik(ip, tanggal, hits, online) VALUES('$ip','$tanggal','1','$waktu')"); } else{ mysql_query("UPDATE statistik SET hits=hits+1, online='$waktu' WHERE ip='$ip' AND tanggal='$tanggal'"); } $pengunjung = mysql_num_rows(mysql_query("SELECT * FROM statistik WHERE tanggal='$tanggal' GROUP BY ip")); $totalpengunjung = mysql_result(mysql_query("SELECT COUNT(hits) FROM statistik"), 0); $hits = mysql_fetch_assoc(mysql_query("SELECT SUM(hits) as hitstoday FROM statistik WHERE tanggal='$tanggal' GROUP BY tanggal")); $totalhits = mysql_result(mysql_query("SELECT SUM(hits) FROM statistik"), 0); $bataswaktu = time() - 300; $pengunjungonline = mysql_num_rows(mysql_query("SELECT * FROM statistik WHERE online > '$bataswaktu'")); ?> <div class="lefts"> <label> <p><img src='images/hariini.png'> Pengunjung online : <?php echo $pengunjungonline ?></p> <p><img src='images/total.png'> Pengunjung hari ini : <?php echo $pengunjung ?></p> <p><img src='images/hariini.png'> Total pengunjung : <?php echo $totalpengunjung ?></p> <p><img src='images/total.png'> Hits hari ini : <?php echo $hits[hitstoday] ?></p> <p><img src='images/online.png'> Total hits : <?php echo $totalhits ?></p> </label> </div>

TUGAS AKHIR PENGGUNAAN TEKNOLOGI INTERNET (E-COMMERCE...

Documents

Transcript of TUGAS AKHIR PENGGUNAAN TEKNOLOGI INTERNET (E-COMMERCE...