Perancangan Website E-Commerce Pada Toko Pakaian Cantik Modis Menggunakan Dreamweaver 8
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 Kartu Bimbingan Tugas Akhir Mahasiswa
Nama : Dimas Andika Nasution
Nomor Induk Mahasiswa : 102406146
Judul Tugas Akhir : Perancangan Website E-Commerce Pada Toko Pakaian Cantik Modis Menggunakan Dreamweaver 8 Dosen Pembimbing : Syahriol Sitorus, S.Si, M.IT
Tanggal Mulai Bimbingan : ... Tanggal Selesai Bimbingan : ...
No 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
Prof.Drs.Tulus, Vordipl.Math.,M.Si.,Ph.D. Syahriol Sitorus, S.Si, M.IT NIP. 196209011988031002 NIP. 197103101997031004
(2)
SURAT KETERANGAN
Hasil Uji Program Tugas Akhir
Yang bertanda tangan di bawah ini, menerangkan bahwa Mahasiswa Tugas Akhir Program Diploma 3 Teknik Informatika :
Nama : DIMAS ANDIKA NASUTION
NIM : 102406146
Program Studi : DIPLOMA (D3) TEKNIK INFORMATIKA
Judul Tugas Akhir : PERANCANGAN WEBSITE E-COMMERCE PADA TOKO PAKAIAN CANTIK MODIS MENGGUNAKAN
DREAMWEAVER 8
Telah melaksanakan test program Tugas Akhir Mahasiswa tersebut di atas pada tanggal Juni 2013
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 2013 Dosen Pembimbing
Program Studi D3 Teknik Informatika
Syahriol Sitorus, S.Si, M.IT NIP. 197103101997031004
(3)
LISTING PROGRAM
1. Index.php <html>
<head><title>CANTIK MODIS</title>
<link href="css/style.css" rel="stylesheet" type="text/css" /> <!-- include CSS always before including js -->
<link type="text/css" rel="stylesheet" href="skins/tn3/tn3.css"></link>
<!-- include jQuery library --> <script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" ></script>
<!-- include tn3 plugin --> <script type="text/javascript"
src="js/jquery.tn3lite.min.js"></script>
<!-- initialize the TN3 when the DOM is ready --> <script type="text/javascript">
$(document).ready(function() {
//Thumbnailer.config.shaderOpacity = 1; var tn1 = $('.mygallery').tn3({
skinDir:"skins", imageClick:"fullscreen", image:{ maxZoom:1.5, crop:true, clickEvent:"dblclick", transitions:[{ type:"blinds" },{ type:"grid" },{ type:"grid", duration:460, easing:"easeInQuad", gridX:1, gridY:8,
// flat, diagonal, circle, random sort:"random",
sortReverse:false, diagonalStart:"bl", // fade, scale method:"scale", partDuration:360, partEasing:"easeOutSine", partDirection:"left" }] } }); }); </script> </head> <body> <div id="wrapper"> <div id="header">
(4)
<div id="logo"><img src="images/logo.png"></div> <div id="icon"><a href="https://www.facebook.com/ButikCantikModis"><img src="images/fb.png" /></a> <a href="#"><img src="images/twitter.png" /></a> </div> </div> <div id="menu1"> <ul class="top_menu"> <li><a href="index.php"><img src="images/home.png" /> HOME</a></li> <li><a href="?p=cara_order.php"><img src="images/info.png" /> CARA ORDER</a></li>
<li><a href="?p=gallery.php"><img src="images/order.png" /> GALLERY</a></li> </ul> </div> <div id="content"> <?php
if($_REQUEST['p'] != '') { include $_REQUEST['p']; } else { include "content.php"; } ?> </div>
<?php include"menu.php"; ?>
<div id="footer">Copyright © 2013 Cantik Modis</div> </div>
</body> </html>
2. Content.php
<h2>SELAMAT DATANG DI WEBSITE KAMI</h2> <hr noshade />
<div id="slider">
<div class="mygallery">
<div class="tn3 album"> <h4>Fixed Dimensions</h4>
<div class="tn3 description">Images with fixed dimensions</div>
<div class="tn3 thumb">images/35x35/1.jpg</div> <ol>
<li>
<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>
<a href="images/960x377/cantik modis.jpg"> <img src="images/35x35/1.jpg" /></a></li> <li>
<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>
<a href="images/960x377/cantik modis1.jpg"> <img src="images/35x35/2.jpg" /></a></li>
(5)
<li>
<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>
<a href="images/960x377/cantik modis2.jpg"> <img src="images/35x35/3.jpg" /></a></li> <li>
<h4>Produk-produk Cantik Modis</h4> <div class="tn3 description"></div>
<a href="images/960x377/cantik modis3.jpg"> <img src="images/35x35/4.jpg" /></a></li> </ol> </div> </div> <div class="clear"></div> </div> 3. Menu.php <div id="menu"> <ul class="top_menu"> <li><a href="?p=aboutus.php">
<img src="images/about.png"/> ABOUT US</a></li> <li><a href="?p=contact.php">
<img src="images/contact.png" /> CONTACT</a></li> <li><a href="?p=login.php">
<img src="images/login.png" /> LOGIN</a></li> </ul>
</div>
4. Cara_order.php <div id="syarat">
<h3>Sebelum memesan, mohon dibaca terlebih dahulu prosedur dan Terms of Service dari kami.</h3>
<hr noshade /> <br />
<h5>PEMESANAN</h5>
<p>Sebelum melakukan pemesanan barang, pilih barang yang ingin di pesan di menu <font color="#0000FF"
style="font-weight:bold">"Gallery"</font> lalu pilih jenis barang yang ingin Anda Pesan, lalu klik tombol <font color="#0000FF"
style="font-weight:bold">"Beli"</font> pada barang yang ingin Anda beli. Setelah itu isi form secara lengkap kecuali <font color="#0000FF"
style="font-weight:bold">Nama Barang</font> karena sudah terisi otomatis dari barang yang Anda pilih sebelumnya. Setelah Form Order terisi lengkap klik tombol ORDER agar data Anda tersimpan.</p>
<h5>PEMBAYARAN</h5>
<p>Setelah menerima, mendiskusikan, dan mengkonfirmasi pesanan Anda, kami akan mengirimkan info melalui sms yang berisi informasi total harga, ongkos kirim, time limit pembayaran dan info rekening untuk transaksi ( berbagai bank yang tersedia ). Booking dianggap batal apabila sampai batas waktu/time limit yang sudah ditentukan, pembayaran belum diselesaikan. Apabila kami tidak menginfokan time limit, mohon tetap diperhatikan bahwa pembayaran sudah harus
(6)
diselesaikan sebelum H-7. Order kami anggap confirmed statusnya setelah pembayaran selesai.</p>
<h5>PENGIRIMAN</h5>
<p>1. Setelah transaksi diselesaikan, order akan kami masukan dalam schedule. Kami akan mengerjakan dan mengirimkan pesanan Anda pada tanggal, waktu dan alamat yang sudah ditentukan. </p>
<p>2. Harga yang tercantum pada katalog belum termasuk ongkos kirim. Ongkos kirim bervariasi tergantung jauh dekatnya lokasi tujuan (between Rp. 15.000 - 50.000). Wilayah kota Medan - gratis.</p>
<p>3. Nomor kontak penerima sangat penting, agar dapat kami/kurir hubungi apabila kami menemui kesulitan dalam mencari alamat tujuan.</p>
<h5>LAPORAN</h5>
<p>Apabila barang yang dipesan telah sampai, kami berharap Anda memberi laporan berupa sms atau email ke kami agar tidak terjadi kesalah pahaman. Terimakasih.</p>
<h5>INFORMASI TENTANG TOKO PAKAIAN CANTIK MODIS:</h5> <table border="0">
<tr><td width="100px">Telefon/Hp</td><td>: 085763522177</td></tr>
<tr><td>Email</td><td>: Cantikmodis@yahoo.co.id</td></tr>
<tr><td>Alamat</td><td>: Jl. Abdullah Lubis 85/119 Medan Baru</td></tr>
</table>
<hr noshade="noshade" />
<h3>TOKO PAKAIAN CANTIK MODIS</h3> </div>
5. Aboutus.php <div id="c_1">
<div id="c_2">
<h4>TENTANG CANTIK MODIS</h4>
<p>Toko Pakaian Cantik Modis ini dibuka pada tanggal 1 Agustus 2012 yang berlokasi di Jalan Abdullah Lubis 85/119 Medan Baru, Medan. Dan beroperasi dari pukul 09.OO WIB - 23.00 WIB</p>
<p>Toko Pakaian Cantik Modis ini menjual pakaian-pakaian wanita dari berbagai merk.</p>
</div>
<div id="c_3"><img src="images/images/b.jpg" /></div> </div>
<hr noshade /> <div id="c_4">
<div id="c_5">
<h5>Artikel Tentang Produk Yang Ditawarkan:</h5> <table cellpadding="5px" cellspacing="5px">
<tr>
<td width="360px"><b>Blus</b> adalah pakaian tubuh bagian atas bermodel longgar yang sebelumnya dikenakan oleh pekerja, petani, seniman, perempuan dan anak-anak.
Blus biasanya dikenakan denga cara dikumpulkan di bagian pinggang (dengan ikat pinggang atau sabuk) sehingga menggantung longgar diatas tubuh pemakainya. (sumber: wikipedia bahasa indonesia)</td>
<td width="370px"><b>Celana</b> adalah pakaian bawahan yang dipakai untuk menutupi dari pinggang sampai kaki. ada dua kategori umum dari celana:
(7)
celana pendek (dengan ukuran dari pinggang sampai lutut atau kurang). celana panjang (dengan ukuran dari pinggang sampai tumit). (sumber: wikipedia bahasa indonesia) </td></tr>
<tr>
<td><b>Gamis</b> adalah jenis pakaian muslim wanita dengan model lurus, panjang dan longgar menutupi seluruh badan mulai dari dada sampai kaki mata kaki, sehingga pemakainya tidak harus mencari atasan atau bawahan karena sudah dalam satu kesatuan.</td>
<td><b>Rok</b> adalah sejenis pakaian dengan bentuk pipa atau kerucut yang cara pemakaiannya dimulai dari pinggul dan menutupi sebagian atau seluruh bagian kaki. berbeda dengan celana, bagian dari rok tidak dibagi menjadi bagian kaki kiri dan bagian kaki kanan tetapi langsung menjadi satu bagian yang menutupi sebagian atau seluruh bagian kaki. (sumber: wikipedia bahasa indonesia) </td></tr>
<tr>
<td><b>Jilbab</b> adalah busanan muslim terusan panjang menutupi seluruh badan kecuali tangan, kaki, dan wajah yang biasa dikenakan oleh para wanita muslim. (sumber: wikipedia bahasa indonesia)</td></tr>
</table> </div>
<div id="c_6">
<div class="logo1">Jasa Pembayaran<hr noshade="noshade" /><img src="images/bca.jpg" /></div>
<div class="logo2">Jasa Pengiriman<hr noshade="noshade" /><img src="images/jne.jpg" /></div>
</div> </div> 6. Contact.php <div id="c_1"> <div id="c_2"> <h4>HUBUNGI KAMI</h4>
<p>Kami selalu siap menjawab pertanyaan Anda! Silahkan Hubungi kami di:</p> <table border="0"> <tr><td width="100px">Telefon/Hp</td><td>: 085763522177</td></tr> <tr><td>Email</td><td>: Cantikmodis@yahoo.co.id</td></tr>
<tr><td>Alamat</td><td>: Jl. Abdullah Lubis 85/119 Medan Baru</td></tr>
</table> </div>
<div id="c_3"><img src="images/images/a.jpg" /></div> </div>
<hr noshade /> <div id="c_4">
<div id="c_5">
<h5>Artikel Tentang Produk Yang Ditawarkan:</h5> <table cellpadding="5px" cellspacing="5px">
(8)
<td width="360px"><b>Blus</b> adalah pakaian tubuh bagian atas bermodel longgar yang sebelumnya dikenakan oleh pekerja, petani, seniman, perempuan dan anak-anak.
Blus biasanya dikenakan denga cara dikumpulkan di bagian pinggang (dengan ikat pinggang atau sabuk) sehingga menggantung longgar diatas tubuh pemakainya. (sumber: wikipedia bahasa indonesia)</td>
<td width="370px"><b>Celana</b> adalah pakaian bawahan yang dipakai untuk menutupi dari pinggang sampai kaki. ada dua kategori umum dari celana:
celana pendek (dengan ukuran dari pinggang sampai lutut atau kurang). celana panjang (dengan ukuran dari pinggang sampai tumit). (sumber: wikipedia bahasa indonesia) </td></tr>
<tr>
<td><b>Gamis</b> adalah jenis pakaian muslim wanita dengan model lurus, panjang dan longgar menutupi seluruh badan mulai dari dada sampai kaki mata kaki, sehingga pemakainya tidak harus mencari atasan atau bawahan karena sudah dalam satu kesatuan.</td>
<td><b>Rok</b> adalah sejenis pakaian dengan bentuk pipa atau kerucut yang cara pemakaiannya dimulai dari pinggul dan menutupi sebagian atau seluruh bagian kaki.
berbeda dengan celana, bagian dari rok tidak dibagi menjadi bagian kaki kiri dan bagian kaki kanan tetapi langsung menjadi satu bagian yang menutupi sebagian atau seluruh bagian kaki. (sumber: wikipedia bahasa indonesia) </td></tr>
<tr>
<td><b>Jilbab</b> adalah busanan muslim terusan panjang menutupi seluruh badan kecuali tangan, kaki, dan wajah yang biasa dikenakan oleh para wanita muslim. (sumber: wikipedia bahasa indonesia)</td>
</tr> </table> </div>
<div id="c_6">
<div class="logo1">Jasa Pembayaran<hr noshade="noshade" /><img src="images/bca.jpg" /></div>
<div class="logo2">Jasa Pengiriman<hr noshade="noshade" /><img src="images/jne.jpg" /></div>
</div> </div> 7. Gallery.php <div id="gallery"> <div id="gallery1"> <ul> <li><a href="?p=Blus.php">
<img src="images/blus.jpg" /></a></li> <li><a href="?p=Celana.php">
<img src="images/celana.jpg" /></a></li> <li><a href="?p=Gamis.php">
<img src="images/gamis.jpg" /></a></li> <li><a href="?p=Jilbab.php">
<img src="images/jilbab.jpg" /></a></li> <li><a href="?p=Rok.php">
(9)
<img src="images/rok.jpg" /></a></li> <li><a href="?p=Stelan.php">
<img src="images/stelan.jpg" /></a></li> </ul> </div> </div> 8. Blus.php <div id='tampilan1'> <?php include "koneksi.php";
$sql=mysql_query("select * from barang Where nama_kategori='Blus'"); ?>
<script type="text/JavaScript"> <!--
function MM_popupMsg(msg) { //v1.0 alert(msg);
}
function MM_goToURL() { //v3.0
var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2)
eval(args[i]+".location='"+args[i+1]+"'"); }
//--> </script> <?php
//menentukan batas, cek dan posisi data $batas=10;
$halaman = $_REQUEST['halaman']; if(empty($halaman)){
$posisi=0; $halaman = 1; } else {
$posisi = ($halaman-1) * $batas; }
//sesuaikan perintah SQL dengan posisi dan batas
$sql= "SELECT * FROM barang where nama_kategori='Blus' ORDER BY id_barang DESC LIMIT $posisi,$batas";
$result = mysql_query($sql); $test=mysql_num_rows($result); if ($test!=0)
{ while($data=mysql_fetch_array($result)){ ?>
<div id="tampilan">
<table border="0" align="center">
<tr><?php $id= $data['id_barang']; ?><td align="center" ><img src="admin/images/images/<?php echo $data['gambar']; ?>" /></td></tr>
<tr><td align="center"><?php echo
$data['nama_kategori']; ?> <?php echo $data['nama_barang']; ?></td></tr>
<tr><td align="center">Rp.<?php echo $data['harga']; ?></td></tr>
(10)
<tr><td align="center"><acronym title="Edit Data"><img src="images/beli.png" align="middle"
onClick="MM_goToURL('parent', 'index.php?p=order.php&id=<?php echo $data['id_barang']; ?>');return document.MM_returnValue" /></acronym></td> </tr> </table> </div> <?php } echo"<div id='tampilan2'>";
echo"<table width='500' align='center' id='tabel_show' cellpadding='1' cellspacing='1'><tr><td></td><td>";
$sql2 = mysql_query("select * from barang where nama_kategori='Blus'");
$result=mysql_num_rows($sql2); $jmlhalaman=ceil($result/$batas);
/* bangun Previous link */ if($halaman > 1){
$prev = ($halaman - 1); ?>
<a href="index.php?p=gamis.php&halaman=1"> << First</a> |
<a href="index.php?p=gamis.php&<? echo "halaman=$prev"; ?>"> <<Previous </a>
<?php } else {
echo "<p>First| < Previous "; } //tampilkan link halaman 1,2,3... for($i = 1; $i <= $jmlhalaman; $i++){
if($i == $halaman){ echo "$i "; }
else { ?>
<a href="index.php?p=gamis.php&<? echo "halaman=$i"; ?>"><? echo $i; ?></a>
<?php } }
/* bangun Next link */ if($halaman < $jmlhalaman){
$next = $halaman + 1; ?>
<a href="index.php?p=gamis.php&<? echo "halaman=$next"; ?>">Next> |</a>
<a href="index.php?p=gamis.php&<? echo "halaman=$jmlhalaman"; ?>">Last </a>
<?php }
echo "</td></tr></table></div>";
}//akhir dari kondisi bahwa data tidak kosong
else { echo "<p>MAAF, BARANG TIDAK TERSEDIA</p>"; } ?>
(11)
9. Order.php <div id="form"> <?php
include ("koneksi.php"); $id=$_REQUEST['id'];
$view= mysql_query ("select nama_kategori, nama_barang from barang where id_barang='$id'",$koneksi)
or die (mysql_error());
if ($data=mysql_fetch_array ($view)) {
?>
<form action="proses_order.php" method="post"> <table border="0"> <tr><th colspan="2"> &nb sp; FORM ORDER</th></tr> <tr><td> </td><td> </td></tr> <tr><td>Tanggal Order</td> <td>:<select name='tanggal'> <?php for($i=1;$i<=31;$i++) {
echo "<option value='$i'>$i</option>"; } ?> </select> <select name="bulan"> <?php $bulan=array("Januari","Februari","Maret","April","Mei","Juni", "Juli","Agustus","September","Oktober","November","Desember"); $jlh_bln=count($bulan); for($i=0;$i<$jlh_bln;$i++) { $w=$i+1;
echo "<option value='$w'>$bulan[$i]</option>"; } ?> </select> <select name='tahun'> <?php for($i=2013;$i<=2016;$i++) {
echo "<option value='$i'>$i</option>"; }
?>
</select> </td> </tr>
<tr><td>Nama Lengkap</td><td>: <input type="text" name="nama" placeholder="Nama Lengkap" /></td></tr>
<tr><td>Alamat Lengkap</td><td>: <textarea name="alamat"></textarea></td></tr>
<tr><td>Kota</td><td>: <input type="text" name="kota" /></td></tr>
<tr><td>Kode Pos</td><td>: <input type="text" name="kode_pos" /></td></tr>
(12)
<tr><td>Nomor Telp/Hp</td><td>: <input type="text" name="nomor_telp" /></td></tr>
<tr><td>Nama Barang</td><td>: <input type="text"
name="nama_barang" value="<?php echo $data['nama_kategori']; ?> <?php echo $data['nama_barang'];?>" /></td></tr>
<tr><td>Jumlah Barang Yang Di Order</td><td>: <input type="text" name="jumlah" /></td></tr>
<tr><td> </td></tr>
<tr><td align="right"><input type="submit" name="submit" value="ORDER"/></td>
<td> <input type="button" value="CANCEL" onclick=self.history.back()></td>
</tr> </table> </form> <?php } ?> </div> 10.Proses_order.php <?php include ("koneksi.php"); $tanggal=$_REQUEST['tanggal']; $bulan=$_REQUEST['bulan']; $tahun=$_REQUEST['tahun']; $tanggalorder=$tahun."-".$bulan."-".$tanggal; $nama=$_REQUEST['nama']; $alamat=$_REQUEST['alamat']; $kota=$_REQUEST['kota']; $kodepos=$_REQUEST['kode_pos']; $nomortelp=$_REQUEST['nomor_telp']; $namabarang=$_REQUEST['nama_barang']; $jumlah=$_REQUEST['jumlah'];
if($nama!="" && $alamat!='') {
$qry=mysql_query("insert into pesanan
(tanggal,nama,alamat,kota,kode_pos,nomor_telp,nama_barang,jumlah) values('$tanggalorder','$nama','$alamat','$kota','$kodepos','$nomorte lp','$namabarang','$jumlah')",$koneksi) or die (mysql_error()); ?>
<script language="javascript"> <!--
alert("Terimakasih Data Anda Telah Kami Terima") window.location="index.php?p=gallery.php";
--></script> <?php } else{
?>
<script language ="javascript"> <!--
alert("Maaf.. Data Anda gagal")
window.location="index.php?p=order.php"; --></script>
<?php }
(13)
11.Koneksi.php <?php $hostname="localhost"; $dbuser="root"; $dbpass=""; $dbname="cantik_modis";
$koneksi=mysql_connect($hostname,$dbuser,$dbpass) or die (mysql_error());
mysql_select_db($dbname,$koneksi) or die (mysql_error()); ?>
12.Login.php <div class="login">
<form action="cek.php" method="post"> <table border="0"> <tr><th colspan="2"> &nb sp; LOGIN</th></tr> <tr><td> </td><td> </td></tr> <tr><td> </td><td> </td></tr> <tr>
<td width="120 px">Username</td>
<td>: <input type="text" name="username"></td> </tr>
<tr>
<td>Password</td>
<td>: <input type="password" name="password"></td> </tr>
<tr>
<td></td><td> <input type="submit" name="submit" value="Login"></td> </tr> </table> </form> </div> 13.Cek.php <?php include("koneksi.php"); $username=$_REQUEST['username']; $pass=$_REQUEST['password']; if ($username!=''&& $pass!='') {
$sql= "SELECT * FROM user Where username='$username' AND password='$pass'";
(14)
$result = mysql_query($sql)or die(mysql_error()); $hasil=mysql_fetch_array($result);
if($hasil['username']==$username && $hasil['password']==$pass) { if($hasil['status']=='admin') { session_start(); $_SESSION['pengguna']=$hasil['username']; header ("location:admin/index.php"); } if($hasil['status']=='member') { session_start(); $_SESSION['pengguna']=$hasil['username']; header ("location:member/index.php"); } }else{ ?> <script type="text/javascript"> <!--
window.location = "index.php";
alert("Your name or password is wrong..") //--> </script> <?php } }else{ ?> <script type="text/javascript"> <!--
window.location = "../index.php"; alert("Silahkan Login.") //--> </script> <?php } ?> 14.Style.CSS @charset "utf-8";
body{ margin:0px; background: url(../images/a.jpg) repeat-x;} #wrapper{ width:960px; background: url(../images/a.jpg) repeat-x;
margin: 0 auto;} #header{ height:80px; }
#logo{ width:840px; float:left;}
#icon{ width:120px; float:left; margin-top:20px;} #content{ border-left: 1px solid #CCCCCC;
border-right:1px solid #CCCCCC; height: auto;padding:10px; clear:both;}
(15)
#tampilan1{ width:940px; height:auto; margin-left:20px; margin-right:20px;}
#tampilan table{ float:left; border: 1px solid #999999;
background: #FFFFFF; width:160px; height:auto; margin:10px; margin-top:30px;}
#tampilan tr td{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#0000FF;}
#tampilan2{clear:both;}
#tampilan2 tr td{text-align:center;
font-family:Verdana, Arial, Helvetica, sans-serif; color:#0000FF; font-size:12px; font-weight:bold;} #tampilan2 p{text-align:center;}
#tampilan2 a{text-decoration:none;} .clear{ clear:both; }
h2{text-align:center;font-family:Verdana, Arial, Helvetica, sans-serif; font-style: inherit; color:#000066; }
p{ text-align: center; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; }
#syarat{ margin:auto; height:auto; background:#FFFFFF; padding:10px; border:1px solid #CCCCCC; }
#syarat h3{ text-align:center; color: #000000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:14px; }
#syarat h5{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; font-weight:bold; color:#FF0000; } #syarat p{ text-align: justify; font-family:Verdana, Arial,
Helvetica, sans-serif; font-size:13px; font-weight: 900; } #syarat tr td{ text-align: justify; font-family:Verdana, Arial,
Helvetica, sans-serif; font-size:13px; font-weight: 900; }
#c_1{ height:280px; margin-bottom:20px; display:block;}
#c_2{ width:480px; height:260px; margin-right:10px; float:left; padding:10px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:14px;}
#c_2 h4{ font-size:18px; margin:0px; }
#c_2 p{ text-align:left; font-weight:normal; } #c_2 tr td{ font-size:14px; }
#c_3{ width:395px; height:280px; padding-left:23px; float:left; } #c_4{ height:380px; clear: both; }
(16)
#c_5 { width:780px; height:370px; float:left; margin-right:10px; border-right: 1px solid #CCCCCC; }
#c_5 h5{ margin-top: 0px; font-family:Verdana, Arial, Helvetica, sans-serif;}
#c_5 tr td{ text-align: justify; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; }
#c_6{ float:left; width:136px; height:370px;
font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight:bolder; color:#333333;} .logo1{ width:136px; height:100px; float:left;}
.logo2{ width:136px; height:100px; float:left; } #gallery{ height:auto; }
#gallery1{ height:480px;}
#gallery1 li{ list-style:none;}
#gallery1 ul li{ float:left; margin-left:40px; margin-right:40px; margin-bottom: 40px;}
#gallery1 li:hover{ background: #999999; }
.login{ border: 1px solid #999999; margin:auto; margin-top:20px; margin-bottom:20px; width: 350px; height:300px;
background: #C0C0C0; padding: 10px;
-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
.login tr th{ text-align:center; color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif; font-size:large;}
.login tr td{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px;}
#form{ margin:auto; border: 1px solid #999999; margin-top:40px; margin-bottom:20px; height:340px; width:440px;
background: #C0C0C0; padding:10px;
-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
#form tr th{ text-align: center;
font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 14px; color:#FFFFFF;}
#form tr td{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px;}
#menu1{ clear:both; height:40px; padding-left:258px;} #menu{ clear:both; height:40px; padding-left:258px;
background:url(../images/menu.jpg) repeat-x;} .top_menu{ margin:0px;}
(17)
.top_menu li{ float:left; list-style:none; }
.top_menu li a{ padding-top:8px; padding-bottom:8px; padding-right:20px; padding-left:5px; text-decoration:none; color: #222324; font:icon; font-size:16px;
font-weight:bold; display:block; }
.top_menu li a:hover{ background: url(../images/menu.png); color:#0000FF;}
.top_menu li:hover{ position:relative; } #footer{ clear:both; height:14px;
background:url(../images/footer.jpg) repeat-x; -webkit-border-bottom-right-radius: 20px; -webkit-border-bottom-left-radius: 20px; -moz-border-radius-bottomright: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px; text-align:center; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; font-style:italic; padding:3px;}
LISTING PROGRAM PADA FILE ADMIN
1. Koneksi.php <?php $hostname="localhost"; $dbuser="root"; $dbpass=""; $dbname="Cantik_modis";
$koneksi=mysql_connect($hostname,$dbuser,$dbpass) or die (mysql_error());
mysql_select_db($dbname,$koneksi) or die (mysql_error()); ?>
2. Index.php
<?php session_start();
if(!isset($_SESSION['pengguna'])) {
?>
<script language="JavaScript">
alert ("Silahkan Login terlebih dahulu..") location.href="../index.php";
</script> <?php
} else {
(18)
<div id="content"> <?php
if($_REQUEST['p'] != '') {
include $_REQUEST['p']; } else {
include "content.php"; }
?> </div>
<?php include"menu.php"; ?>
<div id="footer">Copyright © 2013 Cantik Modis</div> </div>
</body> </html> <?php } ?>
3. Header.php <html>
<head><title>CANTIK MODIS</title>
<link href="css/style.css" rel="stylesheet" type="text/css" /> </head>
<body>
<div id="wrapper"> <div id="header">
<div id="logo"><img src="images/logo.png"></div> <div id="icon">
<a
href="https://www.facebook.com/ButikCantikMod is"><img src="images/fb.png" /></a>
<a href="#">
<img src="images/twitter.png" /></a> </div>
</div>
4. Content.php
<div id="home"><H1>SELAMAT DATANG ADMIN..</H1></div>
5. Menu.php <div id="menu">
<ul id="top_menu">
<li><a href="index.php">
<img src="images/a.png" /> HOME</a></li> <li><a href="?p=form_barang.php">
<img src="images/b.png" > TAMBAH BARANG</a></li> <li><a href="?p=lihat_barang.php">
<img src="images/c.png" > LIHAT BARANG</a></li> <li><a href="?p=daftar_order.php">
(19)
<li><a href="?p=logout.php">
<img src="images/e.png" /> LOGOUT</a></li> </ul>
</div>
6. Form_barang.php <div class="form">
<form method="post" action="proses_simpan_barang.php" enctype="multipart/form-data"> <table> <tr><th colspan="2"> TAMBAH BARANG</th></tr> <tr><td> </td><td> </td></tr> <tr><td> </td><td> </td></tr>
<tr><td>Nama Barang</td><td>: <input type="text" name="nama_barang" /></td></tr>
<tr><td width="150px">Jenis Barang</td><td>:<?php include ("koneksi.php");
$sql=mysql_query("select * from kategori"); ?>
<select name="kategori">
<?php while($data=mysql_fetch_array($sql)) { ?>
<option value="<?php echo
$data['nama_kategori'];?>"><?php echo $data['nama_kategori'];?> </option>
<?php } ?> </select></td> </tr>
<tr><td>Gambar</td><td> : <input type="file" name="gambar"></td></tr>
<tr><td>Jumlah Barang</td><td>: <input type="text" name="jumlah" /></td></tr>
<tr><td>Harga</td><td>: <input type="text" name="harga" /></td></tr>
<tr><td></td><td> <input type="submit" value="Simpan">
<input type="button" value=Batal onclick=self.history.back()></td>
</tr> </table> </form> </div>
(20)
7. Proses_simpan_barang.php <?php include ("koneksi.php"); $lokasi_file=$_FILES['gambar']['tmp_name']; $tipe_file=$_FILES['gambar']['type']; $nama_file=$_FILES['gambar']['name']; $direktori="images/images/$nama_file"; if (!empty($lokasi_file)){ move_uploaded_file($lokasi_file,$direktori); mysql_query("insert into barang
(nama_barang,nama_kategori,gambar,jumlah,harga) values ('".$_POST['nama_barang']."','".$_POST['kategori']."','".$nama_file." ','".$_POST['jumlah']."','".$_POST['harga']."')"); ?> <script language="javascript"> <!--
alert("Data Telah Disimpan")
window.location="index.php?p=lihat_barang.php"; --></script>
<?php } else { ?>
<script language ="javascript"> <!--
alert("Maaf.. Data Gagal di Simpan")
window.location="index.php?p=form_barang.php"; --></script> <?php } ?> 8. Lihat_barang.php <?php include "koneksi.php";
$sql=mysql_query("select * from barang"); ?>
<script type="text/JavaScript"> <!--
function MM_popupMsg(msg) { //v1.0 alert(msg);
}
function MM_goToURL() { //v3.0
var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2)
eval(args[i]+".location='"+args[i+1]+"'"); }
//--> </script> <?php
//menentukan batas, cek dan posisi data $batas=10;
$halaman = $_REQUEST['halaman']; if(empty($halaman)){
(21)
$halaman = 1; } else {
$posisi = ($halaman-1) * $batas; }
//sesuaikan perintah SQL dengan posisi dan batas
$sql= "SELECT * FROM barang ORDER BY id_barang DESC LIMIT $posisi,$batas";
$result = mysql_query($sql); $test=mysql_num_rows($result); if ($test!=0) { while($data=mysql_fetch_array($result)){ ?> <div id="tampilan1"> <div id="tampilan">
<table border="0" align="center">
<tr><?php $id= $data['id_barang']; ?><td
align="center" ><img src="images/images/<?php echo $data['gambar']; ?>" /></td></tr>
<tr><td align="center"><?php echo
$data['nama_kategori']; ?> <?php echo $data['nama_barang']; ?></td></tr>
<tr><td align="center">Sisa Barang: <?php echo $data['jumlah']; ?></td></tr>
<tr><td align="center">Rp.<?php echo $data['harga']; ?></td></tr>
<tr><td align="center"><acronym title="Edit Data"><img src="images/edit.png" align="middle"
onClick="MM_goToURL('parent',
'index.php?p=edit_barang.php&id=<?php echo $data['id_barang']; ?>');return document.MM_returnValue" /></acronym>
<a href='hapus_barang.php?id=<?php echo $data['id_barang']; ?>'
onClick=\"return confirm('Apakah Anda benar-benar akan menghapus data ini?')\">
<img src="images/hapus.png" align="middle" /></a> </td> </tr> </table> </div> </div> <?php } echo"<div id='tampilan2'>";
echo"<table width='500' align='center' id='tabel_show' cellpadding='1' cellspacing='1'><tr><td></td><td>";
$sql2 = mysql_query("select * from barang"); $result=mysql_num_rows($sql2);
$jmlhalaman=ceil($result/$batas);
/* bangun Previous link */ if($halaman > 1){
$prev = ($halaman - 1); ?>
<a href="index.php?p=lihat_barang.php&halaman=1"> << First</a> |
<a href="index.php?p=lihat_barang.php&<? echo "halaman=$prev"; ?>"> <<Previous </a>
(22)
<?php } else {
echo "<p>First| < Previous "; } //tampilkan link halaman 1,2,3... for($i = 1; $i <= $jmlhalaman; $i++){
if($i == $halaman){ echo "$i "; } else { ?>
<a href="index.php?p=lihat_barang.php&<? echo "halaman=$i"; ?>"><? echo $i; ?></a>
<?php } }
/* bangun Next link */ if($halaman < $jmlhalaman){
$next = $halaman + 1; ?>
<a href="index.php?p=lihat_barang.php&<? echo "halaman=$next"; ?>">Next> |</a>
<a href="index.php?p=lihat_barang.php&<? echo "halaman=$jmlhalaman"; ?>">Last </a>
<?php }
echo "</td></tr></table></div>";
}//akhir dari kondisi bahwa data tidak kosong else { echo "<p>TIDAK ADA DATA DALAM DATABASE "; } ?>
9. Edit_barang.php <?php
include ("koneksi.php"); $id=$_REQUEST['id'];
$view= mysql_query ("select * from barang where id_barang='$id'",$koneksi)or die (mysql_error());
if ($data=mysql_fetch_array ($view)){ ?>
<div class="form">
<form action="proses_edit_barang.php?id=<?php echo $id ?>" method="post">
<table>
<tr><th colspan="2"> EDIT BARANG</th></tr>
<tr><td> </td><td> </td></tr> <tr><td> </td><td> </td></tr>
<tr><td>Nama Barang</td><td>: <input type="text"
name="nama_barang" size="32" maxlength="32" value="<?php echo $data['nama_barang'];?>"/></td></tr>
<tr><td width="150px">Jenis Barang</td><td>:<?php $sql=mysql_query("select * from kategori");?>
<select name="kategori"><?php while($data=mysql_fetch_array($sql)){ ?>
<option value="<?php echo $data['nama_kategori'];?>"><?php echo
$data['nama_kategori'];?></option><?php } ?> </select></td>
(23)
<tr><td>Gambar</td><td> : <input type="file" name="gambar" value="<?php echo $data['gambar'];?>"></td></tr>
<tr><td>Jumlah Barang</td><td>: <input type="text"
name="jumlah" value="<?php echo $data['jumlah'];?>"/></td></tr> <tr><td>Harga</td><td>: <input type="text" name="harga" value="<?php echo $data['harga'];?>" /></td></tr>
<tr><td></td><td> <input type="submit" value="Simpan">
<input type="button" value=Batal onclick=self.history.back()></td>
</tr>
<tr><td> </td></tr>
<tr><td colspan="2" align="center"><a
href="index.php?p=lihat_barang.php">Kembali</a></td></tr> </table>
</form> </div> <?php } ?>
10.Proses_edit_barang.php <?php include ("koneksi.php"); $nama_barang=$_REQUEST['nama_barang']; $nama_kategori=$_REQUEST['kategori']; $gambar=$_REQUEST['gambar']; $jumlah=$_REQUEST['jumlah']; $harga=$_REQUEST['harga']; $id=$_REQUEST['id'];
$qry=mysql_query("update barang set nama_barang='$nama_barang', nama_kategori='$nama_kategori', gambar='$gambar',
jumlah='$jumlah',harga='$harga' where id_barang='$id'",$koneksi) or die (mysql_error());
?>
<script language="javascript"> <!--
alert('Data Telah Di Ganti')
window.location = "index.php?p=lihat_barang.php"; --></script>
11.Hapus_barang.php
<?php include("koneksi.php"); $id1=$_REQUEST['id'];
$qry= mysql_query ("delete from barang where
id_barang='$id1'",$koneksi) or die (mysql_error()); if ($qry)
header ("location:index.php?p=lihat_barang.php"); ?>
(24)
12.Daftar_order.php <div class="lihat"> <?php
include "koneksi.php";
$sql = mysql_query("select * from pesanan"); ?>
<script type="text/JavaScript"> <!--
function MM_popupMsg(msg) { //v1.0 alert(msg);
}
function MM_goToURL() { //v3.0
var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2)
eval(args[i]+".location='"+args[i+1]+"'"); }
//--> </script> <?php
//menentukan batas, cek dan posisi data $batas=10;
$halaman = $_REQUEST['halaman']; if(empty($halaman)){
$posisi=0; $halaman = 1; } else {
$posisi = ($halaman-1) * $batas; }
//sesuaikan perintah SQL dengan posisi dan batas
$sql= "SELECT * FROM pesanan ORDER BY id_pesanan DESC LIMIT $posisi,$batas";
$result = mysql_query($sql); $test=mysql_num_rows($result); if ($test!=0)
{ $no=$posisi+1;
echo"<table border='0' style='text-align:center' cellpadding='5px' bordercolordark='#000000'>"; echo"<tr bgcolor='#0099FF'>"; echo"<th>No</th>"; echo"<th>Tanggal Order</th>"; echo"<th>Nama</th>"; echo"<th>Alamat</th>"; echo"<th>Kota</th>"; echo"<th>Kode Pos</th>"; echo"<th>Nomor Telepon/Hp</th>"; echo"<th>Nama Barang</th>"; echo"<th>Jumlah</th>"; echo"<th>Action</th>"; echo"</tr>";
while ($data = mysql_fetch_array($result)) {
//pemberian warna berbeda pada tiap baris tampilan if (($no % 2)==0)
{ $warna="#C0C0C0"; } else { $warna="#DBDBDB";}
(25)
$id= $data['id_pesanan'];
echo "<tr bgcolor=$warna align='center' ><td>"; echo $no;
echo "</td><td width='150px'>"; echo $data['tanggal'];
echo "</td><td width='150px'>"; echo $data['nama'];
echo "</td><td width='170px'>"; echo $data['alamat'];
echo "</td><td width='60px'>"; echo $data['kota'];
echo "</td><td width='80px'>"; echo $data['kode_pos'];
echo "</td><td width=''>"; echo $data['nomor_telp'];
echo "</td><td width='170px'>"; echo $data['nama_barang']; echo "</td><td width=''>"; echo $data['jumlah'];
echo "</td><td width='110px'>";
echo "<a href='hapus_order.php?idc=$id' onClick=\"return confirm('Apakah Anda benar-benar akan menghapus data
ini?')\"><button>Hapus</button></a>"; echo "</td></tr>"; ?> <?php $no++; }
echo "</table><table width='500' align='left' id='tabel_show' cellpadding='1' cellspacing='1'><tr><td></td><td>";
$sql2 = mysql_query("select * from pesanan"); $result=mysql_num_rows($sql2);
$jmlhalaman=ceil($result/$batas); /* bangun Previous link */
if($halaman > 1){
$prev = ($halaman - 1); ?>
<a href="index.php?p=daftar_order.php&halaman=1"> << First </a> |
<a href="index.php?p=daftar_order.php&<? echo "halaman=$prev"; ?>"> <<Previous </a>
<?php } else {
echo "<p>First| < Previous "; } //tampilkan link halaman 1,2,3... for($i = 1; $i <= $jmlhalaman; $i++){
if($i == $halaman){ echo "$i "; } else { ?>
<a href="index.php?p=daftar_order.php&<? echo "halaman=$i"; ?>"><? echo $i; ?></a>
<?php } }
/* bangun Next link */ if($halaman < $jmlhalaman){
(26)
$next = $halaman + 1; ?>
<a href="index.php?p=daftar_order.php&<? echo "halaman=$next"; ?>">Next> |</a>
<a href="index.php?p=daftar_order.php&<? echo "halaman=$jmlhalaman"; ?>">Last >></a>
<?php }
echo "</td></tr></table>";
}//akhir dari kondisi bahwa data tidak kosong else { echo "<p>TIDAK ADA DATA DALAM DATABASE "; } ?>
</div>
13.Hapus_order.php
<?php include("koneksi.php"); $id1=$_REQUEST['idc'];
$qry= mysql_query ("delete from pesanan where
id_pesanan='$id1'",$koneksi) or die (mysql_error()); if ($qry)
header ("location:index.php?p=daftar_order.php"); ?>
14.Logout.php <?php
session_start();
unset($_SESSION['pengguna']); session_destroy();
print ("<meta http-equiv=\"refresh\" content=\"0; url=../index.php\">");
(27)
58
DAFTAR PUSTAKA
Kadir, A. 1999. Konsep dan Tuntunan Praktis Basis Data. Yogyakarta: Andi Yogyakarta.
Ramadhani, Graifhan. 2003. “Modul Pengenalan Internet”.
Elmasri, R. dan Navathe, S.B. 2004. “Fundamentals of Database Systems, Fourth
Edition”. Addison Wesley.
Kristanto, H. 1994. Konsep Dan Perancangan Database. Yogyakarta: Andi Offset. Martin, James. 1975. “Computer Data-Base Organization”.Prentice-Hall, Inc.
Englewood Cliffs, nj, Part II Physical Organization. Barakatullah, A. Halim. 2005. “Konsep Belajar E-commerce”.
http://www.scribd.com/doc/53139341/php .”Bab V Web Dinamis PHP”. Diakses pada tanggal 18 Maret 2013.
http://ikc.depsos.go.id/umum/anon-phpmysql.php. “Dasar Pemrograman PHP dan
MySQL”. Diakses pada tanggal 18 Maret 2013.
http://blogesupri.blogspot.com/2011/06/pengertian-komputer.html. “Artikel Komputer dan Info Teknologi” Diakses pada tanggal 18 Maret 2013.
http://www.baliorange.web.id/pengertian-ecommerce/. “Pengertian E-commerce”.
Diakses pada tanggal 18 Maret 2013.
http://blog.duniascript.com/sekilas-tentang-macromedia-dreamweaver.html “Tentang
(28)
59
http://safrilblog.wordpress.com/2012/10/15/simbol-simbol-pada-flowchart-dan-penjelasannya-softskill / . “Simbol-simbol flowchart beserta fungsinya”.
Diakses pada 8 Juni 2013.
http://akbar-sisteminformasi.blogspot.com/2013/03/normalisasi-data-base-1nf2nfdan-3nf.html .”Normalisasi Data Base”. Diakses pada 8 Juni 2013.
(29)
BAB 3
ANALISIS DAN PERANCANGAN SISTEM
3.1 Analisis Sistem
Toko pakaian Cantik Modis merupakan usaha yang bergerak dibidang penjualanan pakaian khusus wanita. Dalam melaksanakan aktivitasnya toko pakaian Cantik Modis masih menggunakan sistem informasi yang manual, sehingga masih sering terjadi kesalahan. Berdasarkan wawancara yang dilakukan, permintaan barang dari costumer makin meningkat sehingga mengakibatkan pendataan barang yang masuk dan keluar sering terjadi kesalahan khususnya seperti penggadaan barang. Dan dalam pembuatan laporan-laporan juga masih sering terjadi kesalahan-kesalahan. Maka dari itu toko pakaian Cantik Modis memerlukan sistem yang lebih terstruktur.
3.2 Analisa Permasalahan
Berbagai permasalah yang timbul dari sistem yang sedang berjalan adalah sebagai berikut:
(30)
28
1. Proses pengumpulan data yang dilakukan rentan terjadi kesalahan karena belum adanya sistem yang lebih terstruktur.
2. Kesulitan dalam melakukan pengecekan barang.
3. Belum tersedianya laporan yang lebih terstruktur karena sistem yang sedang berjalan sekarang menggunakan laporan yan manual.
3.3 Usulan dan Solusi
Dari permasalahan yang ada maka diusulkan solusi sebagai berikut:
1. Membuat fitur login admin agar semua proses pengumpulan data hanya dapat dilakukan admin agar lebih terstruktur.
2. Membuat pendataan barang seacara terstruktur.
3. Pembuatan laporan dengan format dan jenis sesuai kebutuhan.
3.4 Perancangan Sistem
Tahap perancangan sistem merupakan tahap awal dari membangun sebuah situs, seperti membuat perencanaan, perancangan, diagram alur, tujuan, dan isi dari sebuah situs. Setelah tahap perancangan, tahap selanjutnya yaitu membuat outline atau garis besar dari situs tersebut.
Salah satu cara yang dapat digunakan adalah dengan membuat aliran informasi atau flowchart (bagan alir) dari situs tersebut. Flowchart adalah suatu bagan yang
(31)
29
berisi seluruh tahapan/rangkaian kegiatan dalam suatu pekerjaan. Flowchart dapat dipergunakan untuk memperinci tahap-tahap rangkaian dan suatu proses pekerjaan.
Flowchart juga dapat dipergunakan untuk menjabarkan suatu proses pekerjaan ke dalam tahap-tahap rangkaian yang lebih spesifik untuk pemeriksaan selanjutnya.
3.4.1 Data Flow Diagram (DFD)
Data flow diagram merupakan suatu diagram yang menggunakan notasi-notasi untuk menggambarkan arus dari data sistem, dengan menggunakan pendekatan metoda analisis sistem terstruktur (Structured System Analysis Method).
Di dalam tahap analisa, penggunaan notasi simbol lingkaran dan anak panah untuk mewakili atau menggambarkan arus data dalam perancangan sistem sangat membantu sekali di dalam komunikasi dengan pemakai sistem untuk memahami sistem secara logika.
Keuntungan dari penggunaan DFD yaitu membantu para analis sistem meringkas informasi tentang sistem, mengetahui hubungan antar sub sistem, membantu perkembangan aplikasi secara efektif. DFD juga berfungsi sebagai alat komunikasi yang baik antara user dan analis sistem.
Berbagai komponen dari Data Flow Diagram (DFD) yaitu entitas luar, proses, penyimpanan data, dan arus data. DFD memiliki simbol-simbol yang digunakan untuk menggambarkan model data seperti terdapat pada table berikut :
(32)
30
Tabel 3.1 Simbol Data Flow Diagram
De Marco and Yourdan Symbol Keterangan Gane and Sarson Symbols
Source (Kesatuan Luar)
Proses Data Flow (Arus
Data) Data Store
(Penyimpanan Data)
3.4.1.1 Diagram Konteks
Diagram konteks adalah diagram yang terdiri dari suatu proses dan menggambarkan ruang lingkup suatu sistem. Diagram konteks merupakan level tertinggi dari DFD yang menggambarkan seluruh input ke sistem atau output dari sistem. DFD akan memberi gambaran tentang keseluruhan sistem. Sistem dibatasi oleh boundary (dapat digambarkan dengan garis putus). Dalam diagram konteks hanya ada satu proses. Tidak boleh ada store dalam diagram konteks (Ladjamudin, 2005).
Pada perancangan website e-commerce pada toko pakaian cantik modis ini diagram konteksnya dapat dilihat pada Gambar 3.1.
(33)
31
Gambar 3.1 Diagram Konteks
3.4.1.2 Diagram Nol/Zero (Overview Diagram)
Diagram nol adalah diagram yang menggambarkan proses dari data flow diagram. Diagram nol memberikan pandangan secara menyeluruh mengenai sistem yang ditangani, menunjukkan tentang fungsi-fungsi utama atau proses yang ada, aliran data, dan eksternal entity. Pada level ini sudah dimungkinkan adanya data store yang digunakan. Berikut ini adalah gambar DFD level nol yang merupakan penjabaran dari gambar diagram konteks.
COSTUMER 1
HALAMAN UTAMA
ADMIN
3 HALAMAN
ADMIN D1 BARANG
LAPORAN INPUT BARANG KIRIM
FEEDBACK
INFORMASI BARANG TERBARU
UPLOAD
2 PEMBELIAN
BARANG
PILIH
D2 PESANAN KIRIM
KIRIM PESANAN UPDATE
(34)
32
3.4.1.3 Diagram Rinci (Level Diagram)
Diagram rinci adalah diagram yang menguraikan proses apa yang ada dalam diagram nol atau diagram level diatasnya. Berikut ini adalah Gambar dari DFD level 1.
3.1 PILIHAN
ACTION
3.2 EDIT/ HAPUS
BARANG
KIRIM
D1 BARANG
PILIH
EDIT / HAPUS HASIL
UPDATE
Gambar 3.3 Diagram Level 1
3.4.2 Entity Relationship Diagram (ERD)
Entity Relationship Diagram (ERD) tersusun atas 3 (tiga) komponen yaitu entitas, atribut dan kerelasian antar entitas. Secara garis besar entitas merupakan objek yang terlibat di dalam sebuah sistem. Atribut berperan sebagai penjelas entitas dan kerelasian menunjukkan hubungan yang terjadi antara dua entitas.
Adapun ERD dari Website E-Commerce Pada Toko Pakaian Cantik Modis adalah sebagai berikut :
(35)
33
Gambar 3.4 ERD Pada Toko Pakaian Cantik Modis
3.4.3 Normalisasi Database
Normalisasi adalah suatu proses mendesain struktur Database sehingga sebagian besar ambiguity bisa dihilangkan sehingga bisa menghasilkan sebuah table yang normal. Adapun Tujuan Dari Normalisasi Adalah :
1. Untuk menghilangkan kerangkapan data/ redudansi. 2. Untuk mengurangi kompleksitas
3. Untuk mempermudah pemodifikasian data 4. Untuk menghilangkan anomali data
(36)
34
Adapun normalisasi yang dibuat pada sistem ini adalah sebagai berikut:
1. Bentuk Normal Pertama (1NF)
Gambar 3.5 Bentuk Normal Pertama (1NF)
2. Bentuk Normal Kedua (2NF)
Gambar 3.6 Bentuk Normal Kedua (2NF)
Dalam sistem ini, sebenarnya pada bentuk 2NF sudah memenuhi kriteria sebagai tabel relasional yang dapat diimplementasikan pada RDBMS, sehingga tidak harus dalam bentuk BNF.
(37)
35
3.4.4 Perancangan Struktur Database
Database dapat diartikan sebagai sebuah tempat menyimpan data yang terstruktur agar dapat diakses dengan cepat dan mudah. Membangun sebuah database merupakan langkah awal pembuatan aplikasi, termasuk dalam penambahan produk dan lain-lain dalam mengolah penjualan pada Toko Pakaian Cantik Modis.
Berikut ini adalah tabel-tabel yang terdapat pada database perancangan
website e-commerce pada Toko Pakaian Cantik Modis:
Tabel 3.2 Tabel User
NAMA FIELD
TIPE DATA
DESKRIPSI
Id_user Integer(2) Auto increment, primary key
username Varchar(50) Nama pengguna
password Varchar(50) Kata sandi
status Varchar(10) Status pengguna
Tabel 3.3 Tabel Barang
NAMA FIELD
TIPE DATA
DESKRIPSI
Id_barang Integer(4) Auto increment, primary key
Nama_barang Varchar(50) Nama barang
Kategori_barang Varchar(20) Kategori barang
Gambar Varchar(50) Gambar barang
Jumlah Integer(3) Jumlah barang
(38)
36
Tabel 3.4 Tabel Kategori
NAMA FIELD
TIPE DATA
DESKRIPSI
Nama_kategori Varchar(20) Nama kategori
Tabel 3.5 Tabel Pesanan
NAMA FIELD
TIPE DATA
DESKRIPSI
Id_pesanan Integer(3) Auto increment, primary key
Tanggal date Tanggal pemesanan
Nama Varchar(30) Nama pemesan
Alamat text Alamat pemesan
Kota Varchar(30) Kota pemesan
Kode_pos Integer(5) Kode pos pemesan
Nomor_telp Varchar(13) Nomor telepon/hp pemesan
Nama_barang Varchar(50) Nama barang yang di pesan
(39)
37
3.4.5 Flowchart Website
Berikut adalah flowchart pada perancangan website e-commerce toko pakaian Cantik Modis: START Home Cara Order Gallery About Us Contact Login Selesai? End Tampilan Home Tampilan Cara Order Tampilan Gallery Tampilan About Us Tampilan Contact Input Username & password Sukses? B N N N Y Y Y Y Y N Y N Y Y Y N N N Y A Y Y Y Y
(40)
38 A BLUS CELANA GAMIS JILBAB ROK STELAN SELESAI? HALAMAN UTAMA N N N N N N Y TAMPILAN BLUS TAMPILAN CELANA TAMPILAN GAMIS TAMPILAN JILBAB TAMPILAN ROK TAMPILAN STELAN BELI INPUT DATA DATABASE Y Y Y Y Y Y Y Y Y N N N
(41)
39
B
DATABASE HOME ADMIN TAMBAH BARANG LIHAT BARANG DAFTAR ORDER LOGOUT HALAMAN UTAMA N N N N Y TAMPILAN HOME ADMIN TAMPILAN DAFTAR ORDER DAFTAR BARANG FORM TAMBAH BARANG SIMPAN? EDIT/ HAPUS HAPUS? N Y Y Y Y Y Y Y Y Y Y N N NY
(42)
40
3.4.6 Perancangan Tampilan Halaman Website
a. Rancangan Tampilan Halaman Home
Gambar 3.10 Rancangan Tampilan Home
b. Rancangan Tampilan Menu Cara Order
(43)
41
c. Rancangan Tampilan Menu Gallery
Gambar 3.12 Rancangan Tampilan Menu Gallery
d. Rancangan Tampilan Menu About Us
(44)
42
e. Rancangan Tampilan Menu Contact
Gambar 3.14 Rancangan Tampilan Menu Contact
f. Rancangan Tampilan Menu Login Admin
(45)
43
g. Rancangan Tampilan Menu Kategori Barang
(46)
BAB 4
IMPLEMENTASI SISTEM
4.1 Pengertian Implementasi Sistem
Implementasi sistem adalah rangkaian prosedur yang dilakukan dalam menyelesaikan desain sistem yang telah disetujui, menguji, dan memulai sistem baru atau sistem yang telah diperbaiki.
Adapun langkah-langkah yang dibutuhkan dalam implementasi sistem adalah: a. Mendapatkan software dan hardware yang tepat serta sesuai untuk
merancang suatu sistem informasi. b. Menyelesaikan rancangan sistem.
c. Menulis, menguji, mengontrol, dan mendokumentasikan website. d. Mendapatkan persetujuan.
(47)
45
4.2 Tujuan Implementasi Sistem
Adapun tujuan dari implementasi sistem adalah:
1. Menyelesaikan desain sistem yang ada di dalam dokumen desain sistem yang telah disetujui sebelumnya.
2. Memastikan bahwa pengunjung dapat mengoperasikan sistem baru dengan mudah.
3. Memperhitungkan bahwa sistem telah memenuhi permintaan pemakai yaitu dengan menguji sistem secara menyeluruh.
4. Memastikan bahwa sistem telah berjalan baik dan benar.
4.3 Komponen Utama Dalam Implementasi Sistem
Untuk mewujudkan sistem yang telah dirancang memerlukan sarana pendukung, yaitu berupa komponen-komponen yang sangat berperan dalam mendukung penerapan sistem yang dirancang terhadap pengolahan data. Di antaranya yaitu: hardware
(perangkat keras), software (perangkat lunak), dan brainware (sumber daya manusia)
4.3.1 Perangkat keras (Hardware)
Perangkat keras atau hardware merupakan salah satu elemen dari sistem komputer, yaitu suatu alat yang dapat mendukung proses komputerisasi.
(48)
46
4.3.2 Perangkat lunak (Software)
Software merupakan kumpulan dari beberapa perintah yang diekseskusi oleh mesin komputer dalam menjalankan pekerjaannya. Perangkat lunak ini merupakan catatan bagi mesin komputer untuk menyimpan perintah, maupun dokumen serta arsip lainnya.
Ada beberapa software yang perlu diinstal dalam membuat website, antara lain: 1. Sistem Operasi Windows 7
2. Photoshop CS5 sebagai media perancanaan desain.
3. MySQL sebagai bahasa pemrograman untuk database dalam bahasa SQL. 4. Macromedia Dreamweaver 8 sebagai salah satu editor script dalam
mendesain web.
5. PHP sebagai bahasa pemrograman server side.
6. Web Server sebagai server lokal dalam pengetesan halaman web.
7. Browser sebagai tempat media tampilan halaman website, seperti : Mozilla Firefox
4.3.3 Sumber daya manusia (Brainware)
Sistem komputerisasi yang berfungsi sebagai alat bantu manusia di bidang pengolahan data membutuhkan manusia sebagai aspek yang menangani proyek pada komputer. Inilah yang disebut dengan aspek brainware. Brainware terdiri atas:
1. Sistem analis, yaitu orang yang membentuk dan membangun fasilitas rancangan sistem.
(49)
47
2. Programmer, yaitu orang yang bertugas untuk membuat dan membangun program dengan menggunakan salah satu fasilitas software yang telah ditentukan.
3. Operator, yaitu orang yang menangani langsung dalam pengolahan data, mulai dari mempersiapkan data sampai pemasukan data dalam komputer.
4.4 Tampilan Website
4.4.1 Tampilan Halaman Awal
Gambar 4.1 Tampilan Halaman Awal
Pada halaman awal ini terdiri dari header, menu atas, content, menu bawah, dan footer. Di bagia menu atas terdapat pilihan menu seperti: Home, Cara Order, dan
(50)
foto-48
foto produk dari Canti Modis yang ditawarkan. Sedangkan di bagian menu bawah terdapat pilihan menu seperti: About Us, Contact, dan Login.
4.4.2 Tampilan Menu Cara Order
Gambar 4.2 Tampilan Menu Cara Order
Pada tampilan menu cara order ini dijelaskan bagaimana tata cara untuk pemesana barang di toko pakaian Canti Modis ini agar tidak terjadi kesalahan dalam pemesanan barang nantinya.
(51)
49
4.4.3 Tampilan Menu About Us
Gambar 4.3 Tampilan Menu About Us
Di tampilan menu abous us ini berisi tentang Cantik Modis, dan terdapat foto beserta artikel-artikel tentang produk yang ditawarkan oleh toko pakaian Cantik Modis, dan juga terdapat logo dari jasa pembayaran dan pengiriman yang bekerja sama dengan toko pakaian Cantik Modis.
(52)
50
4.4.4 Tampilan Menu Contact
Gambar 4.4 Tampilan Menu Contact
Pada tampilan di menu contact ini sama seperti pada menu about us kecuali pada menu contact ini berisi tentang info kontak atau informasi tentang toko pakaian Cantik Modis.
4.4.5 Tampilan Menu Gallery
(53)
51
Pada menu gallery ini terdapat pilihan menu lagi di dalamnya. Menu yang ditawarkan adalah nama-nama produk yang ditawarkan oleh toko pakaian Cantik Modis seperti Blus, Celana, Gamis, Jilbab, Rok, dan Stelan.
4.4.6 Tampilan Produk (Blus, Celana, Gamis, Jilbab, Rok, Stelan)
Gambar 4.6 Tampilan Produk
Di tampilan produk ini berisi foto-foto, nama barang, harga, dan tombol “Beli” dari produk yang dipilih dari menu gallery sebelumnya. Di tampilan produk ini juga terdapat pilihan halaman. Jika tombol “Beli” di tekan maka akan muncul form order
untuk pemesanan. Di halaman pertama ini maximal terdapat 10 item, jika terdapat 11 maka 1 item menjadi ke halaman 2, begitu seterusnya.
(54)
52
4.4.7 Tampilan Form Order
Gambar 4.7 Tampilan Form Order
Di tampilan form order ini terdapat form-form yang harus di isi secara lengkap kecuali nama barang yang telah terisi secara otomatis. Setelah form terisi secara lengkap pilih tombol “Order” jika ingin memesan barang, dan jika tidak ingin memesan pilih tombol “Cancel” .
4.4.8 Tampilan Login Admin
(55)
53
Di tampilan login admin ini terdapat form yang berisi username dan password untuk masuk sebagai admin.
4.4.9 Tampilan Tambah Barang
Gambar 4.9 Tampilan Tambah Barang
Pada tampilan ini terdapat menu baru seperti: menu Home admin, Tambah Barang, Lihat Barang, Daftar Order, serta Logout. Di tampilan tambah barang ini terdapat form tambah barang untuk memasukkan barang/produk baru ke database.
(56)
54
4.4.10 Tampilan Lihat Barang
Gambar 4.10 Tampilan Lihat Barang
Pada menu lihat barang ini berisi barang yang telah di masukkan sebelumnya. Dan pada item barang tesebut terdapat foto, harga, sisa barang, harga serta tombol edit
untuk mengedit barang dan tombol hapus untuk menghapus barang tersebut.
4.4.11 Tampilan Daftar Order
(57)
55
Di tampilan menu daftar order ini menampilkan biodata lengkap dan barang yang di pesan sebelumnya yang telah di isi di form order dari pemesan.
(58)
BAB 5
KESIMPULAN DAN SARAN
5.1 Kesimpulan
Adapun kesimpulan yang dapat diambil oleh penulis dalam pembuatan website e-commerce ini adalah:
1. Dengan adanya Sistem Informasi Penjualan berbasis web ini, penjual dapat memperluas pemasaran produk secara cepat yang dapat meningkatkan jumlah keuntungan bagi usahanya tersebut.
2. Sistem Informasi penjualan ini menyediakan layanan pemesanan produk melalui sistem online, hanya dengan mengisi form pemesanan, dan melakukan pembayaran ke nomor rekening yang telah diberitahu, maka produk akan langsung dikirim ke alamat konsumen. Hal ini tentu akan mempermudah pelanggan yang berada jauh dari tempat penjualan, ataupun yang tidak bisa melakukan transaksi secara langsung kepada penjual.
(59)
57
5.2 Saran
Dengan selesainya websitee-commerce Pada Toko Pakaian Cantik Modis ini, penulis memberikan beberapa saran yang dapat mendukung pengembangan sistem lebih lanjut:
1. Dapat melakukan perbaikan dan penyempurnaan terhadap sistem ini agar menjadi lebih sempurna bila akan diterapkan pada sistem yang lama, sehingga saling terintegrasi.
2. Sistem yang telah dibuat ini masih memerlukan perbaikan karena masih memiliki kelemahan-kelemahan dalam memenuhi kebutuhan yang sebenarnya pada Toko Pakaian Cantik Modis.
(60)
BAB 2
LANDASAN TEORI
2.1 Pengertian Komputer
Dalam merancang suatu aplikasi ataupun sistem diperlukan sebuah alat bantu, seperti komputer. Komputer adalah sekumpulan alat elektronik yang saling bekerja sama, dapat menerima data (input), mengolah data (proses) dan menghasilkan informasi (output) serta terkoordinasi di bawah kontrol program yang tersimpan di dalam memorinya. (http://blogesupri.blogspot.com/2011/06/pengertian-komputer.html)
Kata komputer berasal dari bahasa Latin yaitu Computare yang artinya menghitung. Dalam bahasa Inggris disebut to compute. Menurut buku “Computer Today” (Donald H.Sanders), komputer adalah sistem elektronik untuk memanipulasi data yang cepat dan tepat serta dirancang dan diorganisasikan supaya secara otomatis menerima dan menyimpan data input, memprosesnya dan menghasilkan output di bawah pengawasan suatu langkah-langkah instruksi-instruksi program yang tersimpan di memori (stored program).
(61)
8
2.2 Pengenalan Internet
Internet (Interconnection-Network) adalah sebutan untuk sekumpulan jaringan komputer yang menghubungkan situs akademik, pemerintahan, komersil, organisasi, maupun perorangan. Internet menyediakan akses untuk layanan telekomunikasi dan sumber daya informas untuk jutaan bahkan milyaran pemakainya yang tersebar di seluruh dunia. Layanan internet meliputi komunikasi langsung (email-chat), diskusi (Usenet News, e-mail, milis), sumber daya informasi yang terdistribusi (World Wide Web, Gopher), remote login dan lalu lintas file (Telnet, FTP), dan aneka layanan yang lainnya. (Ramadhani, 2003).
Internet dapat juga diartikan sebagai suatu jaringan komputer luas yang berada di seluruh dunia dan berfungsi untuk menghubungkan jaringan komputer lain, di mana pengguna akhir layanan internet memungkinkan untuk melakukan pertukaran data dan informasi melalui arsip situs World Wide Web.
World Wide Web adalah sekelompok dokumen multimedia yang saling terkoneksi menggunakan hypertext link. Dan dengan mengklik pada suatu link, anda dapat berpindah dari suatu dokumen ke dokumen lainnya. Ada dua hal penting yang harus diketahui bila belajar dengan WWW yaitu software web browser dan software web server. Di mana software web browser ini bertindak sebagai client yang memungkinkan anda untuk melihat dan mendapatkan informasi dari server web, sedangkan software web server bertindak sebagai server yang memberikan/menyediakan informasi yang diminta oleh browser.
(62)
9
2.3 Pengertian E-commerce
E-commerce atau bisa disebut Perdagangan elektronik atau e-dagang adalah penyebaran, pembelian, penjualan, pemasaran barang dan jasa melalui sistem elektronik seperti internet atau televisi, www, atau jaringan komputer lainnya.
Ecommerce dapat melibatkan transfer dana elektronik, pertukaran data elektronik, sistem manajemen inventori otomatis, dan sistem pengumpulan data otomatis.
Industri teknologi informasi melihat kegiatan e-dagang ini sebagai aplikasi dan penerapan dari e-bisnis (e-business) yang berkaitan dengan transaksi komersial, seperti: transfer dana secara elektronik, SCM (supply chain management), e -pemasaran (e-marketing), atau pemasaran online (online marketing), pemrosesan transaksi online (online transaction processing), pertukaran data elektronik (electronic data interchange/EDI), dll.
E-dagang atau e-commerce merupakan bagian dari e-business, di mana cakupan e-business lebih luas, tidak hanya sekedar perniagaan tetapi mencakup juga penggabungan mitra bisnis, pelayanan nasabah, lowongan pekerjaan, dan yang lainnya. Selain teknologi jaringan www, e-dagang juga memerlukan teknologi basis data atau pangkalan data (database), e-surat atau surat elektronik (e-mail), dan bentuk teknologi non-komputer yang lain seperti halnya sistem pengiriman barang, dan alat pembayaran untuk e-dagang ini.
E-commerce pertama kali diperkenalkan pada tahun 1994 pada saat pertama kali banner-elektronik dipakai untuk tujuan promosi dan periklanan di suatu halaman
(63)
10
penjualan seharga AS$12,2 milyar pada 2003. Menurut laporan yang lain pada bulan oktober 2006 yang lalu, pendapatan ritel online yang bersifat non-travel di Amerika Serikat diramalkan akan mencapai seperempat trilyun dolar US pada tahun 2011. (http://www.baliorange.web.id/pengertian-ecommerce)
Keuntungan e-commerce bagi bisnis perusahaan-perusahaan dapat menjangkau pelanggan di seluruh dunia. Oleh karena itu dengan memperluas bisnis mereka, sama saja dengan meningkatkan keuntungan. E-commerce menawarkan pengurangan sejumlah biaya tambahan.
Sebuah perusahaan yang melakukan bisnis di internet akan mengurangi biaya tambahan karena biaya tersebut tidak digunakan untuk gedung dan pelayanan pelanggan (customer service), jika dibandingkan dengan jenis bisnis tradisional.
Secara ringkas keuntungan e-commerce tersebut adalah sebagai berikut: 1. Bagi Konsumen : harga jauh lebih murah, belanja cukup pada satu tempat. 2. Bagi Pengelola Bisnis : efisiensi, tanpa kesalahan, tepat waktu.
3. Bagi Manajemen : peningkatan pendapatan, loyalitas pelanggan.
Adapun beberapa aspek penting dalam membuka toko online adalah:
1. Menyiapkan fasilitas toko online memang tidak semudah membuat homepage. Tahap awal, tentu menyiapkan presence-nya, yakni membuat homepage-nya, terutama sebagai storefront. Pekeran yang terkait dengan hal ini adalah
(64)
11
menyiapkan content, desain web hosting-nya. Selain tampilan visual dan
content-nya harus bagus, struktur homepage yang dibuat pun harus jelas.
2. Langkah berikutnya, menyiapkan interaktivitas toko online tersebut. Paling sederhana, bisa menggunakan fasilitas e-mail di website-nya. Agar interaktivitas antara merchant dan pengakses berjalan lancar, maka para penjual online ini menyiapkan homepage-nya dengan formulir-formulir standar dan terstruktur, yang bisa dijawab dengan software tertentu. Sejauh ini
homepage-homepage di Indonesia belum menyediakan interaktivitas untuk kebutuhan verifikasi dan pembayaran.
3. Menurut Julizvar, konsulan dari Hewlett Packard (HP) Indonesia, untuk terciptnya sistem pembayaran via internet memang dibutuhkan kesepakatan berbagai pihak, terutama dari pihak lembaga keuangan, merchant dan konsumen. Pihak-pihak lainnya yang biasanya terlibat untuk mendukung sistem pembayaran internet adalah penyedia sertifikat digital, baik untuk Visa
(misalnya VeriSign) maupun MasterCard (misalnya GTE); dan perusahaan pemroses tansaksi kartu kredit.
4. Adapun soal pengiriman barang, merchant biasanya bekerjasama dengan perusahaan jasa kurir seperti UPS, FedEx, JNE, Tiki, dan PT. Pos. Bahkan untuk kebutuhan ekspor sekalipun. Hanya saja, kalau memiliki layanan yang diberikan mall online di Indonesia, sejauh ini pengelola tidak ikut campur dalam pengiriman barang pesanannya.
(65)
12
2.3.1 Jenis-jenis e-commerce
1. Business to Business
Di dalam Business to Business pada umumnya transaksi dilakukan oleh para trading partners yang sudah saling kenal dengan format data yang telah disepakati bersama.
Karakteristik dari Business to Business yaitu:
a. Trading partners yang sudah diketahui dan umumnya memiliki hubungan (relationship) yang cukup lama. Informasi hanya dipertukarkan dengan partner tersebut. Dikarenakan sudah mengenal lawan komunikasi, maka
jenis informasi yang dikirimkan dapat disusun sesuai dengan kebutuhan dan kepercayaan (trust).
b. Pertukaran data (data exchange) berlangsung berulang-ulang dan secara berkala, misalnya setiap hari, dengan format data yang sudah disepakati bersama. Dengan 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 partner-nya.
d. Model yang umum digunakan adalah peer-to-peer, di mana processing intelligence dapat didistribusikan di kedua pelaku bisnis.
(66)
13
2. Business to Consumer Karakteristiknya adalah:
a. Bersifat terbuka untuk umum, di mana informasi disebarkan ke umum. Dapat diakses oleh seluruh pengguna internet.
b. Servis yang diberikan bersifat umum (generic) dengan mekanisme yang dapat digunakan oleh khalayak ramai.
c. Servis diberikan berdasarkan permohonan (ondemand). Konsumer melakukan inisiatif dan produser harus siap memberikan respon sesuai dengan permintaan.
d. Pendekatan client/server sering digunakan di mana diambil asumsi client (consumer) menggunakan sistem yang minimal (berbasis Web) dan processing (businessprocedure) diletakkan di sisi server.
3. Consumer to Consumer
Karakteristik dari Consumer to Consumer yaitu:
a. E-commerce antara individu dan individu dilakukan secara langsung b. Semakin banyak individu yang terhubung pada internet, maka pasar Consumer to Consumer akan semakin potensial.
(1)
8. Kepada senior-senior D3 Teknik Informatika USU, yang telah memberikan nasihat dan pengarahan selama penyusunan dan penulisan tugas akhir ini.
Laporan ini sudah selesai, namun penulis menyadari bahwa masih ada kekurangan didalamnya karena keterbatasan pengetahuan dan kemampuan penulis. Untuk itu, diharapkan kritik dan saran yang bersifat membangun demi perbaikan dan penyempurnaan laporan ini. Semoga laporan ini bermanfaat bagi semua yang membaca sebagai wacana dalam memperluas cakrawala pengetahuan.
Kiranya Allah SWT memberikan hidayah-Nya kepada kita semua sehinga sukses dalam menggapai cita-cita yang diinginkan. Amin.
Medan, Juni 2013
Penulis,
Dimas Andika Nasution NIM: 102406146
(2)
vi
ABSTRAK
Kajian ini bertujuan untuk membangun suatu website e-commerce mengenai penjualan pakain wanita secara online. Sistem informasi ini dikembangkan menggunakan Macromedia Dreamweaver 8 sebagai editor, dan perangkat lunak XAMPP 2.5. Tujuan dari websitee-commerce ini adalah untuk membantu penjual dalam melakukan proses pemasaran produk mereka serta membantu pembeli dalam melakukan proses pembelian dan pemesanan secara online.
(3)
DAFTAR ISI
Halaman
Persetujuan ii
Pernyataan iii
Penghargaan iv
Abstrak vi
Daftar Isi vii
Daftar Tabel ix
Daftar Gambar x
Bab 1 Pendahuluan 1
1.1 Latar Belakang 1
1.2 Perumusan Masalah 3
1.3 Batasan Masalah 3
1.4 Tujuan dan Manfaat Penelitian 4
1.5 Metode Penelitian 4
1.6 Sistematika Penulisan 5
Bab 2 Landasan Teori 7
2.1 Pengertian Komputer 7
2.2 Pengenalan Internet 8
2.3 Pengertian E-commerce 9
2.3.1 Jenis-jenis e-commerce 12
2.3.2 Tujuan menggunakan e-commerce dalam berbisnis 14 2.3.3 Manfaat menggunakan e-commerce dalam dunia bisnis 14
2.4 Pengenalan Website 15
2.5 Pengertian HTML, PHP, dan MySQL 16
2.5.1 Pengenalan HTML 16
2.5.2 Pengenalan PHP 17
2.5.3 Pengenalan MySQL 18
2.6 CSS (Cascading Style Sheets) 19
2.7 Pengertian Data, Informasi, dan Database 20 2.7.1 Database management system (DBMS) 21
2.8 Macromedia Dreamweaver 8 23
2.9 Flowchart 24
Bab 3 Analisis Dan Perancangan Sistem 27
3.1 Analisis Sistem 27
3.2 Analisa Permasalahan 27
3.3 Usulan dan Solusi 28
3.4 Perancangan Sistem 28
3.4.1 Data Flow Diagram (DFD) 29
(4)
viii
3.4.1.1 Diagram Konteks 30
3.4.1.2 Diagram Nol/Zero (Overview Diagram) 31
3.4.1.3 Diagram Rinci (Level Diagram) 32
3.4.2 Entity Relationship Diagram (ERD) 32
3.4.3 Normalisasi Database 33
3.4.4 Perancangan Struktur Database 35
3.4.5 Flowchart Website 37
3.4.6 Perancangan Tampilan Website 40
Bab 4 Implementasi Sistem 44
4.1 Pengertian Implementasi Sistem 44
4.2 Tujuan Implementasi Sistem 45
4.3 Komponen Utama dalam Implementasi Sistem 45
4.3.1 Perangkat keras (Hardware) 45
4.3.2 Perangkat lunak (Software) 46
4.3.3 Sumber daya manusia (Brainware) 46
4.4 Tampilan Website 47
Bab 5 Kesimpulan dan Saran 56
5.1 Kesimpulan 56
5.2 Saran 57
Daftar Pustaka 58
(5)
DAFTARTABEL
Halaman
Tabel 2.1 Tabel Simbol Pada Flowchart 24
Tabel 3.1 Simbol Data Flow Diagram 30
Tabel 3.2 Tabel User 35
Tabel 3.3 Tabel Barang 35
Tabel 3.4 Tabel Kategori 36
Tabel 3.5 Tabel Pesanan 36
(6)
x
DAFTARGAMBAR
Halaman
Gambar 3.1 Diagram Konteks 31
Gambar 3.2 Diagram Level 0 31
Gambar 3.3 Diagram Level 1 32
Gambar 3.4 ERD Pada Toko Pakaian Cantik Modis 33
Gambar 3.5 Bentuk Normal Pertama (1NF) 34
Gambar 3.6 Bentuk Normal Kedua (2NF) 34
Gambar 3.7 Flowchart Halaman Utama 37
Gambar 3.8 Flowchart Kategori Barang 38
Gambar 3.9 Flowchart Halaman Admin 39
Gambar 3.10 Rancangan Tampilan Home 40
Gambar 3.11 Rancangan Tampilan Menu Cara Order 40
Gambar 3.12 Rancangan Tampilan Menu Gallery 41
Gambar 3.13 Rancangan Tampilan Menu About Us 41
Gambar 3.14 Rancangan Tampilan Menu Contact 42
Gambar 3.15 Rancangan Tampilan Menu Login Admin 42 Gambar 3.16 Rancangan Tampilan Menu Kategori Barang 43
Gambar 4.1 Tampilan Halaman Awal 47
Gambar 4.2 Tampilan Menu Cara Order 48
Gambar 4.3 Tampilan Menu About Us 49
Gambar 4.4 Tampilan Menu Contact 50
Gambar 4.5 Tampilan Menu Gallery 50
Gambar 4.6 Tampilan Produk 51
Gambar 4.7 Tampilan Form Order 52
Gambar 4.8 Tampilan Login Admin 52
Gambar 4.9 Tampilan Tambah Barang 53
Gambar 4.10 Tampilan Lihat Barang 54