Perancangan dan Pembuatan Commerce Qz_Collection Online System Berbasis Web Menggunakan PHP dan Mysql

(1)

PERANCANGAN DAN PEMBUATAN COMMERCE

QZ_COLLECTION ONLINE SYSTEM BERBASIS WEB

MENGGUNAKAN PHP DAN MYSQL

TUGAS AKHIR

PUTRI INDAH PUSPITA

112406168

PROGRAM STUDI D3 TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

MEDAN

2014


(2)

PERANCANGAN DAN PEMBUATAN COMMERCE

QZ_COLLECTION ONLINE SYSTEM BERBASIS WEB

MENGGUNAKAN PHP DAN MYSQL

TUGAS AKHIR

Diajukan Untuk Melengkapi Tugas Dengan Memenuhi Syarat Mencapai Gelar Ahli Madya

Putri Indah Puspita

112406168

PROGRAM STUDI D3 TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

MEDAN

2014


(3)

PERSETUJUAN

Judul : PERANCANGAN DAN PEMBUATAN

COMMERCEQZ_COLLECTION ONLINE

SYSTEM BERBASIS WEB MENGGUNAKAN PHP DAN MYSQL

Kategori : TUGAS AKHIR

Nama : PUTRI INDAH PUSPITA

Nomor Induk Mahasiswa : 112406168

Program Studi : D3 TEKNIK INFORMATIKA

Departemen : MATEMATIKA

Fakultas : MATEMATIKA DAN ILMU PENGETAHUAN ALAM

(FMIPA) UNIVERSITAS SUMATERA UTARA

Disetujui Oleh Medan, Juli 2014

Ketua, Pembimbing

Dr.Elly Rosmaini, M.si Dr.Syahril Efendi, S.Si., M.I.T NIP. 196005201985032002 NIP.196711101996021001


(4)

PERNYATAAN

PERANCANGAN DAN PEMBUATAN COMMERCEQZ_COLLECTION ONLINE SYSTEM BERBASIS WEBMENGGUNAKAN PHPDAN MYSQL

Saya mengakui bahwa Tugas Akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.

Medan, Juli 2014

PUTRI INDAH PUSPITA 112406168


(5)

PENGHARGAAN

Puji dan syukur penulis panjatkan kepda Allah SWT atas limpahan rahmat dan hidayah-Nya sehingga tugas akhir ini dapat diselesaikan dengan baik.. Adapun judul tugas akhir ini adalah “Perancangan dan Pembuatan Commerce Qz_Collection Online System Berbasis Web Menggunakan PHP dan Mysql”.

Pada kesempatan ini penulis juga menyampaikan terima kasih yang sebesar-besarnya kepada seluruh pihak yang sudah banyak membantu antara lain: Bpk Dr. Syahril Efendi S.Si, M.IT selaku Dosen Pembimbing Tugas Akhir ini, Ibu Dra. Elly Rosmaini, M.Si dan Bapak Syahriol Sitorus, S.Si, M.IT Selaku Ketua Dan Sekretaris Program Studi D3 Teknik Informatika Fakultas MIPA Universitas Sumatera Utara, Bapak Prof. Dr.Tulus, M.Si dan Ibu Dr. Mardiningsih, M.Sc selaku Ketua dan Sekretaris Departemen Matematika Fakultas MIPA Universitas Sumatera Utara. Bapak Dr. Sutarman, M.Sc selaku Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara, Seluruh Staff dan Dosen pengajar Program Studi D3 Teknik Informatika Fakultas MIPA Universitas Sumatera Utara, Teristimewa kepada kedua Orang Tua Tercinta, Ayahanda Eko Hardono dan Ibunda Risa Eliati, Serta abang dan adik saya, Terimakasih atas kasih sayang dan dukungan serta do’a yang tek pernah berhenti, Kepada Sahabatku Sabrina Amalia, Aii Muay, Fadillah Maharani dan Rekan-rekan seperjuangan mahasiswa KomD’11 yang tak henti-henti nya membantu, memberi semangat dan kenangan.

Demikian Penulis sampaikan segala ucapan terimakasih dan rasa syukur dengan harapan dapat menjadi manfaat bagi semua pembaca dan penulis itu sendri.

Medan, Juli 2014

Penulis


(6)

ABSTRAK

Kajian ini bertujuan membangun suatu website E-Commerce pada toko baju Qz_Collection. Website ini di kembangkan dengan menggunakan perangkat lunak Adobe Dreamweaver, Apache, PHP dan MySQL. Website ini berfungsi untuk memberikan informasi tentang toko baju Qz_Collection yang juga meliputi sistem penjualan online.Tujuan perancangan situs e-commerce ini adalah untuk mempermudah masyarakat dalam memperoleh informasi mengenai toko baju Qz_Collection secara online dan update mengenai deskripsi baju yang di jual oleh toko ini.


(7)

DAFTAR ISI

Halaman

Persetujuan ii

Pernyataan iii

Penghargaan iv

Abstrak v

Daftar Isi vi

Daftar Tabel vii

Daftar Gambar ix

BAB 1 PENDAHULUAN 1

1.1 Latar Belakang 1

1.2 Identifikasi Masalah 3

1.3 Rumusan Masalah 3

1.4 Batasan Masalah 3

1.5 Tujuan 4

1.6 Metodologi Penelitian 5

1.6.1 Tahapan Pengumpulan Data 5

1.6.2 Metode Waterfall 6

1.7 Sistematika Penulisan 7

BAB 2 LANDASAN TEORI 9

2.1 Sistem Informasi 9

2.2 Website 12

2.3 Internet 13

2.4 Protokol TCP/IP 14

2.5 Browser 16

2.6 Produk 19

2.7 Pemesanan 19

2.8 Perdagangan Elektronik (E-Commerce) 20

2.8.1 Jenis E-Commerce 21

2.8.2 Kegiatan Yang Berhubungan Dengan E-Commerce 23

2.8.3 Keuntungan E-Commerce 24

2.8.4 Resiko dan Kerugian E-Commerce 24

2.9 HTML (Hyper Text Markup Languange) 25

2.10 PHP (Hypertext processor) 25

2.10.1 Konsep Kerja PHP 26

2.10.2 Kelebihan Dari PHP 26

2.11 Apache Web Server 28

2.12 SQL (Structure Query Language) 28

2.13 Macromedia Dreamweaver 29

2.14 Pengertian Basis Data 30

2.15 Kamus Data 35

BAB3 PERANCANGAN SISTEM 36


(8)

3.2 Flowchart 38

3.2.1 Flowchart Pemesanan Produk 40

3.3 Struktur Database 41

3.3.1 Tabel Admin 41

3.3.2 Tabel Bank 42

3.3.3 Tabel Banner 42

3.3.4 Tabel Download 43

3.3.5 Tabel Header 43

3.3.6 Tabel Hubungi 44

3.3.7 Tabel Kategori 44

3.3.8 Tabel Komentar 45

3.3.9 Tabel Kota 45

3.3.10 Tabel Kustomer 46

3.3.11 Tabel Mainmenu 46

3.3.12 Tabel Modul 47

3.3.13 Tabel Orders 47

3.3.14 Tabel Order_Detail 48

3.3.15 Tabel Orders_ Temp 48

3.3.16 Tabel Poling 49

3.3.17 Tabel Produk 49

3.3.18 Tabel Sekilas Info 50

3.3.19 Tabel Shop_Pengiriman 51

3.3.20 Tabel Statistik 51

3.3.21 Tabel Submenu 52

3.3.22 Tabel Tag 52

3.3.23 Tabel User 53

3.3.24 Tabel Ym 53

BAB 4IMPLEMENTASI SISTEM 55

4.1 Pengertian Dan Tujuan Implementasi Sistem 56

4.2 Tujuan Implementasi Sistem 56

4.3 Komponen Dalam Implementasi Sistem 56 4.3.1 Perangkat Keras (Hardware) 57 4.3.2 Perangkat Lunak (Software) 57 4.3.3 Perangkat Manusia (Brainware) 58

4.4 Tampilan Halaman Website 58

4.4.1 Tampilan Halaman Website 59 4.4.2 Tampilan Halaman Admin 61

BAB 5 KESIMPULAN DAN SARAN 46

5.1 Kesimpulan 46

5.2 Saran 47

DAFTAR PUSTAKA LAMPIRAN


(9)

DAFTAR TABEL

Halaman

Tabel 3.1 Tabel Flow Direction Symbol 24

Tabel 3.2Tabel Admin 25

Tabel 3.3Tabel Bank 26

Tabel 3.4 Tabel Banner 29

Tabel 3.5 Tabel Download 30

Tabel 3.6Tabel Header 30

Tabel 3.7Tabel Hubungi 31

Tabel 3.8Tabel Kategori 31

Tabel 3.9 Tabel Komentar 32

Tabel 3.10Tabel Kota 33

Tabel 3.11Tabel Kustomer 33

Tabel 3.12Tabel Mainmenu 34

Tabel 3.13 Tabel Modul 34

Tabel 3.14Tabel Orders 33

Tabel 3.15Tabel Order_Detail 33

Tabel 3.16Tabel Order_Temp 34

Tabel 3.17 Tabel Poling 34

Tabel 3.18Tabel Produk 33

Tabel 3.19Tabel Sekilas Info 33

Tabel 3.20Tabel Shop_Pengiriman 34

Tabel 3.21 Tabel Statistik 34

Tabel 3.22Tabel Submenu 33

Tabel 3.23Tabel Tag 33

Tabel 3.24Tabel User 34

Tabel 3.25 Tabel YM 34


(10)

DAFTAR GAMBAR

Halaman

Gambar 3.1Alur Flowchart Pemesanan Produk 40

Gambar 4.1 Tampilan Halaman Utama 59

Gambar 4.2 Tampilan Halaman Kategori 59

Gambar 4.3 Tampilan Halaman Cara Pemesanan 60

Gambar 4.4 Tampilan Halaman Produk Kami 60

Gambar 4.5 Tampilan Halaman Produk Kami 60

Gambar 4.6 Tampilan Halaman Customer Service 61

Gambar 4.7 Tampilan Halaman Administrator 61

Gambar 4.8 Tampilan Halaman Cara Pembelian 62 Gambar 4.9 Tampilan Halaman Ganti Password 62

Gambar 4.10 Tampilan Halaman Modul Admin 63

Gambar 4.11 Tampilan Halaman Komentar 63

Gambar 4.12 Tampilan Halaman Orderan 64


(11)

ABSTRAK

Kajian ini bertujuan membangun suatu website E-Commerce pada toko baju Qz_Collection. Website ini di kembangkan dengan menggunakan perangkat lunak Adobe Dreamweaver, Apache, PHP dan MySQL. Website ini berfungsi untuk memberikan informasi tentang toko baju Qz_Collection yang juga meliputi sistem penjualan online.Tujuan perancangan situs e-commerce ini adalah untuk mempermudah masyarakat dalam memperoleh informasi mengenai toko baju Qz_Collection secara online dan update mengenai deskripsi baju yang di jual oleh toko ini.


(12)

BAB 1 PENDAHULUAN

1.1 Latar Belakang

Pada prinsipnya e-commerce menyediakan infrastruktur bagi perusahaan untuk melakukan ekspansi bisnis tanpa mengenal batas ruang atau waku (time and space). Peluang untuk membangun jaringan dengan berbagai institusi lain tersebut harus dimanfaatkan karena dewasa ini persaingan sesungguhnya terletak pada bagaimana suatu perusahan dapat memanfaatkan e-commerce untuk meningkatkan kinerja dalam bisnis inti yang digelutinya

Perkembangan dunia e-commerce di indonesiaberkembang sedemikian pesat yang diindikasikan perkembangan teknologi kounikasi dan komputer. Perkembangan tersebut diikuti juga oleh perusahaan yang juga berlomba-lomba membangun bisnis secara online. pelaku bisnis mendapatkan desakan perubahan pola perilaku konsumen yang semakin modern,sehingga menjadi sebuah keharusan untuk menggunakan metode elektronik ini dalam melakukan sistem pendukung berbasis penjualan online.

Sesuai semakin bertumbuh kembangnya masyarakat indonesia secara general ,maka perkembangaan.

Banyak perusahaan diindonesia yang telah menerapkan e-commerce dlam menjalankan bisnisnya diantaranya toko FathStudio .Toko yang menjual berbagai macam Universitas Sumatera Utara


(13)

jam tangan pria dan wanita yang berlamatkan dijalan urip no 27 rantau prapat .pada dasarnya perusahaan ini menjual berbagai jam tangan mulai dari alexander christie,bonia ,casio dan banyak lainnya .

Pada dasarnya perusahaan ini hanya melyani penjualan jam disekitar rantau prapat .dikarenakan karena permintaan yang banyak pemilik toko berpikir untuk bergerak juga dibidang penjualan online untuk terus meningkatkan pendapatan. walaupun toko FathStudio ini melakukan promosi secara social media untuk menarik pelanggan untuk datang ketoko ini tapi dirasa kurang cukup.

Berdasarkan latar belakang tersebut maka dapat disimpulkan bahwa perusahan ini membutuhkan sebuah situs online dengan metode pengiriman agar dapat menjangkau konsumen diluar kota rantau prapat untuk menunjang penjualan dan meningkatkan pendapatan. oleh karena itu penulis membuat sebuah situs penjualan online berbasis e-commerce untuk meningkatkan penjualan produk di toko FathStudio.

1.2 Inditifikasi Masalah

Berdasarkan latar belakang perusahaan diatas ,masalah yang akan dibahas dalam tugas akhir ini adalah bagaimana membuat situs online penjualan jam toko FathStudio


(14)

1.3 Rumusan Masalah

Rumusan maslah dalam penulisan tugas akhir ini adalah membuat situs online untuk mempermudah pelanggan dalam pemesanan barang secara online, dengan cara pelanggan mengunjungi situs FathStudio dan memilih barang dengan jenis ,ukuran ,dan lainnya

1.4 Batasan Masalah

Untuk menghindari maslah yang terlalu luas dalam pebahasan ini, maka diperlukan batasan-batasan masalah yang diambil pada tugas akhir ini adalah

a. Aplikasi sistem penjualan ini mempunyai sistem pemesanan barang konsumen dan input data admin mengontrol dan mengecek stok barang yang ada

b. Aplikasi sistem informasi penjualan ini mengambil contoh kasus disebuah perusahaan penjualan jam tangan dengan nama FathStudio

c. Menggunakan slah satu metoda dari sistem informasi yaitu metoda sistem informasi e commerce, dimana aplikasi ini nantinya membantu toko untuk melakukan penjualan secara online.

d. Sistem informasi harga barang, ongkos kirim dan jasa pengantar barang dikirim dengan cara transer ATM.

1.5 Tujuan


(15)

Tujuan penulisan tugas akhir ini adalah sebagai berikut :

a. Untuk membantu penjualan dan mempromosikan produk secara online kepada semua konsumen

b. Memberikan laporan-laporan informasi tentang semua data yang ada dalam sistem tersebut seperti koleksi barang,kategori barang ,provinsi,pelanggan dan transaksi

c. Untuk membantu penjualan produk dengan tidak dibatasi oleh satu tempat dan satu waktu saja, tapi juga proses penjualan dan pembelian dapat dilakukan setiap saat karena akses internet penggunanya 24 jam

1.6 Metodologi Penelitian

Adapun metodologi penelitian yang dilakukan penulis adalah :

1.6.1 Tahap Pengumpulan Data

a. Studi literature

Yaitu mengumpulkan data dari literatur ,jurnal buku-buku tentang yang ada kaitannya dengan judul penelitian.

b. Wawancara(interview)

Yaitu mengadakan tanya jawab dengan orang-orang terkait dengan objek atau masalah yang sedang ditangani oleh penulis.

c. Observasi(observation)


(16)

Yaitu melakukan penelitian dan pengamatan secara langsung mengenai kegiatan sehingga penulis memperoleh data yang akurat.

1.6.2 Metode Waterfall a. Requirement

Langkah pertama yang di ambil dalam metode requirement adalah dengan mewawancarai pihak terkait dilanjutkan dengan pengambilan data yang berupa katalog beserta daftar harga barang.

b. Analysis

Merupakan tahap menganalisis hal-hal yang diperlukan dalam pelaksanaan pengerjaan suatu proyek ssitus online yang dikerjakan penulis

c. Design

Tahap penerjemahan dari data yang dianalisi ke dalam bentuk yang mudah dimengerti oleh user.

d. Coding

Tahap penerjemahan data atau pemecahan masalah yang telah dirancang kedalam pemograman bahasa tertentu.

e. Implementation

Merupakan tahap pengujian situs online yang dibangun

f. Maintenance

Tahap akhir dimana suatu perangkat lunak yang sudah selesai dapt mengalami perubahan perubahan atau penambahan sesuai denegan peermintaan user.


(17)

1.7 Sistematika Penulisan

Sistematika penulisan proposal ini disusun untuk memberikan gambaran umum tentang penelitian yang dijalankan . Sistematika penilisan tugas akhir ini sebagai berikut :

BAB 1 PENDAHULUAN

Pada bab ini diuraikan dan digambarkan secara singkat mengenai Tugas Akhir terdiri dari beberapa sub bab yaitu latar belakang, identifikasi masalah, maksud dan tujuan, batasan masalah, metodologi penelitian, dan sisteatika penulisan

BAB 2 LANDASAN TEORI

Pada landasan teori penulis membahas secara singkat teori-teori dasar yang berhubungan dengan penelitian yang sedang dilakukan dalam proses analisis permasalahan serta tinjauan terhadap penelitian-penelitian serupa yang telah dilakukan sebelumnya mengenai system informasi, website, internet, protocol, TCP/IP, browser, produk, pemesanan, perdagangan elektronik (e-commerce), HTML, PHP, Apache Web Server, Sql, Macromedia, dreamweaver, dan pengertian basis data.

BAB 3 ANALISIS PERANCANGAN SISTEM

Bab ini berisi ruang lingkup website, jenis file yang di gunakan, analisa kebutuhan database, perancangan sistem, gambaran umum pembuatan program dan perancangan halaman website.


(18)

BAB 4 IMPLEMENTASI SISTEM

Pada bab ini berisi uraian pengertian implementasi sistem, komponen dalam implementasi sistem, dan instalasi XAMPP.

BAB 5 KESIMPULAN DAN SARAN

Berisikan kesimpulan dan saran penulisan tugas akhir


(19)

(20)

BAB 2

LANDASAN TEORI

1.1 Sistem Informasi

Sistem adalah sekumpulan elemen atau serangkaian komponen yang saling berhubungan untuk mencapai tujuan yang spesifik atau meyelesaikan suatu sasaran tertentu

Informasi adalah data yang sudah diolah sehingga mempunyai arti tertentu dan dapat menjadi dasar untuk mengambil keputusan

Data adalah representasi fisik dunia nyata, yaitu kenyataan yang menggambarkan suatu kejadian-kejadian dan kesatuan yang nyata. Sistem informasi yaitu :

a. Kumpulan elemen yang saling berhubungan satu sama lain yang membentuk satu kesatuan untuk mengintegrasikan data, memproses dan menyimpan serta mendistribusikan informasi.

b. Kesatauan elemeen yang saling berinteraksi secara sistematis dan teratur untuk menciptakan dan membentuk aliran informasi yang akan mendukung pembuatan keputusan dan melakukan kontrol terhadap jalannya suatu perusahaan

c. Suatu sistem didalam suatu organisasi yang mempertemukan kebutuhan pengolahan transaksi harian mendukung operasi yang bersifat manajerial dan kegiatan strategi dari organisasi serta menyediakan laporan yang diperlukan oleh pihak tertentu.


(21)

Karakteristik sistem yaitu :

a. Komponen Sistem(components)

Dapat berupa suatu subsistem atau bagian bagian sistem, yang mempunyai sifat-sifat dari sistem untuk menjalankan fungsi tertentu dan mempengaruhi proses sistem keseluruhan

b. Batas Sistem(Boundary)

c. Daerah yang membatasi antara suatu sistem dengan sistem yang lainnya atau dengan lingkungan luarnya. Batas sistem ini memungkinkan suatu dipandang sebagai suatu satu kesatuan. Batas suatu sistem menunjukkan ruang lingkup(scope) dari sistem tersebut.

d. Lingkungan Luas Sistem(Environment)

Adapun diluar dari batas sistem yang mempengaruhi operasi sistem. Dapat bersifat menguntungkan dan merugikan sistem.

e. Penghubung Sistem

Media penghubung antara satu subsistem dengan subsistem lainnya sehingga memungkinkan sumber-sumber daya mengalir antara subsistem satu dengan yang lainnya.

f. Masukan Sistem(Input)

Energi yang dimasukkan ke dalam sistem. Dapat berupa maintenence input (energi yang dimasukkan agar sistem dapat beroprasi) dan signal input (energi yang diproses agar dapat keluaran)


(22)

g. Keluaran Sistem

Hasil dari energi yang sudah diolah dan diklarifikasikan /dikelompokkan menjadi keluaran yang berguna dan sisa pembuangan. Keluaran dapat merupakan masukan untuk subsiste yang laiannya atau kepada supra sistem.

h. Pengolah Sistem(process)

Sistem dapat mempunyai bagian pengolah yang akan merubah masukanberupa bahan baku dan bahan-bahan lain menjadi keluaran berupa barang jadi.

i. Sasaran Sistem(Objective)

Sasaran dari sistem sangatmenentukan sekali masukan yang dibutuhkan sistem dan keluaran yang akan dihasilkan sistem. Suatu sistem dikatakan berhasil apabila mengenai sasaran atau tujuannya.

2.2 Website

Website dibangun oleh sebuah file ddidalanya terdapat berbagai kokde-kode dan berbagai informasi. Kode-kode dan informasi tersebut dibaca oleh sebuah aplikasi yangsejenisnya bernama browser, kode-kode dan informasi tersebut akan disajikan sebagai bsebuah halaman homepage yang kita kenal sebagai website. Kode-kode dan informasi yang ditulis dalam file website tersebut harus ditulis menurut suatu aturan tertentu yang dapat dimengerti oleh browser. Aturan-aturan tersebut dikenal dengan bahasa pengkodean. Untuk membuat suatu website bahasa yang digunakan adalah HTML. (Hyper Text Markup Languange). Dengan bahasa inilah sebuah browser akan mengubah isi file homepage menjadi sebuah website. Setiap kita mengakses dokumen website, pada saat itu kita mengambil sebuah file yang ditulis dalam format HTML (Hyper Text Markup Languange).


(23)

2.3 Internet

Internet brasal dari kata Interconnection Network yang mempunyai arti hubungan komputer dengan berbagai tipe dan sistem yang berbeda yang membentuk sistem jariangan yang mencakup seluruh dunia (jaringan komputer global) dengan melalui telekomunikasi. Jaringan komputer ini sangat luas sehingga tidak ada satu orang ,satu organisasi,atau satu negara yang menanganinya sendiri. Asal usul internet dari jaringan komputer yang disususn oleh ARPA (Advance Research Project Agency) yang bernaung dibawah departemen pertahanan amerika serikat atau DoD (Departement of defence) sehingga terbentuk APRA net, jaringan komputer bentukan departemen pertahanan amerika serikat, tahun 70. Pada awalnya,APRA net hanya menghubungkan 4 buah situs saja, yaitu :

a. SRI(Stanford Research Institute).

b. USCB(University of California at Santa Barbara)

c. UCLA(University of California ar Los Angeles)

d. University of Utah at Utah

Jaringan tersebut selanjutnya diperbaharui dan dikebangkan,dan saat ini digunakan sebagai tulang punggung jaringan informasi yang disebut internet. Penelitian di stanford

menghasilkan sebuah protokol yang disebut TCP/IP, inilah yang berkembang teus hingga sekarang dan menjadi protokol standard dalam internet.


(24)

2.4 Protokol TCP/IP

Protokol yang digunakan sebagai format transisi data pada jaringan internet adalah TCP/Ip. TCP/Ip berasal dari dua protokol yang sangat penting yaitu TCP (Transmission Control Protocol) dan Ip (Internet Protocol). Sebagai gambaran, bila anda mengirim e-mail ke seorang teman di negara lain, TCP akan membagi pesan tersebut ke dalam paket data yang kecil-kecil. Setiap paket data akan ditandai dengan nomor urut dan alamat tujuan. Selain itu, TCP akan menyetarakan informasi untuk mengontrol jika terjadi kesalahan transmisi. Selanjutnya, paket-paket data dikirim melalui jaringan komputer, dimana dalam tahap ini IP membawa paket data ke alamat tujuan. Pada alamat tujuan TCP menerima paket-paket data, memeriksa kesalahan, serta menyusun paket-paket-paket-paket data tersebut menjadi pesan asli yang dikirimkan.

TCP/Ip terdiri atas empat lapis kumpulan protokol yang bertingkat. Empat tingkat itu adalah:

a. Application Layer, yaitu layer yang bertanggun jawab atas aplikasi-aplikasi yang menggunakan TCP/Ip

b. Transport Layer, yaitu layer yang bertanggung jawab memberikan layanan pengiriman data dari suatu node ke node yang lain.

c. Internet Layer, yaitu layer yang menentukan jenis data gram dan menangani perutean data yang dikirim.

d. Network Interface Layer, yaitu layer yang bertanggung jawab untuk mengirim dan menerima data pada media fisik transmisi yang digunakan.

Untuk menggunakan layanan internet, seseorang dengan perangkat komputer harus terhubung ke internet, baik secara dial out yaitu menggunakan modem melalui saluran telepon menghubungi ISP(Internet Service Provider), atau melalui jaringan komputer local Universitas Sumatera Utara


(25)

yang sudah terhubung dengan internet. Kita dapat berada dirumah, sekolah ataupun kantor. Selanjutnya kita dapat memeriksa dan membaca e-mail yang masuk, berkirim e-mail, membaca artikel-artikel dalam nesgroup, membaca web pages, atau bermain gamme dengan rekan-rekan di seluruh dunia.

2.5 Browser

Bowser adalah sebuah program yang berfungsi untuk menjelajahi halaman-halaman web yang terdapat dalam internet. Menjelajahi atau sering disebut sebagai browsing adalah suatu aktifitas membuka atau menuju ke situs-situs (server-server) web dan membaca informasi yang terdapat didalamnya.

Netscape Navigator adalah program browser yang banyak digunakan, selain itu terdapat juga produk microsoft yang sangat terkenal yaitu Internet Explorer. Beberapa kommponen

browser:

a. Menu

Terletak dibagian atas jendela browser, terdiri deretan menu yang engandung perintah-perintah untuk pengaturan, memanipulasi tampilan, serta menjalankan perintah-perintah browser.

b. Toolbar

Toolbar adalah tombol-tombol navigasi yang digunakan untuk menjelajahi halaman-halaman internet. Tombol-tombol tersebut antara lain forward untuk menujukehalamn berikutnya, back untuk menuju kehalaman sebelumnya, stop untuk menghentikan download (pengambilan data) halaman, search untuk menuju

search engine (situs web pencari informasi), refresh/reload untuk mendownload (pengambilan data) ulang halaman, home untuk kembali ke halaman default Universitas Sumatera Utara


(26)

browser. Selain tombol-tombol tersebut terdapat tombol-tombol lain yang bersifat spesifik untuk setiap browser.

c. Bookmark (netscape)/favorites

Berisi halaman-halaman web yang sudah disipan agar user dapat langsung menuju alamat tersebut tanpa harus kesulitan dalam mengetikan atau menghafalkan lokasinya, Alamat URL disimpan agar mempermudah pengaksesan di kemudian hari.

d. Location Toolbar

Text box ini merupakan alamat lengkap dari halaman yang sedang anda lihat. Anda dapat mengetikan alamat yang akan dituju baik yang berada di internet maupun yang ada di komputer local.

e. Logo Netscape atau Internet Explorer

Berguna untuk memantau penerimaan data, saat proses download sedang berlangsung maka log terlihat melakukan gerakan bila download halaman web selesai logo berupa gambar diam.

f. Layar Utama Browser

Layar ini merupakan tempat tampilan halaman web, yang berisi text, gambar, serta animasi dan iteraksi multimedia.

g. Status bar

Terdapat pada bagian kiri bawah layar utama. Terdiri bagian yang menujukkan kemajuan download halaman web dan pesan status yang menunjukan URL yang sedang ditapilkan, URL dari suatu letak (loncatan ke halaman lain) serta pesan-pesan khusus tertentu. Universitas Sumatera Utara


(27)

2.6 Produk

Salah satu komponen bauran pemesanan yang terpenting adalah produk. Keberadaannya merupakan penentu bagi program bauran pemasaran yang lai, misalnya penentu harga, program promosi, maupun kegiatan pendistribusiannya, selain itu produk adalah sesuatu yang essensial mampu untuk memenuhi kebutuhan pasar.

Produk juga dapat diartikan sebagai segala sesuatu (meliputi objek fisik, jasa tempat, organisasi, gagasan ataupun pribadi) yang dapat atau mampu ditawarkan produsen untuk diminta, dicari, dibeli, digunakan atau dikonsumsi pasar sebagai pemenuh kebutuhan dan keinginannya.

2.7 Pemesanan

Merupakan suatu proses kegiatan untuk suatu perintaan kepada produsen penyedia barang atau jasa yang dilakukan oleh individu atau kelompok untu memenuhi kebutuhan akan barang dan jasa yang akhirnya akan menimbulkan suatu proses jual beli antara pihak konsumen dan produsen. Dengan kata lain, pemesanan adalah komunikasi saluran ke belakang mengenai minat membeli oleh anggota saluran pemasaran ke produsen.

Adapun pemesanan yang diterima perumahan dari pelanggannya umumnya disebut pesanan penjualan, sedangkan pesanan yang dibuat perubahannya pada pemasoknya disebut pembelian.


(28)

Perdaganan Elektronik, atau Electric Commerce (EC) adalah sebuah sistem perniagaan dan jual beli yang banyak menggunakan kemudahan teknologi maklumat terutama telekomunikasi canggih sehingga dapat melindungi dan memuaskan penggunaan-penggunaan yaitu yang terdiri daripada penjual, pembeli, dan pihak-pihak yang ketiga seperti bank, syarikat keungan, syarikat kartu kredit, pengeluar sijil pengesahan digital dan lain-lain. Kebelakangan ini, banyak masyarakat menggunakan internet khususnya web untuk mengadakan satu rangkaian yang menyatukan pelanggan, penjual, dan pihak-pihak ketiga dalam satu perserikatan elektronik yang selamat untuk semua pihak dan boleh dipercayai.

Media elektronik yang digunakan disini adalah jaringan internet karena internet sudah dikenal oleh banyak orang dan penggunaannya juga sangat mudah. Namun hal ini pada suatu saat nanti tidak menutup kemungkinan untuk menggunakan jaringan yang lainnya.

2.8.1 Jenis E-Commerce

E-commerce dapaat dibagi menjadi dua jenis, yaitu Business to Business (B2B) dan Business to Costumer (B2C, Retail) kedua jenis E-commerce ini memiliki karakteristik berbeda

Business to Business E-commerce memiliki karakteristik:

a. Trading partners yang sudah diketahui dan umumnya memiliki hubungan

(relationship) yang cukup lama. Informasi hanya dipertukarkan dengan partners tersebut. Dikarenakan sudah mengenal lawan komunikasi, maka jenis informasi yang dikirimkan dapat disusun sesuai dengan kebutuhan dan kepercayaaan.

b. Pertukaran data (data exchange) berlangsung berulang-ulang dan secara berkala, misalnya setiap hari, dengan format data yang sudah disepakati bersama. Dengan Universitas Sumatera Utara


(29)

kata lain, servis yang digunakan sudah tertentu. hal ini memudahkan pertukaran data untuk dua entiti yang menggunakan standar yang sama.

c. Salah satu pelaku dapat melakukan inisiatif untuk mengirimkan data, tidak harus menunggu partnernya.

d. Model yang umum digunakan adalah peer-to-peer, dimana proses intelejensi dapat dilakukan dikedua pelaku bisnis.

Topic-topik yang juga mungkin termasuk dalam Business to Business E-commerce

adalah electronic/internet procurement dan ERP (Enterprice Resource Planning). Hal ini adalah implementasi penggunaan teknologi informasi pada perusahaan dan pada manufacturing. sebagai contoh, perisahaan Cisco maju pesat dikarenakan menggunakan penggunaan teknologi informasi sehingga dapat menjalankan just in time manufacturing

untuk produksi produknya.

Business to Costumer E-commerce memiliki karakteristik sebagai berikut : a. Terbuka untuk umum,dimana informasi disebarkan ke umum.

b. Servis yang diberikan bersifat umum denagan mekanisme yang dapat digunakan leh khalayak ramai. Sebagai contoh , karena sistem web sudahumum digunakan maka servis diberikan dengan menggunakan basis web.

c. Servis diberikan berdasarkan permohonan. Konsumen melakukan inisiatif dan prosedur harus siap memberikan respon sesuai dengan permohonan.

d. pendekatan client/server sering digunakan dimana diambil asumsi client(costumer)menggunakan sistem yang minimal(berbasis web) dengan processing(business procedure) diletakkan disisi server.


(30)

Business to Costumer E-commerce Business to Costumer E-commerce memiiki permaslahan yang berbeda . Mekanisme untuk mendekati konsumen pada saat ini mengunakan bermacam-macam pendekatan seperti misalnya dengan menggunakan electronic shopping mall atau menggunakan konsep portal.

Electronic Shopping Mall menggunakan web sites untuk menjalankan produk dan servis. Para penjual produk dan servis membuat sebuah storefront yang menyediakan catalog produk dan servis yang tersedia seperti halnya dalam kehidupan sehari-hari dengan melakukan window shopping, Bedanya, calon pembeli dapat melakukan shopping ini kapan saja dan darimana saja dia berada tanpa dibatasi oleh jam buka toko

2.8.2 Kegiatan Yang Berhubungan Dengan E-Commerce

Kegiatan yang berhubungan dengan E-commerce :

a. Perdagangan online melalui www (world wide web)

b. Transaksi online bisnis antar perusahaan

c. Internet banking, pengecekan saldo melalui internet, mengganti nomor pin ATM, Transfer antar rekening dan berbagai macam kemudahan sistem pembayaran tagihan lainnya.

d. TV interaktif, internet melalui TV, akses web memalui TV (Interactive Television) berkembang dieropa

e. WAP (Wireless Application Protocol), dengan menggunakan handphone dapat melakukan segala macam transaksi yang diinginkan. Seperti pebelian tiket, pemesanan barang dan sebagainya.


(31)

2.8.3 Keuntungan E-Commerce Keuntungan dari E-Commerce

a. Aliran pendapatan (Revenue Stream) yang lebih menjajikan. b. Dapat meningkatkan pangsa pasar

c. Menurunkan biaya operasional(operating cost) d. Melebarkan jangkauan (global reach)

e. Meningkatkan costumer loyalty

f. Meningkatkan supplier management g. Memperpendek waktu produksi h. Meningkatkan mata rantai pendapatan

2.8.4 Resiko dan Kerugian E-Commerce Resiko dari E-commerce :

a. Kehilangan segi financial secara langsung karena kecurangan. b. Pencurian informasi rahasia yang berharga.

c. kehingan kesempatan bisnis karena gangguan pelayanan. d. Penggunaan akses ke sumber oleh pihak yang tidak berhak e. Kehilangan kepercayaan dari para konsumen.

f. Kerugian-kerugian yang tidak terduga.


(32)

2.9 HTML (Hyper Text Markup Languange)

HTML (Hyper Text Markup Languange) adalah sebuah bahasa markup yang diganakan untuk membuat sebuah halaman webdan menampilkan berbagai informasi didalam sebuah

browser internet. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan didunia penerbitan dan perceetakan yang disebut dengan SGML ( Standard Generalized Markup Languange), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar internet yang didefenisikan dan dikendalikan penggunanya oleh W3C (World Wide Web Consortium)

2.10 PHP (Hypertext Processor)

PHP singkatan dari PHP Hypertext prepocessor. Ia menerapkan bahasa berbentuk script yang ditempatkan dalam server dan diproses diserver. Hasilnya yang dikirimkan ke klien, tempat pemakai menggunakan browser

Kelahiran PHP bermula saat rasmus ledorf membuat sejumlah scrip perl yang dapat mengamati siapa saja yang melihat-lihat daftar riwayat hidupnya, yakni pad atahun 1994. skrip-skrip ini selanjutnya dikemas menjadi tool yang disebut "Personal Home Page". Paket inilah yang menjadi cikal bakal PHP. Pada tahun 1995, Rasmus menciptakan PHP/F1 Versi 2. Pada versi inilah pemograman dapat menampilkan kode terstruktur didalam tag HTML. Yang menarik, kode PHP juga bisa berkomunikasi dengan database dan melakukan perhitungan-hitungan yang kompleks sambil berjalan.

Pada saat ini, PHP cukup popular sebagai piranti pemograman web, terutama dilingkungan linux. Walaupun demikian, PHP sebenarnya juga dapat berfungsi pada server-server yang berbasis UNIX, Windows NT, dan Machintos. Bahkan versi untuk windows 95/98 pun tersedia. Universitas Sumatera Utara


(33)

Pada awalnya PHP dirancang untuk mengintegrasikan dengan web server cache.Namun, Belakangan PHP juga dapat bekerja dengan web server seperti PWS(Personal Web Server),IIS (Internet Information Server) ,dan Xitami.

Untuk mencoba PHP, Anda tidak perlu menggunakan komputer berkelas server. Dengan hanya sebuah komputer biasa, anda bisa mempelajari dan mempraktekkan PHP.

2.10.1 Konsep Kerja PHP

Model kerja HTML diawali dengan perintaan suatu halaman web oleh browser. Berdasarkan URL(Uniform Resource Locator) atau dikenal dengan sebuah alam internet,

browser mendapatkan sebuah alamat dari web server,mengidentifikasi halaman yang dikehendaki, dan menyampaikan segala informasi yang dibutuhkan oleh web server.

Selanjutnya, web server akan mencarikan berkas yang diminta dan memberikan isinya kebrowser. browser yang mendapatkan isisnya segera melakukan proses penerjemahan kode HTML, dan menampilkan ke layar pemingkai

2.10.2 Kelebihan dari PHP

Salah satu kelebihan dari PHP adlah mampu berkomunikasi dengan berbagai database yang terkenal. Dengan demikian, menampilkan data yang bersifat dinamis, yang diambil dari database, merupakan hal yang mudah diimplementasikan. Itulah sebabnya sering dikatakan bahwa PHP sangat cocok untuk membangun halaman-halaman web dinamis.


(34)

Pada saat ini PHP sudah dapat berkomunikasi dengan berbagai database meskipun dengan kelengkapan yang berbeda-beda . Beberapa diantaranya adlah MySql,Oracle,Sybase, dan lain-lain.

2.11 Apache Web Server

Web Server adalah software yang menjadi tulang belakang dari World Wide Web (WWW). Web Server menunggu permintaan dari client yang mmenggunakan browser

seperti Netscape Navigator, Internet Explorer, Mozzila Firefox, 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 standar, disebut dengan format SGML (Standar General Markup Language). Data yang berupa format ini kemudian akan ditampilkan oleh

browser sesuai dengan kemampuan browser tersebut.

2.12 SQL (Structure Query Language)

Antar muka standar sistem manajemen basis data relasional, termasuk sistem yang beroperasi pada komputer pribadi. SQL memungkinkan seorang pengguna untuk mengakses informasi tanpa mengetahui dimana lokasinya atau bagaiman

Informasi tersebut disusun. SQL lebih mudah digunakan dibandingkan dengan pemrograman tetapi lebih rumit dibanding software lembar kerja dan pengolah kata. Sebuah pernyataan SQL yang sederhana dapat menghasilkan set permintaan untuk informasi yang tersimpan pada komputer yang berbeda di berbagai lokasi yang tersebar, sehingga mmembutuhkan waktu dan sumber daya komputasi yang banyak. SQL dapat digunakan untuk investigasi interatif atau pembuatan lampiran ad hoc atau disisipkan


(35)

Bahasa pemrograman yang dirancang khusus untuk mengirimkan suatu perintah query (pengaksesan data berdasarkan pengalaman tertentu) terhadap sebuah database. Kebanyakan software database yang ada saat ini dapat diakses melalui SQL. Setiap aplikasi yang spesifik dapat mengimplementasikan SQL secara sedikit berbeda, tapi seluruh database SQL mendukung subset standar yang ada.

2.13 Macromedia Dremweaver

Macromedia Dremweaver adalah sebuah HTML editor professional untuk mendesain secara visual dan mengelola situs web maupun halaman web. Bilamana kita menyukai untuk berurusan dengan kode-kode HTML secara manul atau lebih menyukai bekerja dengan lingkungan secara visual dalam melakukan editing, Dreamweaver membuatnuya menjadi lebih mudah dengan menyediakan tool-tool yang sangat berguna dalam peningkatan kemampuan dan pengalaman kita dalam mendesain web.

Dreamweaver dalam hal ini digunakan untuk web desain. Dreamweaver mengikut sertakan banyak tool untuk kode-kode dalam halaman web beserta fasiltas- fasiltasnya, antara lain: Referensi HTML, CSS dan Javascript, Javascript debugger, editor kode (tampilan kode dan code inspector) yang mengizinkan kita mengedit kode Javascript, XML, dan dokumen teks lain secara langsung dalam Dreamweaver. Teknologi

Dreamweaver roundtrip HTML mampu mengimpor dokumen HTML tanpa perlu memformat ulang kode tersebut dan kita dapat menggunakan Dreamweaver pula untuk embersihkan dan memformat ulang HTML bila kita menginginkannya.

Selain itu Dreamweaver juga dilengkapi kemampuan manajemen situs, yang memudahkan kita mengelola keseluruhan elemen yang ada dalam situs. Kita juga dapat Universitas Sumatera Utara


(36)

melakukan evaluasi dengan melakukan pengecekan broken link,, kompatibilitas browser, maupun perkiraan waktu download halaman web.

2.14 Pengertian Basis Data

Basis Data (database) adalah kumpulan dari berbagai data yang berhubungan satu dengan yang lainnya. Basis data tersimpan di perangkat keras, serta dimanipulasi dengan menggunakan perangkat lunak. Pendefinisian basis data meliputi spesifikasi dari tipe data, sturktur dan batasan dari atau informasi yang akan disimpan. Database merupakan salah satu komponen yang penting dalam sistem informasi, karena merupakan basis dalam menyediakan informasi pada para pengguna atau user.

a. Sistem Basis Data

Sistem basis data adalah suatu sistem penyusunan dan pengelolaan record-record dengan menggunakan komputer, dengan tujuan untuk menyimpan atau merekam serta memelihara data operasional lengkap sebuah organisasi/perusahaan, sehingga mampu menyediakan informasi yang optimal yang diperlukan pemakasi untuk kepentingan proses pengambilan keputusan.

b. Flowmap

Flowmap adalah bagan aliran yang menunjukan akhir dalam program atau prosedur sistem secara manual. Digunakan terutama sebagai alat bantu komunikasi dan dokumentasi.

c. ERD (Entity Realitionship Model)

ERD (Entity Realitionship Model) adalah model konseptual yang mendeskripsikan hubungan antara penyimpanan. ERD digunakan untuk memodelkan struktur data Universitas Sumatera Utara


(37)

dan hubungan antar data. Dengan ERD, mmodel dapat diuji dengan mengabadikan proses yang dilakukan.

Model data adalah kumpulan perangkat konseptual untuk menggammbarkan data, hubungan data, semanti data, dan batasan data. Ada 2 komponen utama pembentuk Model ERD yaitu Entitas dan Relasi. Entitas (Entity) ialan individu yang mewakili sesuatu yang nyata dan dapat dibedakan dari sesuatu yang lain. Himpunan Entitas ialah sekelompok entitas yang sejenis dan berada dalam lingkup yang sama. Atribut mendeskirpsikan kaarakteristik dari suatu entitas.

Relasi menunjukkan adanya hubungan diantar sejumlah entitas yang berasal dari himmpunan entitas yang berbeda. Himpunan relasi dibentuk dari kumpulan semua diantara entitas- entitas yang terdapat pada himpunan entitas-himpunan entitas tersebut. Sering disebut sebagai realasi aja.

ERD pertama kali dideskripsikan oleh Peter Chen yang dibuat sebagai bagian dari perangkat lunak CASE. Notasi yang digunakan dalam ERD, yaitu:

1. Kardinalitas Relasi

Dalam ERD, hubungan (relasi) dapat terdiri dari sejumlah entitas yang disebut derajat relasi. Derajat relasi maksimum disebut dengan kardinalitas, sedangkan derajat minimum disebut dengan modalitas. Jadi kardinalitas relasi menunjukkan jumlah maksimum entitas yang dapat berelasi dengan entitas pada himpunan entitas lain. Kardinalitas relasi yang terjadi diantara dua himpunan entitas (misalnya A dan B) dapat berupa:


(38)

a. Satu ke satu (one to one/1-1)

Setiap entitas pada himpunan entitas A dapat berelasi dengan paling banyak 1 (satu) entitas pada himpunan entitas B, demikan juga sebaliknya. Contohnya pria menikahi wanita (asumsu tidak ada poligami).

b. Satu ke banyak (one to many / 1-N)

Setiap entitas pada himpunan entitas A dapat berhubungan dengan banyak entitas pada himpunan entitas B, tetapi tidak sebaliknya , dimana setiap entitas pada himpunan entitas B berhubungan dengan paling banyak dengan satu entitas pada himpunan entitas A. Contohnya Ibu mempunyai anak.

c. Banyak ke banyak (many to many / N-N)

Setiap entitas pada himpunan entitas A dapat berelasi dengan banyak entitas pada himpunan B, demikian juga sebaliknya.

2. Tahapan Pebuatan ERD

Diagram ER dibuat secara bertahap, ada dua kelompok pertahapan yang biasa ditempuh didalam pembuatan diagram ER, yaitu:

a. Tahap pembuatan diagramm ER awal (Preliminary Design). b. Tahap optimasi diagram ER (Final design).

d. DFD (Data flow Diagram)

Diagram konteks adalah diagram yang terdiri dari suatu proses dan menggabungkan ruang lingkup suatu sistem. Diagra konteks merupakan level tertinggi dari DFD yang menggabarkan seluruh input kesistem atau Universitas Sumatera Utara


(39)

output dari sistem. Ia akan memberikan gambaran tentang seluruh sistem. Sistem dibatasi oleh boundary (dapat digambarkan dengan garis putus). Dalam daigram konteks hanya ada satu proses . Tidak boleh ada store dalam diagram konteks.

e. Normalisasi

Proses normalisasi adlah proses untuk memperoleh property-properti skema relasi yang bagus menjadi bentuk normal lebih tinggi sehingga dapat mengoptimalkan redudansi (pengulanagan data yang tidak perlu) dan menghilangkan anomaly.

2.15 Kamus Data

Kamus data adalah catalog fakta tentang data dan kebutuhan kebutuhan informasi dari suatu sistem. Kamus data selain digunakan untuk dokumentasi dan mengurangi redudansi, juga dapat digunakan untuk :

a. Memvalidasi diagram aliran data dalam hal kelengkapan dan keakuratan

b. Menyediakan suatu titik awal untuk mengembangkan layar dan laporan-laporan c. Menentukan muatan data yang disimpan dalam file-file

d. Mengembangkan logika untuk proses-proses diagram aliran data.


(40)

(41)

BAB 3

PERANCANGAN SISTEM

Seiring dengan perkembangan teknologi informasi saat ini, serta untuk meningkatkan efesiensi kerja dan waktu. Masih banyak sistem yang ada pada saat ini, masih menggunakan sistem manual dan harus di perbaharui dengan sistem yang lebih baik lagi. Hal ini dilakukan dengan cara membangun sistem yang terkomputerisasi atau online. Untuk memulai membangun suatu program mengenai perancangan web ecommerce, maka penulis terlebih dahulu merencanakan alur kerja berdasarkan kebutuhan dari user yang akan menggunakan aplikasi basis data ini.

Perancangan sistem web ecommerce ini di bangun atas kebutuhan masyarakat yang menginginkan cara berbelanja secara online, sehingga dapat menghemat waktu. Perancangan merupakan proses yang dilakukan oleh perancang sistem untuk mengerjakan spesifikasi sistem, membuat keputusan tentang bagaimana komponen sistem diaktualisasi. Proses ini menyangkut tujuan sistem tersebut, audience, objek dan informasi domain. Perancangan yang baik harus mengetahui bagaimana mendapatkan efek yang dibutuhkan oleh spesifikasi tersebut dengan cara paling fleksibel, efisien, dan elegan.


(42)

3.1Data Flow Diagram

Data flow diagram (DFD) merupakan dari sistem untuk menggabarka pembagian sistem ke modul yang lebih kecil. Salah satu keuntungan menggunakan diagram alir data adalah memudahkan pemakai yang kurang menguasai bidang komputer untuk mengerti sistem yang sedang dikerjakan Pada tahap analisa , penanganan notasi simbol lingkaran dan anak panah menggambarkan arus data dalam perancangan sistem sangat membantu dala komunikasi dengan pemakai sistem menggunakan notasi-notasi yang menggabarkan arus dari data sistem.

Disamping itu DFD adalah salah satu alat pembuatan model yang sering digunakan, khususnya bila fungsi-fungsi sistem merupakan bagian yang lebih penting dan kompleks daripada data yang dimanipulasi oleh sistem. Dengan kata lain, DFD adalah alat pembuatan model yang memberikan penekanan hanya pada fungsi sistem.

DFD juga meripakan alat perancangan sistem yang berorientasi pada alur data dengan konsep dekomposisi dapat digunakan untuk penggambaran analisa maupun rancangan sistem yang mudah dikomunikasikan oleh profesional sistem kepada pemakai maupun pembuat program. adapun Data Flow Diagram(DFD) yang penulis ajuka yaitu :

3.2Flowchart

Flowchart adalah sekumpulan simbol-simbol yang menunjukkan atau menggambarkan rangkaian kegiatan-kegiatan program dari awal hingga akhir, jadi flowchart juga digunakan untuk menggambarkan urutan langkah-langkah pekerjaan disuatu algoritma. Penjelasan arti lambang-lambang flowchart dapat didefenisikan seperti tabel berikut:


(43)

No Simbol Fungsi

1

Terminator, untuk memulai dan mengakhiri suatu program.

2

Process, suatu simbol yang menunjukkan setiap

pengolahan yang dilakukan oleh komputer.

3

Data, digunakan untuk memasukkan data maupun menunjukkan hasil dari suatu proses

4

Decision, suatu kondisi yang akan menghasilkan beberapa kemungkinan jawaban atau pilihan.

5

Preparation, suatu simbol yang menyediakan

tempat-tempat pengolahan data dalam

storage.

6

Connector, merupakan simbol untuk masuk dan

keluarnya suatu prosedur pada lembar kertas yang sama.

7

Off-Page Connector, merupakan simbol untuk masuk dan keluarnya suatu prosedur pada lembar kertas yang lain.

8

Arus atau flow, prosedur yang dapat dilakukan dari atas ke bawah, bawah ke atas, Tabel 3.1 Tabel Flowchart


(44)

dari kiri ke kanan, atau dari kanan ke kiri.

9

Document, merupakan simbol untuk data yang berbentuk informasi.

10

Predefined process, digunakan untuk menyatakan sekumpulan langkah proses yang ditulis sebagai prosedur.


(45)

3.2.1 Flowchart Pemesanan Produk

Mulai Belanja

Halaman Produk

Pilih Produk

Keranjang Belanja

Selesai Tidak

Ya

A

B

Keluar

A

Form Pengisian data pembeli

Isi Data

Lengkap

Rincian Pembelian

Selesai Ya

Tidak

B Pilih

Ya

Tidak

Gambar 3.1 Alur Flowchart Pemesanan Produk


(46)

3.3Perancangan Database

Database sebagai tempat penyimpanan data merupakan salah satu aspek penting yang akan menentukan mutu kerja dari program yang akan dibuat. Pada umumnya, database telah disiapkan untuk menghasilkan informasi tertentu yang dikehendaki struktur database

3.3.1 Tabel Admin

Tabel 3.2 Tabel Admins

Field Name Data Type Size Description username Varchar 50 Nama Pengguna

password Varchar 50 Kata Sandi nama_Lengkap Varchar 100 Nama Lengkap

email Varchar 100 Email pengguna No_telp Varchar 20 Nomor pengguna

Level Varchar 20 Tingkatan Blokir Enum ‘Y’,‘N’ Blokir


(47)

3.3.2 Tabel Bank

Tabel 3.3 Tabel Bank

Field Name Data Type Size Description

id_bank Int 5 Nomor identifikasi bank nama_bank Varchar 100 Nama bank

no_rekening Varchar 100 Nomor rekening pengguna pemilik Varchar 100 Yang memiliki rekening bank gambar Varchar 100 Gambar pengguna

3.3.3 Tabel Banner

Tabel 3.4 Tabel Banner

Field Name Data Type Size Description

Id_banner Int 5 Logo

judul Varchar 100 Judul program url Varchar 100 Alamat situs gambar Varchar 100 Gambar situs Tgl_posting date Tanggal di situs


(48)

3.3.4 Tabel Download

Tabel 3.5 Tabel Download

Field Name Data Type Size Description

Id_download Int 5 Nomor identitas download Judul Varchar 100 Nama download

Nama_file Varchar 100 Nama file

Tgl_posting Date Tanggal

hits Int 3 File yang di download

3.3.5 Tabel Header

Tabel 3.6 Tabel Header

Field Name Data Type Size Description

Id_header Int 5 Id kepala program Judul Varchar 100 Nama situs

url Varchar 100 Link atau alamat website gambar Varchar 100 Gambar program

Deskripsi Varchar 200 Penjelasan program Tgl_posting Date Tanggal postingan


(49)

3.3.6 Tabel Hubungi

Tabel 3.7 Tabel Hubungi

Field Name Data Type Size Description

Id_hubungi Int 5 Nomor yang bisa dihubungi

Nama Varchar 50 Nama Pengguna

Email Varchar 100 Alamat email pengguna Subjek Varchar 100 Subjek pengguna

Pesan Text Pesan kepada pengunjung situs

tanggal Date Tanggal di program

3.3.7 Tabel Kategori

Tabel 3.8 Tabel Kategori

Field Name Data Type Size Description

Id_kategori Int 5 Kategori produk Nama kategori Varchar 100 Status Pesanan

Kategori_seo Varchar 100 Sub kategori


(50)

3.3.8 Tabel Komentar

Tabel 3.9 Tabel Komentar

Field Name Data Type Size Description

Id_komentar Int 5 Nomor komentar

Id_produk Int 5 Kode produk

Nama_komentar Varchar 100 Nama dari komentar url Varchar 100 Link komentar Isi_komentar Text Isi dari komentar

Tgl Date Tanggal dari komentar

Jam_komentar Time Jam komentar diberikan Aktif Enum('Y','N') Pengguna yang aktif

3.3.9 Tabel Kota

Tabel 3.10 Tabel Kota

Field Name Data Type Size Description

Id_Kota Int 3 Kota pengguna

Id_Perusahaan Int 10 Nomor id perusahaan Nama_kota Varchar 100 Nama kota pengguna Ongkos_kirim Int 100 Jumlah ongkos kirim


(51)

3.3.10 Tabel Kustomer

Tabel 3.11 Tabel Kustomer

Field Name Data Type Size Description

Id_Kustomer Int 5 Nomor id pelanggan Password Varchar 50 Password pelanggan Nama_lengkap Varchar 100 Naa lengkap pelanggan

Alamat Text Alamat pelanggan

Email Varchar 100 Email pelanggan

Telepon Varchar 20 Nomor telepon pelanggan Id_kota Int 5 Nomor id kota pelanggan

Aktif Enum('N','Y') Pelanggan yang aktif

3.3.11 Tabel Mainmenu

Tabel 3.12 Tabel Mainmenu

Field Name Data Type Size Description

Id_Main Int 5 Nomor id main menu

Nama_menu Varchar 50 Nama menu

Link Varchar 100 Sambungan

Aktif Enum('N'.'Y')


(52)

3.3.12 Tabel Modul

Tabel 3.13Tabel Modul

Field Name Data Type Size Description

Id_modul Int 5 \nomor id modul

Nama_modul Varchar 50 Nama modul

Link Varchar 100 Sambungan dengan link lain

Static_content Text Julah konten

Gambar Varchar 100 Gambar modul

Status Enum('user','admin') Status admin Aktif Enum('Y'.'N') Aktifnya admin

Urutan Int 5 Urutan pengguna

3.3.13 Tabel Orders

Tabel 3.14Tabel Orders

Field Name Data Type Size Description

Id_orders Int 5 Nomor id pesanan

Status_order Varchar 50 Status pemesanan

Tgl_order Date Tanggal pemesanan

Jam_order Time Jam pemesanan

Id_kustomer Int 5 Nomor id pelanggan


(53)

3.3.14 Tabel Orders_Detail

Tabel 3.15Tabel Orders_Detail

Field Name Data Type Size Description

Id_Orders Int 5 Nomor id pesanan

Id_produk Int 5 Nomor id barang

Jumlah Int 5 Jumlah barang pesanan

3.3.15 Tabel Order_Temp

Tabel 3.16Tabel Orders_Temp

Field Name Data Type Size Description

Id orders temp Int 5 Ketentuan Id pesanan

Id_produk Int 5 Nomor id berang

Id_session Varchar 100 Sesi pengunjung

Jumlah Int 5 Jumlah barang

Tgl_order_temp Date Ketentuan tanggal pemesanan Jam_order_temp Time Ketentuan jam pemesanan

Stok_temp Int 5 Stok barang yang ada


(54)

3.3.16 Tabel Poling

Tabel 3.17Tabel Poling

Field Name Data Type Size Description

Id_poling Int 5 Nomor id hasil undi Pilihan Varchar 100 Pilihan pesanan

Status Varchar 20 Status pesanan Rating Int 5 Nilai rating barang

Aktif Enum('Y','N') Aktif pengguna

3.3.17 Tabel Produk

Tabel 3.18Tabel Produk

Field Name Data Type Size Description

Id_produk Int 5 Nomor id barang

Id_kategori Int 5 Nomor id kategori Nama_produk Varchar 100 Nama barang

Produk_seo Varchar 100 Jenis barang

Deskripsi Text Penjelasan tentang barang

Harga Int 20 Harga barang

Stok Int 5 Jumlah barang yang tersedia Berat Decimal(5,2) Berat barang

Tgl_masuk Date Tanggal masuk barang

gambar Varchar 100 Gambar barang

Dibeli Int 5 Barang yang dibeli


(55)

Diskon Int 5 Diskon barang Status Varchar 10 Status barang

Review Text Tinjauan tentang barang

3.3.18 Tabel Sekilas Info

Tabel 3.19Tabel Sekilas Info

Field Name Data Type Size Description

Id_sekilas Int 5 No id berita Info Varchar 100 Info berita

Tgl_posting Date Tanggal memposting berita Gambar Varchar 100 Gambar berita

3.3.19 Shop_Pengiriman

Tabel 3.20 TabelShop_Pengiriman

Field Name Data Type Size Description

Id_perusahaan Int 10 Nomor id perusahaan Nama_peerusahaan Varchar 100 Nama perusahaan

Alias Varchar 100 Nama singkat Gambar Varchar 100 Gambar perusahaan


(56)

3.3.20 Tabel Statistik

Tabel 3.21Tabel Statistik

Field Name Data Type Size Description

Ip Varchar 20 Data ip

Tanggal Date Tanggal

Hits Int 10 Yang masuk ke situs

Online Varchar 225 Jumlah orang yang online

3.3.21 Tabel Submenu

Tabel 3.22Tabel Submenu

Field Name Data Type Size Description

Id_sub Int 5 Nomor id sub menu

Nama_sub Varchaar 50 Nama sub menu

Link_sub Varchar 100 Sambungan link sub menu

Id_main Int 5 Id utama


(57)

3.3.22 Tabel Tag

Tabel 3.23Tabel Tag

Field Name Data Type Size Description

Id_Tag Int 5 Nomor id tag

Nama_tag Varchar 100 Nama tag Tag_seo Varchar 100 Jenis tag

Count Int 5 Penghitungan tag

3.3.23 Tabel User

Tabel 3.24Tabel User

Field Name Data Type Size Description

Username Varchar 50 Nama pengguna Password1 Varchar 50 Password pengguna 1

Password Varchar 50 Password pengguna 2 Nama_lengkap Varchar 100 Nama lengkap pengguna

Alamat Varchar 200 Alamat pengguna Email Varchar 100 Email pengguna

Aktifasi Int 6 Aktifasi member

Cek_aktifasi Int 6 Mengecek aktifasi member No_telp Varchar 20 Nomor telepon pengguna

Id_kota Int 2 Nomor id kota

Level Varchar 20 Jenis pengunjung situs Blokir Enum('Y','N') Blokir pengguna

Id_session Varchar 100 Nomor id sesi mengunjungi situs


(58)

3.3.24 Tabel Ym

Tabel 3.25Tabel YM

Field Name Data Type Size Description

Id Int 11 Nomor id

Nama Varchar 225 Nama sosial media Username Varchar 50 Nama pengguna


(59)

(60)

BAB 4

IMPLEMENTASI SISTEM

4.1 Pengertian dan Tujuan Implementasi Sistem

Setelah dianalisis dan dirancang secara rinci dan teknologi telah diseleksi dan dipilih tiba saatnya, sistem untuk diimpleentasikan. Implementasi sistem adalah langkah-langkah atau prosedur yang dilakukan dalam menyelesaikan desain sistem yang telah disetujui, untuk menguji, meng-install, dan memulai sistem baru atau sistem yang diperbaiki untuk menggantikan sistem yang lam, sedangkan tahap implementasi sistem merupakan tahap meletakkan sistem agar sistem dapat siap untuk dioperasikan. Tahap implementasi sistem terdiri dari langkah-langkah sebagai berikut :

a. Menerapkan rencana imlementasi. b. Melakukan kegiatan implementasi. c. Tindak lanjut implementasi

4.2 Tujuan Implementasi Sistem

Adapun tujuan-tujuan dari implementasi sistem, yaitu :

a. Mengkaji rangkaian sistem baik dari segi software maupun hardware sebagai sarana pengolah data dan penyaji informasi.


(61)

b. Menyelesaikan rancangan sistem yang ada dalam dokumen sistem yang baru yang telah disetujui.

c. Memastikan bahwa pemakai dapat mengoprasikan dengan mudah terhadap sistem yang baru dan dapat informasi yang baik dan jelas.

d. Memperhitungkan bahwa sistem telah memenuhi permintaan pemakai yaitu menguji sistem secara menyeluruh.

e. Memastikan bahawa sistem telah berjalan lancar dengan mengontrol dan melakukan instalasi secara benar.

4.3 Komponen Dalam Implementasi Sistem

Agar perancangan sistem yang telah kita kerjakan dapat berjalan baik atau tidak,maka perlu dilakukan pengujian terhadap siste yang telah dikerjakan. Untuk itu dibutuhkan beberapa komponen utama yang mencakup perangkat keras(hardware), perangkat lunak(software), dan perangkat operator (brainware)

4.3.1 Perangkat Keras (Hardware)

Hardware merupakan komponen yang terlihat secara fisik saling bekerjasama dalam pengolahan data. Perangkat keras ( hardware) yang digunakan meliputi : a. Satu perangkat komputer atau laptop

b. Printer

4.3.2 Perangkat Lunak (Software )


(62)

Software adalah instruksi atau program - program komputer yang dapat digunakan oleh komputer dengan memberikan fungsi serta penampilan yang diiinginkan. Dalam hal ini, perangkat lunak yang digunakan untuk aplikasi perancangan sistem ini adalah :

a. Windows XP Professional b. Apace

c. MySQL d. Browser

e. Macromedia dreamweaver

f.

4.3.3 Perangkat Manusia (Brainware)

Brainware merupakan perangkat manusia yang menangani fasilitas komputer yang ada. Perangkat manusia yang dimaksud adalah orang-orang yang memiliki bagian untuk menangani sistem, misalnya :

a. Programmer yaitu orang yang mengerti bahasa pemrograman dan membangun program

b. Operator yaitu orang yang menangani langsung dalam pengolahan data mulai dari mempersiapkan data hingga pengetikan data pada komputer.

4.4 Tampilan Halaman Website

Untuk menjalankan sistem guna web browser pada pengunjung ini penulis menggunakan web browser Mozila Firefox dan Google Chrome setelah web browser jalam ketikkan pada


(63)

addres bar tersebut seperi pada gambar berikut:

4.4.1 Tampilan Halaman Website

Gambar 4.2 Halaman Utama

Gambar 4.3 Halaman Kategori


(64)

Gambar 4.4

Halaman Cara Pembelian

Gambar 4.5 Halaman Produk Kami

Gambar 4.6 Halaman Customer Service


(65)

4.4.2 Tampilan Halaman Admin

Gambar 4.7 Halaman Administrator

Gambar 4.8

Halaman Cara Pembelian


(66)

Gambar 4.9 Halaman Ganti Password

Gambar 4.10 Halaman Modul Admin


(67)

Gambar 4.11 Halaman Komentar

Gambar 4.12 Halaman Orderan


(68)

(69)

BAB 5

KESIMPULAN DAN SARAN

5.1 Kesimpulan

Setelah dilakukan perancangan, pembuatan,implementasi dan pengujian Sistem Informmasi Usaha Kecil dan Menengah berbasis WEB menggunkan PHP dan MySQL, kesimpulan yang diperoleh adalah sebagai berikut

1. Sistem informasi ini dapat membantu mempermudah pemasaran dan penjualan produk-produk toko.

2. Dengan adanya sistem informasi ini, pembeli lebih mudah untuk mencari informasi tentang produk-produk toko dan dapat melakukan transaksi secara online.

3. Sistem Informasi ini adalah sarana untuk toko memasarkan produk-produk hasil produksinya dengan mudah tanpa mengeluarkan biaya yang besar.

4. Sistem informasi ini berhubungan langsung dengan database, sehingga

5.2 Saran

Saran yang digunakan agar web ini dapat tetap terus berjalan dpat digunakan adalah


(70)

1. Lebih mengembangkan sistem transaksi penjualan yang lebih baik, aman dan terpercaya.

2. Setiap isaha kecil dan menengah dapat memasarkan setiap produknya secara online (FathStudio)

3. Lebih mengefesienkan dan mengefektifkan penggunaan database.

4. Melakukan penelitian yang lebih terhadap kendala-kendala yang dihadapi usaha kecil dan menengah dalam melakukan pemmasaran dan penjualan produknya.


(71)

DAFTAR PUSTAKA

.Kusumo, Suryo, Ario, Drs, artikel-penelitian-penerapan-e-comerce, Elex Media Komputindo, PT, Gramedia, Jakarta, 2000

S.Si, Budiarto, Widodo, Paper-Sim-Nanda-Penerapan-E-Commerce-Dalam-Menunjang-Strategi-Bisnis-Perusahaan2 Elex Media Komputindo, PT, Gramedia, Jakarta, 2002. Www.Google.com/Membuat laporan dengan crystal report (Diakses tanggal 03 Juni 2014)


(72)

SURAT KETERANGAN Hasil Uji Program Tugas Akhir

Yang bertanda tangan dibawah ini, menerangkan bahwa Mahasiswa Tugas Akhir Program D3 Teknik Informatika :

Nama :PUTRI INDAH PUSPITA NIM : 112406168

Prog. Studi :D3 Teknik Informatika

Judul TA :PERANCANGAN DAN PEMBUATAN COMMERCEQZ_COLLECTION ONLINE

SYSTEM BERBASIS WEB MENGGUNAKAN PHP DAN MYSQL

Telah melaksanakan tes program Tugas Akhir Mahasiswa tersebut di atas pada tanggal……….

Dengan Hasil : Sukses / Gagal

Demikian diterangkan untuk digunakan melengkapi syarat pendaftaran Ujian Meja Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU Medan.

Medan, Juni 2014 Dosen Pembimbing

Dr. Syahril Efendi, S.Si., M.I.T

NIP : 19671110199602


(73)

KEMENTERIAN PENDIDIKAN NASIONAL

UNIVERSITAS SUMATERA UTARA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

Jl. Bioteknologi No. 1 Kampus USU

Telp. (061) 8214290, 8211212, 8211414 Fax. (061) 8214290 Medan 20155

No

Kartu Bimbingan Tugas Akhir Mahasiswa

Nama : PUTRI INDAH USPITA

Nomor Induk Mahasiswa : 11240168

Judul Tugas Akhir : PERANCANGAN DAN PEMBUATAN

COMMERCEQZ_COLLECTION ONLINE

SYSTEM BERBASIS WEB MENGGUNAKAN PHP DAN MYSQL

Dosen Pembimbing : Dr. Syahril Efendi, S.Si., M.I.T Tanggal Mulai Bimbingan : ...

Tanggal Selesai Bimbingan : ... Tanggal Asistensi

Bimbingan

Pembahasan Pada Asistensi Mengenai, Pada Bab :

Paraf Dosen

Pembimbing Keterangan

*Kartu ini harap dikembalikan ke Departemen Matematika bila bimbingan mahasiswa telah selesai

Diketahui, Disetujui,

Departemen Matematika FMIPA USU Pembimbing Utama/

Ketua Penanggung Jawab

Dr. Elly Rosmaini Dr. Syahril Efendi, S.Si., M.I.T NIP. 196005201985032002 NIP. 196711101996021001


(74)

L

A

M

P

I

R

A

N


(75)

1.

Halaman Depan

a. Style.css @charset "utf-8"; @import url(button.css); body{ background-image: url(background/bg-body.jpg); background-repeat: repeat-x center;

padding:0;

font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#000; margin: 0px; } p{ padding:2px; margin:0px; } #main_container{ width:1000px; height:auto; margin:auto; padding:0px; } .top_bar{ width:1000px; height:38px; background-color:#4A4A4A; border-radius: 10px 10px 0 0; }

.top_search{

width:370px; height:32px;

margin:1px 20px 0 0; float:right;

background:url(images/top_search_bg.gif) no-repeat center; }

input.search_input{ width:182px; height:18px; float:left;


(76)

border:1px solid #dbdbdb; border-bottom-color:#ffffff; border-right-color:#ffffff; } .search_text{ float:left; width:110px;

padding:8px 0 0 15px; color:#999999; } .search_text a{ text-decoration:none; color:#999999; } .search_bt{ float:left;

padding:2px 0 0 15px; }

input,textarea,select{

font-family:Arial, Helvetica, sans-serif; font-size:11px;

} .lang_text{

float:left;

padding:0 5px 0 0; color:#b3adad; }

a.lang{

display:block; float:left;

padding:0 5px 0 5px; } /*#header{ width:1000px; height:249px; opacity: 0.2; background-color:#5B6354; background-position:0px 0px; margin:auto; }*/ #logo{ float:left; padding:15px; } #main_content{ clear:both; width: auto;

border: 2px solid #FFF; border-radius: 0 0 5px 5px ;


(77)

margin-top:0px; }

/*--- menu tab---*/ #menu_tab{ width:992px; padding-top: 2px; height:55px;/* background-color:#fff;*/ } .left_menu_corner{ width:7px; height:50px; float:left; } ul.menu { list-style-type:none; float:left; display:block; width:987px; margin:0px; padding:0px; position: relative; margin-left: -2px;

background:rgb(170, 125, 125); background-size: 100%; }

ul.menu li {

display:inline; font-size:11px; font-weight:bold; line-height:50px; }

ul.menu li.divider { display:inline; width:2px; height:50px; float:left;

background:url(images/menu_divider.gif) no-repeat center; }

ul.menu li a #gbr{ margin-top: 5px; width: 25%; height: 80%; float: left; }

a #gbr img{

width: 100%; height: 100%; }

ul.menu li a #jdl{

margin-left: 10px;


(78)

text-transform: capitalize; }

a.nav:link, a.nav:visited { display:block; float:left; width: 162.6px; height:50px; text-decoration:none; color:#676d77;} a.nav:hover { color: #FFF;} /*---crumb_navigation---*/ .crumb_navigation{ width:979px; height:15px;

padding:5px 0px 0 20px; color:#333333;

background:url(images/navbullet.png) no-repeat left #CCC; background-position:5px 6px; } .crumb_navigation a{ color:#0fa0dd; text-decoration:underline; } span.current{ color:#0fa0dd; } .konten{ width: 993px; height:600px;

border: 2px solid #FFF; border-radius: 5px 5px 0 0; background-color: #FFF; margin-top:3px; } /*---left_content---*/ .left_content{ width:196px; float:left; } .title_box{ width:196px; height:30px;

border:solid 1px #FFF; background-color:#1B7C78; border-radius:48px 0px 0px 0px; margin:10px 0 0 0;

text-align:center;


(79)

font-weight:bold; color:#fff; line-height:30px; } /*---left menu---*/ ul.left_menu{ width:196px; padding:0px; margin:0px; list-style:none; background-color:#CCC; } ul.left_menu li{ margin:0px; list-style:none; } .ganjil a{ width:166px; height:25px;display:block; background-color:#964848; color:#FFF; background-position:5px 5px; border-bottom:1px #FFFFFF solid; text-decoration:none;

padding:0 0 0 30px; line-height:25px; } .genap a{ background-color:#964848; color:#FFF; width:166px; height:25px; display:block; background-position:5px 5px; border-bottom:1px #FFFFFF solid; text-decoration:none;

padding:0 0 0 30px; line-height:25px; }

ul.left_menu li.ganjil a:hover, ul.left_menu li.genap a:hover{ background-color: #C94545; color:#FFF; background-position:5px 5px; } .border_box{ width:194px; height:auto; margin-top:10px; text-align:center; border:1px #FFF solid; }


(80)

.border_boxshout{ width:194px; height:auto; text-align:left;

border:1px #6da6b1 solid; }

.product_title{

color:#ea2222; padding:5px 0 5px 0; font-weight:bold; }

.product_title a{

text-decoration:none; color:#ff6600; padding:5px 0 5px 0; font-weight:bold; }

.product_img{

padding:5px 0 5px 0; } .product_img #f-f{ margin-left: 1px; width: 171px; height: 110px; } #f-f img{ width: 100%; height: 100%; } .prod_price{

padding:5px 0 5px 0; } span.reduce{ color:#999999; text-decoration:line-through; } span.price{ color:#ea2222; } /*---newsletter---*/ input.newsletter_input{ width:160px; height:16px;

border:1px #ddd9d9 solid; margin:10px 0 5px 0; font-size:12px; padding:3px; color:#999999; }


(81)

width:17px; display:block;

margin:5px 0 5px 140px;

background:url(images/blue-add.png) no-repeat left; padding:0 0 0 20px;

text-decoration:none; color:#1c4a52; } .banner_adds{ width:194px; text-align:center; padding:10px 0 10px 0; } /*center content---*/ .center_content{ width:780px; float:left; padding:5px 10px; } .center_title_bar{ width:520px; height:33px; float:left;

padding:0 0 0 40px; margin:0 0 0 12px; line-height:33px; font-size:12px; color:#847676; font-weight:bold;

background:url(images/bar_bg.gif) no-repeat center; } .sambungan { width:200px; height:33px; float:left; } .halaman{ width:740px; height:33px; float:left;

padding:0 0 0 10px; margin:0 0 0 12px; line-height:33px; font-size:12px; color:#847676; font-weight:bold; } .keterangan{ width:520px; height:33px; float:left;


(82)

margin:0 0 0 12px; line-height:33px; font-size:12px; color:#847676; } /*---right content---*/ .right_content{ width:196px; float:left;

padding:5px 0 0 0; }

.shopping_cart{ width:195px; height:84px; text-align:center;

background:url(images/cart_bg.gif) no-repeat center; } .cart_title{ font-size:12px; font-size:12px; color:#847676; font-weight:bold; padding:8px 0 0 0; margin-top:10px; }

.cart_details{

width:115px; float:left;

padding:5px 0 0 15px; text-align:left;

} .cart_icon{

float:left;

padding:5px 0 0 5px; }

span.border_cart{ width:100px; height:1px;

margin:3px 0 3px 0; display:block;

border-top:1px #999999 dashed; } /*---prod_box---*/ .prod_box{ width:173px; height:auto; float:left;

padding:10px 10px 10px 11px; }

.top_prod_box{ width:173px;


(83)

background:url(images/product_box_top.gif) no-repeat center bottom; float:left; padding:0px; margin:0px; } .bottom_prod_box{ width:173px; height:10px;

background:url(images/product_box_bottom.gif) no-repeat center top; float:left; padding:0px; margin:0px; } .center_prod_box{ width:173px; height:180px; background:url(images/product_box_center.gif) repeat-y; float:left; text-align:center; padding:0px; margin:0px; } .a{ width: 20px; height: 20px; background: red; } .prod_details_tab{ width:173px; height:31px; float:left;

background:url(images/products_details_bg.gif) no-repeat center; margin:3px 0 0 0;

}

.prod_details_cari{ width:373px; height:31px; padding-left: 20px; margin:43px 0 0 0; }

img.left_bt{ float:left;

padding:4px 10px 0 10px; }

a.prod_details{ width:25px; display:block; float:left;

background:url(images/square-blue-add.gif) no-repeat left; padding:0 0 0 20px;

margin:7px 0 0 28px; text-decoration:none;


(84)

} a.prod_cart{

width:25px; display:block; float:left;

padding:0 0 0 20px; margin:7px 0 0 8px; text-decoration:none; color:#0fa0dd; } .prod_cart_habis{ width:25px; display:block; float:left;

background:url(images/cart_hbs.gif) no-repeat left; padding:0 0 0 20px;

margin:7px 0 0 8px; text-decoration:none; color:red; } /*---prod_box_big---*/ .prod_box_big{ width:554px; height:auto; float:left;

padding:10px 10px 10px 15px; }

.top_prod_box_big{ width:554px; height:12px;

background:url(images/details_box_top.gif) no-repeat center bottom; float:left; padding:0px; margin:0px; } .bottom_prod_box_big{ width:554px; height:12px;

background:url(images/details_box_bottom.gif) no-repeat center top; float:left; padding:0px; margin:0px; } .center_prod_box_big{ width:554px; height: auto; background:url(images/details_box_center.gif) repeat-y; float:left; text-align:center; padding:0px; margin:0px; } .tengah{


(85)

height:auto; background:url(images/details_box_center.gif) repeat-y; float:left; text-align:justify; padding:10px; margin:0px; } .product_img_big{ width:170px;

padding:5px 0 5px 10px; float:left;

}

.details_big_box{ width:345px; float:left;

padding:0 0 0 15px; text-align:left; }

.details_big_cari{ width:540px; float:left;

padding:0 0 0 15px; text-align:left; }

.product_title_big{ color:#725454; padding:5px 0 5px 0; font-weight:bold; font-size:14px; } .specifications{ font-size:12px; font-weight:bold; line-height:18px; } .thumbs{

padding:8px 5px 8px 5px; border:1px #DFD1D1 solid; margin:3px 0 0 0;

} .thumbs a{

padding:3px; }

.prod_price_big{

padding:5px 0 5px 0; font-size:16px; }

span.reduce{


(86)

text-decoration:line-through; } span.price{ color:#ea2222; } a.addtocart{ width:36px; height:27px; display:block; float:left;

background:url(images/addtocart.gif) no-repeat left; padding:0 0 0 35px;

margin-left:50px; text-decoration:none; line-height:27px; color:#1c4a52; } span.blue{ color:#5F9FAB; } /*---contact_form---*/ .contact_form{ width:355px; float:left;

padding:0px 0 0 75px; }

.form_row{

width:335px; clear:both;

padding:10px 0 10px 0; color:#a53d17; } label.contact{ width:75px; float:left; font-size:12px; text-align:right; padding:4px 5px 0 0; color: #333333; } input.contact_input{ width:210px; height:18px; background-color:#fff; color:#999999;

border:1px #DFDFDF solid; float:left;

}

textarea.contact_textarea{ width:248px; height:50px;


(87)

font-size:12px; color: #999999; background-color:#fff; border:1px #DFDFDF solid; float:left; } a.contact{ width:99px; height:27px; display:block; float:right;

margin:0 0 0 10px;

background:url(images/contact_bt.gif) no-repeat left; padding:0 0 0 10px;

text-decoration:none; line-height:27px; color:#1c4a52; } /*---footer---*/ .footer{ width:1000px; clear:both; height:82px; background-color: #CCC; border-radius:0 0 10px 10px; margin-left:174px;

} .right_footer{

float:right;

padding:0px 35px 0 0; margin: 44px 0 0 10px; }

.right_footer a{

padding:0 0 0 7px; text-decoration:none; color: #666666; } .right_footer a:hover{ text-decoration:underline; } .center_footer{ float:left; width:200px; text-align:center; color:#666666;

padding:10px 0 0 60px; margin: 17px 0px 0 305px; }

.kategori{

line-height:33px; font-size:12px; color:#847676;


(1)

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>

<link href="style.css" rel="stylesheet" type="text/css" /> </head>

<body>

<div id="header"> <div id="menu"> <ul>

<li><a href=?module=home>Home</a> <?php include "menu.php"; ?></li> <li><a href=logout.php> Logout</a></li> </ul>

</div> <div id="bingkai">

<?php include "content.php"; ?>

<div id="footer">

Copyright &copy; 2014 by Qz_Collection.Ltd All rights reserved. </div>

</div> </div> </body> </html> <?php


(2)

?>

c.

Index.Php

<html> <head>

<title>Administrator Qz_Collection</title> <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>

<style type="text/css"> table {

font-family: Tahoma; font-size: 10pt;

border-color: #999999; border-collapse: collapse; margin: 10px 0px; }

</style> </head>

<body OnLoad="document.login.username.focus();"> <center>

<div style="background:url(images/loser.jpg);width:400px; height:300px;margin-top:100px;

">

<p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p>

<form name="login" action="cek_login.php" method="POST" onSubmit="return validasi(this)" style="padding-top:20px; padding-left:30px" >

<table>

<tr><td align="justify">Username</td><td> : <input type="text" name="username"></td></tr>

<tr><td align="justify">Password</td><td> : <input type="password" name="password"></td></tr>

<tr><td colspan="2"><input type="submit" value="Login"></td></tr> </table>

</form>

</div> </center> </body>


(3)

d.

Content.Php

<?php

include "../config/koneksi.php"; include "../config/library.php";

include "../config/fungsi_indotgl.php"; include "../config/fungsi_combobox.php"; include "../config/class_paging.php"; include "../config/fungsi_rupiah.php"; // Bagian Home

if ($_GET[module]=='home'){

if ($_SESSION['leveluser']=='admin'){ echo "<h2>Welcome To Qz_Collection</h2>

<p>Hai <b>$_SESSION[namalengkap]</b> welcome page.

Please click on the menu option located on the left to manage website content.. </p> <p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbs p;</p><p>&nbsp;</p><p>&nbsp;</p>

<p align=right>Login : $hari_ini, "; echo tgl_indo(date("Y m d")); echo " | ";

echo date("H:i:s"); echo " WIB</p>"; }

}

// Bagian Modul

elseif ($_GET[module]=='modul'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_modul/modul.php"; }

}

// Bagian Kategori

elseif ($_GET[module]=='kategori'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_kategori/kategori.php"; }

}

// Bagian Produk

elseif ($_GET[module]=='produk'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_produk/produk.php"; }

}

// Bagian Order

elseif ($_GET[module]=='order'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_order/order.php"; }


(4)

// Bagian Profil

elseif ($_GET[module]=='profil'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_profil/profil.php"; }

}

// Bagian Order

elseif ($_GET[module]=='hubungi'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_hubungi/hubungi.php"; }

}

// Bagian Cara Pembelian

elseif ($_GET[module]=='carabeli'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_carabeli/carabeli.php"; }

}

// Bagian Kota/Ongkos Kirim

elseif ($_GET[module]=='ongkoskirim'){ if ($_SESSION['leveluser']=='admin'){

include "modul/mod_ongkoskirim/ongkoskirim.php"; }

}

// Bagian Password

elseif ($_GET[module]=='password'){ if ($_SESSION['leveluser']=='admin'){

include "modul/mod_password/password.php"; }

}

// Bagian Laporan

elseif ($_GET[module]=='laporan'){ if ($_SESSION['leveluser']=='admin'){ include "modul/mod_laporan/laporan.php"; }

}

// Apabila modul tidak ditemukan else{

echo "<p><b>MODUL BELUM ADA ATAU BELUM LENGKAP</b></p>"; }

?>

e.

Menu.Php

<?php

include "../config/koneksi.php"; if ($_SESSION[leveluser]=='admin'){

$sql=mysql_query("select * from modul where aktif='Y' order by urutan"); }


(5)

$sql=mysql_query("select * from modul where status='user' and aktif='Y' order by urutan");

}

while ($m=mysql_fetch_array($sql)){

echo "<li><a href='$m[link]'> $m[nama_modul]</a></li>"; }

?>

f.

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[namauser] = $r[username]; $_SESSION[namalengkap] = $r[nama_lengkap]; $_SESSION[passuser] = $r[password];

$_SESSION[leveluser] = $r[level]; header('location:media.php?module=home'); }

else{

echo "<link href=../config/adminstyle.css rel=stylesheet type=text/css>"; echo "<center>LOGIN GAGAL! <br>

Username atau Password Anda tidak benar.<br> Atau account Anda sedang diblokir.<br>";

echo "<a href=index.php><b>ULANGI LAGI</b></a></center>"; }

?>

g.

Lougout.Php

<?php

session_start(); session_destroy();

echo "<script>alert('Logout'); window.location = '../index.php'</script>"; ?>


(6)