BAB III ANALISA DAN PEMBAHASAN 3.1 Analisa - Gunadarma

8d ago
0 Views
0 Downloads
1.21 MB
42 Pages
Last View : 8d ago
Last Download : n/a
Upload by : Vicente Bone
Transcription

BAB IIIANALISA DAN PEMBAHASAN3.1AnalisaKebutuhan manusia akan informasi meningkat seiring dengan perkembanganzaman. Untuk mendapatkan informasi tersebut diantaranya dapat dilakukan denganmenjelajah dunia maya yaitu menggunakan internet, buku sebagai jendela duniauntuk memperluas cakrawala, dan informasi dapat juga diperoleh melalui komunikasimenggunakan ponsel atau handphone. Saat ini handphone merupakan saranakomunikasi yang bersifat primer. Dikatakan primer karena handphone sangatberperan penting terhadap komunikasi, melalui handphone kita dapat memperolehinformasi langsung dari sumber yang kita inginkan. Handphone juga tidak hanyaterdiri dari satu merek saja namun banyak sekali merek yang bersaing di dunia pasar,mereka bersaing untuk memasarkan produknya dengan fitur – fitur yang semakincanggih.Pada website Toko Handphone Fahmi Cell ini prosedur pemesanan dilakukansecara online. Mereka memilih Handphone yang akan dipesan dan kemudianmemasukkan jumlah handphone yang akan dibeli pada keranjang belanja. Kemudianpara pengunjung diminta untuk mengisi data pribadi di halaman proses agaradministrator dapat mengetahui alamat dan nomor telepon agar dapat melakukankonfirmasi pesanan. Setelah pengisian berhasil maka akan dilanjutkan ke tahapproses yang kedua yaitu berisi seluruh info pesanan handphone. Apabila telah selesaimelakukan belanja maka selanjutnya klik selesai. Kami akan mengirim konfirmasipesanan pemesan melalui email dan pemesan wajib me-reply email tersebut sebagaipersetujuan atas pemesanan pemesan. dan juga data pemesan beserta ongkos kirim.Kemudian kurir akan mengantarkan handphone yang dipesan dan mengambil buktitransfer dari pemesan jika pemesan belum melakukan transfer maka pemesan akanmendapatkan konfirmasi melalui telepon untuk melalukan pembayaran melaluitransfer atau tunai pada saat pengantaran barang. Apabila melakukan pesanan melalui36

37telepon, dapat langsung menghubungi orang yang tercantum namanya pada emailpemesan. Jika pemesan tidak me-reply konfirmasi dari pihak kami paling lambat satuminggu setelah pemberian konfirmasi maka pembelian dianggap batal. Untukkemudahan, pengunjung dapat membaca prosedur tersebut di web ini. Untuk jasapengantaran kurir website ini hanya melayani jasa antar di Cirebon - Indramayu saja.3.2Struktur NavigasiMembuat struktur (peta) navigasi adalah penting dalam pembuatan suatu Programuntuk menentukan alur atau struktur dari program tersebut. Pada pembuatan WebsiteToko Handphone Fahmi Cell ini penulis menggunakan struktur navigasi komposit(campuran). Hal ini dikarenakan terdapat tipe linier dan non linier pada struk navigasiwebsite ini.Gambar 3.1 Struktur Navigasi Website Toko Handphone Fahmi CellPada struktur navigasi website ini kita memakai struktur navigasi campuran.Pada halaman depan, merupakan tampilan awal dari website penjualan handphone

38Fahmi Cell ini. Pada halaman ini terdapat link halaman depan, cara pemesanan,hubungi kami dan login. Khusus untuk login ini diperuntukkan bagi administratoryang mengatur database dari web ini. Pada halaman depan ini terdapat juga 10kategori handphone terdiri dari Blackberry, Hitech, K-Touch, LG, Motorlla, Nokia,O2, Samsung, Siemens, Sony Ericsson, beserta handphone baru.3.3Prosedur Pemesanan HandphoneSaat ingin melakukan pemesanan handphone di website ini, para pengunjungtidak diharuskan menjadi anggota terlebih dahulu. Siapa saja bisa mengakses websiteini tanpa batas begitu juga melakukan pemesanan handphone. Ketika halaman depanweb ini terbuka maka yang pertama kali tampil adalah handphone baru dari web ini.Kemudian di halaman depan ini juga terdapat kategori handphone yang dapatdipesan. Setelah pengunjung melihat-lihat koleksi handphone yang terdapat di webini, maka pengunjung dapat langsung melakukan pemesanan handphone. Dengancara mengklik detil, yang tertera dibawah gambar handphone. Kemudian akan tampilhalaman sinopsis handphone tersebut dan bisa langsung klik buy. Maka halaman yangakan dibuka adalah halaman inputan jumlah handphone yang ingin dibeli. Tahapselanjutnya adalah menginput data pribadi agar masuk ke database admin. Kemudianakan mengkonfirmasi pesanan dan apabila pengunjung telah selesai melakukanpemesanan maka kami akan mengirimkan email dan pembeli harus me-reply emailtersebut untuk konfirmasi pengiriman serta biaya pengirimannya. Pembayarandilakukan dapat berupa cash ataupun transfer ke rekening yang dikirimkan melaluiemail pembeli. Tetapi, apabila ingin melakukan pesanan by phone pengunjung dapatlangsung menghubungi contact person yang infonya terdapat pada email yang kamiberikan kepada pembeli.

39Gambar 3.2 Prosedur Pemesanan Handphone3.4Perancangan UML (Sistem)Perancangan aplikasi ini menggunakan UML sebagai pemodelan system,adapun urutan perancangan untuk diagram-diagram yang terdapat didalam UML(Unified Modeling Languange) adalah :3.4.1Diagram Use CaseDiagram use case ini menggambarkan user dan administrator yangmenggunakan sistem dan perilaku user serta administrator terhadap sistem.

40entry datamenu adminhapus dataedit datalihat hppesanbuyuseradministratorisi form pemesanankonfirmasicash extend transferbayar extend Gambar 3.3 Diagram Use CasePada gambar 3.3 digambarkan use case, dimana yang bertugas menyediakaninformasi serta mengolah informasi yang dibutuhkan oleh user adalah seorangadministrator. User di dalam system dapat melihat fasilitas info mengenaihandphone.3.4.2Diagram ClassDiagram class dari sistem ini menunjukkan objek-objek yang terdapat dalamsistem serta keterhubungan objek-objek tersebut. Diagram class ini menggambarkanbentuk dari database dan interaksi dari tabel-tabel dalam database tersebut.

41customer#customer id nama alamat1 alamat kota kodeposhandphoneusers1*1 input()1hp category1*#id username password1 input() delete() update()1*1#hp category id hp category name1 input() delete() Operation1()1*orders#order id customer id jumlah hp date nama alamat1 alamat2 kota kodepos1*orderdetail#order id hp code hp price jumlah total iput() delete() update()#hp id hp category id hp code hp seri hp network system hp madein hp size hp weight hp display hp battery hp standby hp talk hp ringtone hp memory hp gprs hp message hp infrared hp games hp colour hp price hp filename hp features hp datetime input() delete() update() input() delete() update()Gambar 3.4 Diagram ClassGambar diagram class secara umum dibuat menurut kebutuhan database yangdiperlukan. Pada gambar 3.4 diatas terdapat enam class, yaitu : users, hp category,customer, handphone, orderdetail dan orders. Masing-masing class mempunyaiketerhubungan dengan class lainnya, hal inilah yang menjadikan sebuah classmenjadi database relasional.

423.4.3Diagram InteractionInteraction diagram terdiri dari 2 diagram, yaitu : sequences dan collaborationdiagram. Diagram ini menunjukkan bagaimana suatu objek berinteraksi dengan objeklainnya melalui suatu message.3.4.3.1 Diagram sequenceDiagram sequence pemesanan menjelaskan ketika user mengklik simpan dankemudian mengklik selesai belanja maka aplikasi akan menampilkan halamaninputan data pribadi. Selanjutnya apabila user memasukkan data inputan pribadimaka akan menampilkan halaman proses konfirmasi data pribadi. Halaman ini bisamerujuk untuk perbaiki data atau konfirmasi pesanan. Apabila data yang dimasukkantelah benar dan data barang juga sudah benar, maka aplikasi akan menampilkanhalaman konfirmasi pesanan dan menampilkan jumlah barang yang dipesan dan totalbelanja beserta ongkos kirim. Apabila semua proses telah diisi dengan baik makaaplikasi menampilkan halaman bahwa user telah melakukan pemesanan barang danjuga mendapatkan nomer id dari administrator dan juga di halaman yang sama akanterdapat nomer rekening agar user bisa melakukan pembelian dengan cara transfer.Diagram sequence dari pemesanan dapat digambarkan seperti pada gambar 3.5

43Gambar 3.5 Diagram Sequence Pemesanan

443.4.3.2 Diagram collaborationDiagram collaboration dibawah ini menunjukkan interaksi antara satu objekdengan objek lainnya, serta kaitan antara objek-objek tersebut menurut urutanaktivitas yang dilakukan.Gambar 3.6 Diagram collaboration PemesananKeterangan :1. User meng-klik detil di halaman index2. Halaman Index memberikan tampilan halaman detil3. User meng-klik buy di halaman detil4. Detil menampilkan halaman buy kepada user5. User menginput jumlah barang di halaman buy

456. Kemudian user, mengklik simpan di halamn buy7. Setelah itu user klik lanjutkan belanja8. Halaman Buy menampilkan halaman index pada user9. User meng-klik detil di halaman index10. Halaman Index memberikan tampilan halaman detil11. User meng-klik buy di halaman detil12. Detil menampilkan halaman buy kepada user13. User menginput jumlah barang di halaman buy14. Kemudian user, mengklik simpan di halamn buy15. Setelah itu user meng-klik selesai belanja16. Halaman buy menampilkan halaman pemesanan17. User menginput data pribadi di halaman pemesanan18. Kemudian user klik proses dihalaman pemesanan19. Halaman pemesanan menampilkan halaman konfirmasi pesanan20. User meng-klik perbaiki data pemesan di halaman konfirmasi pesanan21. Halaman konfirmasi pesanan menampilkan halaman pemesanan pada user22. User menginput data pribadi di halaman pemesanan23. Kemudian user klik proses dihalaman pemesanan24. Halaman pemesanan menampilkan halaman konfirmasi pesanan25. User meng-klik konfirmasi pesanan26. Halaman konfirmasi pesanan memberikan informasi pesanan pada user3.4.4Diagram ComponentDiagram component ini berisi ketergantungan antara komponen-komponenperangkat lunak yang dipakai untuk membuat sistem ini, yaitu : file program yangdipakai, dan ketergantungan file component itu antara satu dengan yang lainnya.

46Gambar 3.7 Diagram componentGambar 3.9 menunjukkan file-file yang terdapat pada perancangan programdimana file-file tersebut terbagi menjadi dua bagian, yaitu : user dan admin. Dimanakedua-duanya berhubungan dengan file index.php, user hanya terdiri dari satukomponen, yaitu pesan hp.php, sedangkan admin terdiri dari 4 komponen, yaituhome.php, input.php, delete.php dan update.php.

473.4.5 Diagram ActivityMulaiAdministratorUserHalaman indexadminIndexInfo handphoneInputDeletetidak jadi belieditbeliBuyinput datatidak jadi pesanjadi pesanpemesananinfopemesananSelesaiGambar 3.8 Diagram ActivityPada Gambar 3.10 dijelaskan aktivitas dari system dibagi menjadi dua bagian,sesuai dengan status, yaitu : user dan administrator, kemudian aktivitas user dan

48administrator akan berjalan sesuai dengan hak akses yang didapatnya sampai userdan administrator bertemu kembali untuk melakukan satu aktivitas, yaitu : selesai.3.4.6 Diagram StatechartDiagram statechart ini berisikan urutan keadaan sesaat yang dilalui sebuahobjek, kejadian yang menyebabkan sebuah transisi dari satu state atau aktivitaskepada yang lain, dan aksi yang menyebabkan perubahan satu state atau aktivitas.Pada Gambar 3.11 dijelaskan urutan keadaan pada saat user melakukan pemesanansampai user melakukan suatu aktivitas, yaitu : selesai.Gambar 3.9 Diagram Statechart3.5Pembuatan DatabaseDatabase untuk aplikasi Toko Handphone Fahmi Cell ini mengacu pada classdiagram yang telah dibuat pada tahap perancangan dengan menggunkan UML.

49Penulis menggunakan MySQL untuk pembuatan database yang telah tersedia padaPhpMyadmin.1. Untuk mengakses MySQL, pertama-tama kita harus mengaktifkan serverxampp pada menu xampp control panel.Gambar 3.10 XAMPP Contol Panel2. Setelah server running, barulah kita membuat databasenya. Untuk pembuatandatabase pada MySQL, penulis menggunakan Phpmyadmin yang ditampilkanmelalu jendela Mozila Firefox. Cara untuk mengkoneksinya dengan menulisaddress :http://localhost/Phpmyadmin

50Gambar 3.11 Halaman Utama Phpmyadmin3. Setelah Phpmyadmin aktif, maka kita dapat membuat database tanpa harusmembuat perintah SQL-nya karena Phpmyadmin dibuat dengan menu-menudan instruksi-instruksi yang mempermudah user dalam membuat database.Pertama-tama dibuat nama databasenya “toko hp online” pada menu createnew database, klik create.

51Gambar 3.12 Tampilan tabel setelah kita createUntuk membuat tabel cukup dengan menulis nama tabel dan jumlah fieldsyang akan dibuat pada menu create new tabel on database toko hp online dan fieldsdilanjutkan dengan penamaan masing-masing fields beserta fields beserta tipe datadan constraintnya. Setelah tabel terbentuk, untuk memasukkan data cukup menekaninsert new row.3.6Perancangan HalamanUntuk membuat web ini agar terlihat sederhana, menarik, dan mudahdimengerti oleh pengguna diperlukan desain antarmuka (interface). Desainantarmuka harus dilakukan karena merupakan bagian yang berhubungan langsungdengan pengguna, yaitu segala sesuatu yang dilihat oleh pengguna (yang munculdilayar monitor). Untuk membuat desain antarmuka digunakan storyboard.Storyboard atau alur cerita adalah langkah yang dilakukan setelah mendefinisikan

52elemen web, yang merupakan gambaran dan penjelasan tiap gambar, teks, dannavigasi.3.6.1 Halaman DepanPada halaman depan ini terdapat header sebagai pembuka. Kemudian ada linkuntuk login. Link login ini hanya diperuntukkan oleh administrator. Terdapat jugabeberapa handphone baru serta header untuk menampilkan alamat owner dari websiteini.Gambar 3.13 Desain Tampilan halaman depan

533.6.2 Cara pemesananKetika para pengunjung mengalami kesulitan melakukan pembelian ataupemesanan handphone, maka halaman ini sangat bermanfaat bagi mereka yangmengalami kesulitan. Di halaman ini terdapat penjelasan dari keseluruhan melakukanpemesanan handphone. Dan juga bagaimana cara melakukan pembayaran nantinyadan berapa lama masa waktu konfirmasi pesanan.Gambar 3.14 Desain Tampilan Cara Pemesanan

543.6.3 Hubungi KamiHubungi kami ini berfungsi sebagai fasilitas yang diberikan oleh website iniuntuk melakukan hubungan dengan web. Para pengunjung dapat mengirimkan pesanatau kritik dan saran terhadap web ini dan kemudian mengisi nama yang tertera padakotak yang ada. Kemudian kirim.Gambar 3.15 Desain Tampilan Hubungi kami

553.6.4 LoginHalaman login disini hanya bisa diakses oleh admin. Halaman ini berfungsisebagai pengaturan. Semua menu diatur oleh admin di halaman ini. Pengaturanhandphone disini meliputi input hp baru, edit hp dan delete hp. Kemudian adapengaturan konfirmasi pesanan, maksudnya adalah apakah pesanan tersebut sudahterkirim atau pending. Dan ada juga pengaturan jajak pendapat, yaitu melakukaninput jajak baru dan menghapus jajak lama.Gambar 3.16 Desain Tampilan Login3.6.5 Shop cartKetika user mengklik detildi halaman sinopsis handphone, maka usermengklik buy di halaman tersebut juga. Kemudian akan muncul sebuah halamandimana halaman tersebut berfungsi sebagai inputan jumlah handphone yang inginuser beli. Apabila ingin melakukan belanja lagi, user bisa mengklik lanjutkan belanja,atau apabila selesai melakukan belanja handphone, maka user bisa mengklik simpankemudian mengklik selesai belanja.

56Gambar 3.17 Desain Tampilan Input jumlah handphone3.6.6 Data pribadiSetelah pengunjung selesai melihat-lihat info handphone dan melakukanpesanan handphone, maka tahap selanjutnya adalah melakukan input data pribadi. Disini terdapat input data pemesanan dan data pengiriman. Data pemesan ini inputanbagi si pemesan atau pengunjung yang ingin melakukan pembelian handphone.Apabila pengunjung ingin membeli handphone dan diperuntukkan kepada orang lain,maka data pengiriman diisi data si penerima pesanan.

573.18 Desain Tampilan data pemesan3.7Perancangan Database3.7.1Pembuatan DatabaseUntuk membuat database pada MySQL pertama yaitu ciptakan database barukemudian ketik nama databasenya yitu toko hp online, klik ciptakan.Kemudian buat nama tabel dan tentukan berapa banyak field – field yang ada.Setelah itu klik Go kemudian kita isi field – fieldnya apa saja.

58Tabel 3.1 Database toko hp online3.7.2Pembuatan TabelTabel merupakan field – field yang ada pada database yang dibuat. Untukdatabase toko hp online terdapat enam buah tabel masing – masing yaitutabel customer, handphone, hp category, orderdetail, orders, dan users.Tabel 3.2 customerTabel customer digunakan untuk menyimpan data pengunjung yangmelakukan transaksi pemesanan pada website ini.

59Tabel 3.3 handphoneTabel handphone berisi semua informasi tentang hanphone yaitu fitur – fituryang tersedia pada handphone.Tabel 3.4 hp category

60Tabel hp category berisi hp category id dan hp category name yaitu padawebsite ini terdapat 10 kategori handphone yaitu Blackberry, Hitech, KTouch, LG, Motorolla, Nokia, O2, Samsung, Siemens, Sony Ericson.Tabel 3.5 orderdetailTabel orderdetail digunakan untuk menyimpan data ketika kita telahmelakukan pemesanan. Ketika kita klik selesai pada pemesanan kemudianakan menampilkan hp yang dipesan, harga hp, jumlah hp yang dipesan dantotal harga hp yang dibeli.Tabel 3.6 orders

61Tabel orders digunakan untuk menyimpan data pemesan. Jadi ketika kita klikbuy dan mengisi berapa banyak jumlah hp yang diinginkan dan klik selesaikemudian akan tampil form untuk mengisi data diri pemesan. Tabel inidigunakan untuk menyimpan data diri pemesan.Tabel 3.7 usersTabel users digunakan hanya untuk admin saja, yaitu menyimpan usernamedan password. Jika username dan password sesuai dengan database makaakan masuk ke menu administrator.3.8Mengakses Website Toko Handphone Fahmi CellPenulis menggunakan PHP sebagai bahasa pemrograman untuk membuatwebsite Penjualan Handphone Fahmi Cell ini.3.8.1Tampilan halaman depanSaat pertama kali sebuah website dibuka maka yang pertama tampil adalahhalaman utama atau halaman depan. Menu Utama menyediakan beragam fitur yangdapat diakses sehingga menarik untuk dikunjungi oleh pencari handphone. Padahalaman ini terdapat beberapa handphone baru, kategori dari beberapa handphone.Pada bagian atas terdapat info, bahwa yang ingin memesan melalu telepon bisalangsung menghubungi nama yang tertera di halaman tersebut.

62Gambar 3.19 Tampilan awalProgram membuka halaman dengan menggunakan:[index.php] ?php include( 'config.php' ); ? html head title .:: Toko Handphone Fahmi Cell ::. /title link rel "stylesheet" href "style.css" type "text/css" / /head body table cellspacing "0" cellpadding "0" border "0" class "page"align "center" ?php include( 'header.php' ); ? ?php include( 'bar.php' ); ? tr td class "content" table width "100%" cellspacing "0" cellpadding "5" border "0" tr td width "20%" class "content-left" ?php include( 'katalog handphone.php' ); ?

63 marquee /marquee /td td width "80%" class "content-right" tablewidth "100%"cellspacing "0"cellpadding "3"border "0" tr td class "content-title" Hanphone Baru /td /tr /table tablewidth "100%"cellspacing "0"cellpadding "8"border "0" ?php conn mysql connect( host, username, password );if( ! conn ){die( 'Koneksi tidak berhasil: ' . mysql error() );} db mysql select db( database, conn );if( ! db ){die( 'Tidak berhasil terkoenksi ke database: ' . mysql error() );} result mysql query( "SELECT * FROMhandphone ORDER BY hp id DESC LIMIT 0, 5", conn );if ( ! result ) {die( 'Query gagal: ' . mysql error() );} total mysql num rows( result );if( total 0 ){while( row mysql fetch array( result ) ){? tr td img src "images/ ?php echo row['hp filename'];? "border "0" height "110" / /td td width "90%" p class "hp-title" ?php echo row['hp code'];? /p p ?php echo row['hp network system'];? /p p class "hp-price" Rp. ?php echo number format( row['hp price'], 2, ',', '.' );? /p p ahref "detil.php?hpid ?phpecho row['hp id'];? " Detil /a /p /td

64 /tr ?php}}? /table /td /tr /table /td /tr ?php include( 'footer.php' ); ? /table /body /html Tabel 3.8 hp category ?php include( 'config.php' ); conn mysql connect( host, username, password);if( ! conn ){die( 'Koneksi tidak berhasil: ' . mysql error());}

65 db mysql select db( database, conn );if( ! db ){die( 'Tidak berhasil terkoenksi ke database: ' .mysql error() );} result mysql query( "SELECT * FROM hp categoryWHERE hp category id ". GET['catid'], conn );if ( ! result ) {die( 'Query gagal: ' . mysql error() );} total mysql num rows( result );if( total 0 ){ row mysql fetch array( result ); catname row['hp category name'];}? html head title .:: Toko Handphone Online - KatalogHandphone ::. /title linkrel "stylesheet"href "style.css"type "text/css" / /head body tablecellspacing "0"cellpadding "0"border "0" class "page" align "center" ?php include( 'header.php' ); ? ?php include( 'bar.php' ); ? tr td class "content" tablewidth "100%"cellspacing "0"cellpadding "5" border "0" tr td width "20%" class "content-left" ?phpinclude('katalog handphone.php' ) ? /td td width "80%" class "content-right" p class "handphone-navigasi"

66 ahref "index.php" Home /a  →  ?phpecho catname;? /p table width "100%" cellspacing "0"cellpadding "8" border "0" ?php result mysql query( "SELECT *FROMhandphoneWHEREhp category id ". GET['catid'] . " ORDER BY hp id DESC", conn );if ( ! result ) {die('Querygagal:'.mysql error() );} total mysql num rows( result);if( total 0 ){while( row mysql fetch array( result ) ){? tr td img src "images/ ?phpecho row['hp filename'];? " border "0" height "110"/ /td td width "90%" p class "hp-seri" ?phpecho row['hp code'];? /p p ?phpecho row['hp network system'];? /p p class "hp-price" Rp. ?php echo number format( row['hp price'], 2, ',','.' );? /p p ahref "detil.php?hpid ?phpecho row['hp id'];? " Detil /a /p /td /tr ?php}}? /table

67 /td /tr /table /td /tr ?php include( 'footer.php' ); ? /table /body /html 3.8.2Tampilan SinopsisSinopsis ini berisi cerita singkat dari handphone – handphone yang terdapat dikategori. Apabila pembeli mengklik detil, maka akan tampil halaman ini. Di halamanini terdapat kode, seri, jaringan, negara pembuat, ukuran, berat, layar, battery, waktusiaga, waktu bicara, ringtone, memory, GPRS, pesan, infrared, games, warna, harga,serta fitur dari handphone tersebut.Gambar 3.20 Tampilan Sinopsis

683.8.3 Tampilan halaman Shop cartPada halaman ini, bila si pembeli mengklik menu buy maka akan keluartampilan shop cart atau keranjang belanja. Di dalam keranjang belanja ini bisamemasukkan berapa jumlah barang yang ingin kita beli. Karena website inidefaultnya satu pada jumlah handphone, maka tidak menampilkan apakah barangtersedia atau habis. Disini juga akan menampilkan barapa jumlah harga darikeseluruhannya beserta ongkos kirim. Apbila telah selesai belanja maka klik simpanuntuk menyimpan data dan kemudian klik selesai belanjaGambar 3.21 Tampilan shop cart3.8.4 Tampilan halaman input data pribadiUntuk prose pembelian selanjutnya maka pembeli diwajibkan untuk mengisidata-data pribadi yang terdiri dari alamat dan nama, beserta nomor telepon yang bisadihubungi. Penulis sengaja membuat 2 data karena apabila si pembeli inginmengirimkan barang pesanannya sebagai hadiah kepada orang lain maka bisa mengisi

69pada data pengiriman. Tetapi, apabila handphone yang dibeli untuk pribadi maka datapengiriman sama dengan data pemesan.Gambar 3.22 Tampilan shop cart13.8.5 Tampilan halaman konfirmasi pesananHalaman ini berisi konfirmasi pesanan. Apakah pesanan sudah benar ataubelum. Jika pesanan dan data pribadi yang telah diinput masih terdapat kesalahan,maka user bisa memilih perbaiki pesanan dan akan kembali ke halaman penginputandata pribadi. Inputan tidak bisa di perbaiki tetapi harus diinput ulang kembali.Kemudian klik proses.

70Gambar 3.23 Tampilan shop cart23.8.6Tampilan halaman informasi pesananInformasi dari halaman ini hanya mengenai pesanan dan data pribadiyang telah diinput. Pada halaman ini data tidak bisa lagi diperbaiki.

71Gambar 3.24 Tampilan shop cart33.9Spesifikasi Hardware dan SoftwarePada pembuatan website ini penulis menggunakan komputer denganspesifikasi sebagai berikut : Spesifikasi hardware :1. Proseser Intel Pentium IV2. Memori RAM 256 MB3. Hardisk 40 GB4. VGA Card GeforceFX 5200 128 MB5. Monitor 17” LG Sedangkan software yang digunakan untuk menyelesaikan penulisan inibaik pembuatan situsnya ataupun dokumentasinya adalah sebagai berikut :1. Sistem Operasi Microsoft Windows XP Profesional.2. Xampp

723. Rational Rose 20004. Macromedia Dreamweaver MX 20043.10UploadUntuk mengupload website ini penulis mengunakan domainyang sudah ada, dengan kata lain penulis menjadi subdomain pada domainudasquad.info.Langkah-langkah untuk untuk mengupload website adalah sebagaiberikut :1. Setelah berhasil mendaftar ke universitas Gunadarma , penulis mendapat user iddan password untuk masuk ke filemanager yang digunakan untuk menguploadwebsite :FTPServer/Host:Username: udasquadPassword: e3hjF3d8 W5VUntuk data baseMySQLUsername: udasquad toko hp onlinePassword: nurul2. Setelah itu, login ke halaman www.fahmicell.udasquad.info/cpanel yangmenjadi domain.

73Gambar 3.25 tampilan halaman login3. Apabila berhasil login maka akan muncul halaman sebagai berikut :Gambar 3.26 tampilan halaman setelah login4. ZIP seluruh file yaitu folder fashionew menggunakan Winzip/winrar menjadi satufile .zip (cara : klik kanan folder website anda pilih add to archieve dan kompresmenggunakan ZIP ) untuk mempercepat proses upload.

745. Upload file zip web anda dengan mengklik file managerGambar 3.27 tampilan halaman menu file manager6. kemudian klik link wwwGambar 3.28 tampilan halaman menu dalam file manager7. kemudian klik tombol uploadGambar 3.28 tampilan halaman menu untuk mengupload8. kemudian folder pi nurul yang telah di zip anda pada bagian archieve denganmengklik tombol browse, Pilih file pi nurul.zip dan klik open9. Setelah di pilih klik tombol centang pada pojok kiri atas.

75Gambar 3.29 tampilan halaman untuk menguploadmelakukan file checking pada file pi nurul.zip, jika sukses maka akan muncultampilan seperti diatas:10. Cek pada file manager apakah website telah terupload pada folder www11. kemudian Lakukan upload databases, dengan cara :Apabila anda telah membuat website dari rumah, dan akanmengupload web tersebut, maka anda perlu membackup databases web yangtelah anda buat dengan menggunakan phpmyadmin, dengan cara :-Buka browser baru-Pada Address isikan http://localhost/phpmyadmin-pada Pilihan databases klik database toko hp online-Klik bar Export untuk membackup

76-pada web browser paling bawah centang Save As dan beri nama, penulismenyimpan file backup dengan nama udasquad toko hp online dan klikgoGambar 3.30 tampilan halaman untuk export databaseSetelah itu akam muncul tampilan seperti berikut:Gambar 3.31 tampilan halaman setelah export database-kembali ke menu cpanel, lalu lakukan upload databasedengan mengklik link phpmyadmin.

77Gambar 3.32 tampilan halaman menu php my admin-Lakukan koneksi ke databases yang, dengan mengklik database yang telahdicreate tadi yaitu udasquad toko hp online-Lakukan import databases dengan mengklik bar Import-Browse database udasquad toko hp online tadi dan klik open12. Isikan mysql user dengan user,password dengan username dan passwordyaitu udasquad toko hp online dan nurul.Klik icon disket13. website telah berhasil diupload ke internet, dengan alamat website nya adalahwww.fahmicell.udasquad.info

Gambar 3.7 Diagram component Gambar 3.9 menunjukkan file-file yang terdapat pada perancangan program dimana file-file tersebut terbagi menjadi dua bagian, yaitu : user dan admin. Dimana kedua-duanya berhubungan dengan file index.php, user hanya terdiri dari satu komponen, yaitu pesan_hp.php, sedangkan admin terdiri dari 4 komponen, yaitu