8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 1/13

BAB I

PENDAHULUAN

1.1 Latar BelakangPerkembangan teknologi informasi dan komunikasi saat ini

begitu pesat. Perkembangan teknologi informasi dan komunikasi ini

didukung dengan adanya gadget   yang bersifat canggih serta

 jaringan internet yang sudah mendunia tanpa adanya gangguan

yang berarti. Dengan adanya fenomena ini, manusia menuntut

segala kegiatan untuk bersifat instan dan cepat, tak terkecuali dalam

hal pemesanan makanan.Fenomena yang telah kita temui saat ini, banyak waktu orang

yang terbuang sia-sia hanya untuk memesan makanan. Sistem

pemesanan makanan di sebuah rumah makan atau restoran saat ini

merepotkan pelanggan. Dimana pelanggan dituntut untuk

menunggu atau bahkan mengantri selama beberapa jam, atau

bahkan pelanggan tersebut tidak mendapatkan meja atau tempat

duduk untuk menunggu pesanaanya kecuali pelanggan tersebut

telah reservasi terlebih dahulu. Sedangkan dari sisi pelayan rumah

makan atau restoran saat ini dilakukan dengan alat tulis dan kertas

dengan pemesanan tersebut dapat menimbulkan kendala yaitu

seperti tidak terbaca tulisan tangan pelayan, terselipnya kertas

catatan pesanan dan sebagainya. al tersebut dapat mempengaruhi

pemrosesan pesanan!leh karena itu, dibuatlah suatu sistem berbasis web yang

memudahkan konsumen dan pelayan dalam mengolah pemesanan.Salah satu teknologi yang sedang berkembang saat ini adalah

komunikasi tanpa kabel, seperti menggunakan media internet yang

bersifat client server.. Dalam web ini berisikan tentang prosedur

pemesanan yang memudahkan berbagai pihak. "eb ini

memfasilitasi pengunjung agar tidak perlu mengantri didepan kasir

sampai makanannya tersedia. #ukup dengan duduk ditempat yang

telah disediakan dan kemudian pelanggan memesan melalui sistem

“Sistem Antrian Restoran Berbasis Web” . Sistem ini juga

$

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 2/13

menyediakan layanan Delivery Order   sehingga dapat diakses

dimana saja

1.2 Rumusan Masalah1. Siapa sajakah yang termasuk dalam ruang lingkup Sistem %ntrian

&estoran 'erbasis "eb (

2. 'agaimana merancang web Sistem %ntrian &estoran (

3. 'agaimana alur penggunaan web Sistem %ntrian &estoran (

4. %pa saja sumber daya yang dibutuhkan dalam membangun

Sistem %ntrian &estoran 'erbasis "eb (

1.3 Batasan Masalah

$. Sistem pembayaran yang dilakukan secara o)ine. Dimanapelanggan dapat langsung membayar ke kasir, atau meminta

bantuan pelayan untuk membayarkan tagihan makanannya ke

kasir. *ntuk pelanggan yang melakukan pemesanan Delivery 

Order   maka dapat melakukan pembayaran langsung kepada

kurir yang mengantar.+. Sistem ini belum dapat menghitung secara otomatis total

pembayaran yang telah dipesan pelanggan.

1.4 Tuuan1. engetahui ruang lingkup dari Sistem %ntrian !nline 'erbasis

"eb

2. engetahui cara merancang Sistem %ntrian !nline 'erbasis "eb

3. engetahui alur penggunaan Sistem %ntrian !nline 'erbasis "eb

4. engetahui sumber daya yang dibutuhkan dalam membangun

Sistem %ntrian &estoran 'erbasis "eb

1.! Man"aat

Dengan adanya Sistem %ntrian !nline 'erbasis "eb ini dari segiprodusen dapat meningkatkan jumlah pelanggan, hal ini secara tidak

langsung dapat meningkatkan jumlah pendapatan. Dari sisi pelayan

atau pegawai, dapat mempercepat proses pelayanan serta dapat

mengurangi resiko salah pesanan. Sedangkan dari segi pelanggan

atau konsumen, dapat mempercepat proses pemesanan, serta

mempermudah pelanggan dalam memilih makan dan minuman

karena web ini disertai dengan gambar serta harga dari menu-menu

yang telah tersedia.

BAB II

+

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 3/13

#A$IAN PU%TA#A

Dalam pembuatan dan pengimlementasian Sistem %ntrian !nline

'erbasis "eb ini perlu adanya beberapa bahan-bahan serta software dan

bahasa pemrograman, diantaranya adalah

2. 1 Internetnternet kependekan dari Interconnection-networking  adalah

seluruh jaringan komputer yang saling terhubung menggunaka

standart sistem global. ransmission !ontrol  "rotocol#Internet 

"rotocol S$ite  /0#P1P2 sebagai protokol pertukaran paket untuk

melayani miliaran pengguna di seluruh dunia. #ara menghubungkan

rangkaian dengan kaidah ini dinamakan Internetworking

/antarjaringan2.Disamping menggunakan P# /Personal #omputer2, kita juga

dapat mengakses nternet melalui andphone /P2 menggunakan

fasilitas yang disebut 3P&S /3eneral Packet &adio Service2. 3P&S

merupakan salah satu standar komunikasi wireless /nirkabel2 yang

memiliki kecepatan koneksi $$4 kbps dan mendukung aplikasi yang

lebih luas /gra5s dan multimedia2. 0eknologi 3P&S dapat diakses

yang mendukung fasilitas tersebut. Pengaturan 3P&S pada ponsel

tergantung dari operator yang digunakan. 'iaya akses nternet

dihitung melalui besarnya kapasitas /per-kilobyte2 yang diunduh.nternet juga semakin banyak digunakan di tempat umum.

'eberapa tempat umum yang menyediakan layanan nternet

termasuk perpustakaan, dan nternet cafe1warnet /juga disebut#yber #afe2. 0erdapat juga tempat awam yang menyediakan pusat

akses nternet, seperti nternet 6iosk, Public access 0erminal, dan

 0elepon web. 0erdapat juga toko-toko yang menyediakan akses wi-5,

seperti "i5-cafe. Pengguna hanya perlu

membawa laptop /notebook2, atau PD%, yang mempunyai

kemampuan wi5 untuk mendapatkan akses nternet.

2. 2 &e's(te"ebsite /Situs "eb2 adalah suatu halaman web yang saling

berhubungan yang umumnya berada pada peladen yang sama

7

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 4/13

berisikan kumpulan informasi yang disediakan secara perorangan,

kelompok, atauorganisasi.8$9 Sebuah situs web biasanya ditempatkan

setidaknya pada sebuah server web yang dapat diakses melalui

 jaringan seperti nternet,   ataupun jaringan wilayah lokal /:%;2

melalui alamat nternet yang dikenali sebagai*&:. 3abungan atas

semua situs yang dapat diakses publik di nternet disebut pula

sebagai "orld "ide "eb atau lebih dikenal dengan singkatan """.

eskipun setidaknya halaman beranda situs nternet umumnya

dapat diakses publik secara bebas, pada praktiknya tidak semua

situs memberikan kebebasan bagi publik untuk mengaksesnya,

beberapa situs web mewajibkan pengunjung untuk melakukan

pendaftaran sebagai anggota, atau bahkan meminta pembayaran

untuk dapat menjadi aggota untuk dapat mengakses isi yang

terdapat dalam situs web tersebut, misalnya situs-situs yang

menampilkan pornogra5, situs-situs berita, layanan surel /e-mail2,

dan lain-lain. Pembatasan-pembatasan ini umumnya dilakukan

karena alasan keamanan, menghormati privasi, atau karena tujuan

komersial tertentu.

2. 3 Anal(sa %(stem%nalisis Sistem adalah penguraian suatu sistem informasi

yang sudah utuh kedalam bagian-bagian komponennya dengan

tujuan dapat menidenti5kasi dan menevaluasi berbagai macam

permasalahan maupun hambatan yang terjadi pada sistem sehingga

nantinya dapat dilakukan perbaikan atau pengembangan.a. Diagram 6onteks

Diagram 6onteks merupakan suatu alur yang tingkat tinggi

dimana menggambarkan seluruh jaringan, masukan dan

keluaran. Diagram 6onteks merupakan gambaran umum

sistem yang nantinya aka dibuat. Secara uraian dapat

dikatakan bahwa diagram konteks itu berisi siapa saja yang

memberikan data /In%$t data& ke sistem serta siapa saja data

informasi diberikan /melalui sistem2. 'erikut adalah gambar

Diagram konteks dari Sistem %ntrian !nline 'erbasis "eb.b. DFD

Data 'low Diagram  atau yang disingkat DFD merupakan

suatu diagram yang menggambarkan alur data dalam suatu

entitas ke sistem atau sistem ke entitas. DFD juga dapat

<

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 5/13

diartikan sebagai teknik gra5s yang menggambarkan alur

data dan transformasi yang digunakan sebagai perjalanan

data dari input atau masukan menuju keluaran atau outputan.

'erikut adalah gambar DFD dari Sistem %ntrian !nline

'erbasis "eb.

2. 4 Data BaseData'ase adalah adalah kumpulan informasi yang

disimpan di dalam komputer secara sistematik sehingga dapat

diperiksa menggunakan suatu program komputer untuk

memperoleh informasi dari database tersebut. Dalam database

dikenal juga Database (anagement System /D'S2 yaitu suatu

program komputer yang digunakan untuk memasukkan,

mengubah, menghapus, memanipulasi, serta memperoleh data

atau informasi dengan praktis dan e5sien.

2. ! Sofware )an Bahasa Pemr*gramanSoftware  dan 'ahasa Pemrograman yang digunakan dalam

membangun Sistem %ntrian !nline 'erbasis "eb ini meliputi a. HTML

)y%erte*t (ark$% +ang$ange /0:2 adalah bahasa standart

yang digunakan untuk menampilkan halaman web. =ang bisa

dilakukan dengan 0: yaitu mengatur tampilan dari

halaman web dan isinya, membuat tabel dengan halaman

web, mempublikasikan halaman web secara online, membuat

form yang bisa digunakan untuk menangani registrasi dan

transaksi via web, menambahkan objek-objek seperti citra,

audio, video, animasi, java applet, dalam halaman web,

menampilkan area gambar /canvas2 di browser'. +%%

!ascanding Style S,eet /#SS2 +as,a)(ng %t-le %heet /+%%2

merupakan aturan untuk mengatur beberapa komponen

dalam sebuah web sehingga akan lebih terstruktur dan

seragam. #SS bukan merupakan bahasa pemograman. Sama

halnya styles dalam aplikasi pengolahan kata

seperti icrosoft "ord yang dapat mengatur beberapa style,

misalnya ,eading,s$bbab, bodyte*t , footer , images,

dan style lainnya untuk dapat digunakan bersama-samadalam beberapa berkas /le2. Pada umumnya #SS dipakai

4

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 6/13

untuk memformat tampilan halaman web yang dibuat

dengan bahasa 0: dan >0:.  #SS dapat

mengendalikan ukuran gambar, warna bagian tubuh pada

teks, warna tabel, ukuran border, warna border,

warnahyperlink, warna mo$se over , spasi antar paragraf,

spasi antar teks, margin kiri, kanan, atas, bawah, dan

parameter lainnya. #SS adalah bahasa style sheet yang

digunakan untuk mengatur tampilan dokumen.8 Dengan

adanya #SS memungkinkan kita untuk menampilkan halaman

yang sama dengan format yang berbeda,. $aa%,r(/t

 ?avaScript adalah bahasa pemrograman tingkat tinggi dandinamis. ?avaScript populer di internet dan dapat bekerja di

sebagian besar penjelajah web populer seperti nternet

@Aplorer, oBila FirefoA, ;etscape, dan !pera. 6ode ?avaScript

dapat disisipkan dalam halaman web menggunakan tag

S#&P0. aa%,r(/t pada awal perkembangannya berfungsi

untuk membuat interaksi antara user dengan situs web

menjadi lebih cepat tanpa harus menunggu pemrosesan

di web server . Sebelum  .avascri%t , setiap interaksi dari user

harus diproses oleh web server . 'ayangkan ketika kita

mengisi form registrasi untuk pendaftaran sebuah situs web,

lalu men-klik tombol s$bmit , menunggu sekitar +C detik untuk

website memproses isian form tersebut, dan mendapati

halaman yang menyatakan bahwa terdapat kolom form yang

masih belum diisi. *ntuk keperluan seperti

inilah $aa%,r(/t dikembangkan. Pemrosesan untukmengecek apakah seluruh form telah terisi atau tidak, bisa

dipindahkan dari web server  ke dalam web browser . Dalam

perkembangan selanjutnya, /avaScri%t  tidak hanya berguna

untuk validasi form, namun untuk berbagai keperluan yang

lebih modern. 'erbagai animasi untuk mempercantik

halaman web, 5tur chatting, efek-efek modern, games,

semuanya bisa dibuat menggunakan /avaScri%t . %kan tetapi

karena sifatnya yang dijalankan di sisi client yakni di dalam

web browser yang digunakan oleh pengunjung situs, user

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 7/13

sepenuhnya dapat mengontrol eksekusi ?avaScript. ampir

semua web browser menyediakan fasilitas untuk mematikan

 ?avaScript, atau bahkan mengubah kode ?avaScript yang ada.

Sehingga kita tidak bisa bergantung sepenuhnya kepada

 ?avaScript.

). M-%0LySE: adalah salah satu aplikasi D'S yang sudah sangat

banyak digunakan oleh para permrogram aplikasi web.

#ontoh D'S lainnya adalah PostgreSE:, SE: Server, s

%ccess dari icrosoft dan lain sebagainya. 6elebihan dari

ySE: adalah gratis, handal dan selalu di-update dan banyak

forum yang memfasilitasi para pengguna jika memiliki

kendala. ySE: juga menjadi D'S yang sering di bundling

dengan web server sehingga proses instalasinya menjadi

lebih mudah.e. PHP

PP adalah suatu bahasa scri%ting  khususnya digunakan

untuk web delevo%ment . 6arena sifatnya yang sever side

scri%ting, maka untuk menjalankan PP harus menggunakan

web server. PP dapat melakukan tugas-tugas yang dilakukan

dengan mekanisme #3 seperti mengambil, mengumpulkan

data dari database, meng-generate  halaman dinamis, atau

bahkan menerima dan mengirim cookie. 6eutamaan dari PP

adalah PP dapat digunakan di berbagai o%erating system

diantaranya :inuA, *niA, "indows, ac!S>, &S# !S, dan

o%erating system lainnya.". $0uer-

 ?Euery adalah suatu library  ?avaScript yang akan menjadikanweb lebih bagus dan menarik dalam hal 0ser Interface, lebih

stabil, dan dapat mempercepat waktu kinerja dalam

membuat web. 6arena hanya perlu memanggil fungsinya

saha tanpa harus membuat dari awal.

g. AaAsynchronous $avaScript and :00P, atau disingkat A$a,

adalah suatu teknik pemrograman berbasis web  untuk

menciptakan aplikasi web interaktif. 0ujuannya adalah untuk

memindahkan sebagian besar interaksi pada komputer web

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 8/13

s$rfer , melakukan pertukaran data dengan server di belakang

layar, sehingga halaman web tidak harus dibaca ulang secara

keseluruhan setiap kali seorang pengguna melakukan

perubahan. al ini akan meningkatkan interaktivitas,

kecepatan, dan $sability .

BAB III

METDE PERAN+ANAN %I%TEM

Sistem %ntrian &estoren 'erbasis "eb ini dirancang sebagai media

informasi serta media promosi secara online bagi restoran atau rumah

makan yang selama ini mengunakan sistem pemesanan secara o1ineataupun tradisional. Dengan adanya web ini secara otomatis dapat

G

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 9/13

meringankan pekerjaan karyawan serta memudahkan prosedur

pemesanan bagi pelanggan atau konsumen. Dalam membuat web ini

memiliki beberapa tahap, antara lain

$. engamati fenomena yang berkaitan tentang studi kasus /sistem

pemesanan berbasis online2 serta mencari beberapa referensi

tentang artikel ataupun perancangan yang telah menjadikan studi

kasus ini sebagai bahasan utamanya.+. elakukan perancangan dalam membangun Sistem %ntrian

'erbasis !nline7. elakukan desain untuk halaman-halaman web<. elakukan !oding  untuk membangun Sistem %ntrian 'erbasis

!nline4. elakukan implementasi dan uji coba terhadap web tersebut.

3.1 Taha/ Peran,angan 0ahap perancangan ini berjuan untuk memudahkan pembuat web

dalam menentukan pembuatan konten-konten didalam web serta

dapat menyesuaikan atau mensinkronkan antara web yang akan

dibangun dengan kebutuhan dari pelanggan /pemesan web2. 0ahap

perancangan yang akan dibahas meliputi dua tahap yaitu Diagram

6onteks dan Data 'low Diagram /DFD2

 

D(agram #*nteks

am'ar 1 D(agram #*nteks

H

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 10/13

6eterangan

$. 0erdiri dari tiga entitas yaitu %dmin, Pelayan dan Pelanggan+. %dmin dapat melakukan pengolahan terhadap data yaitu

memasukkan data serta mengupdate data7. Pelayan dapat melakukan pemeriksaan terhapap pesanan

serta memproses pesanan<. Pelanggan dapat melihat menu, memilih pesanan, serta

memesan makanan dan minuman yang diinginkan

  Data Flow Diagram 5D6D7

am'ar 2 Data 6l*8 D(agram

3.2 Taha/ Desa(n %(stem'egitu rancangan telah selesai maka tahap selanjutnya adalah

melakukan perancangan desain seperti warna, konsep web, font huruf,

dan sebagainya yang dirasa sesuai dengan web yang akan dibangun.

Dalam desain sistem ini dapat menggunakan photoshop dan css.

3.3 Taha/ Penul(san #*)e 5+*)(ng7

 0ahap Penulisan 6ode merupakan tahap yang memakan waku yangpaling lama dan tahap yang paling sulit. 6arena tahap ini berisi

coding-coding  yang harus dikerjakan oleh posisi yanng berkaitan,

semua tidak akan berjalan tanpa adanya tahap coding ini.

3.4 Taha/ U( +*'a 0ahap yang yang terakhir ini adalah mengimplementasi hasil dari

perancangan website yang telah dibuat. Serta tahap yang terakhir

adalah melakukan uji coba hasil website dengan melibatkan user lain.

3.! Ruang L(ngku/"eb ini ditujukan bagi pelanggan dan pelayan yang menginginkan

kemudahan dalam pemesanan makanan dan pemrosesan pesanan

$C

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 11/13

disuatu tempat makan atau restoran. "ebsite ini dibangun

menggunakan javascript, PP, ?Iuery@asy*i sebagai script

pemrogramannya, y SE: sebagai databasenya dan #SS sebagai

script desainnya.Dalam website ini terdapat 7 akses yaitu 1. A)m(n(strat*r 5a)m(n7

ak yang dapat diakses oleh admin yaitu melakukan update menu

makanan dan minuman beserta harga, dan memberikan info

promo yang sudah disediakan oleh manajemen restoran,

• nput dan *pdate Data

Pada menu input data admin berhak memasukkan informasi

terbaru mengenai makanan dan minuman beserta harga

dan berhak melakukan perubahan pada menu update data,

seperti perubahan promosi yang secara berkala.

2. Pelangganak yang dapat diakses oleh pelanggan yaitu memesan dan

mendapatkan informasi mengenai jenis makanan, minuman

berserta harga.

• engisi daftar pesanan

Pada menu ini pelanggan dapat melakukan pemesanan

secara online dengan cara mengisi form pemesanan.• elihat menu

Pada menu ini pelanggan dapat melihat menu-menu

makanan, minuman beserta harga yang tersedia pada

restoran ini.3. Pela-an

ak yang dapat diakses oleh pelayan yaitu pengecekan status

order.

• Pengecekan status order

Pada menu ini pelayan berhak melakukan cek status order

dari pelanggan dan menyalurkan informasi order kepada

 juru masak restoran.

3.9 #e'utuhan %um'er Da-a1. #e'utuhan Perangkat #eras 5Har)8are7

Spesi5kasi hardware yang digunakan penulis untuk mendukung

dalam pembuatan website Sistem %ntrian !nline menggunakan

:aptop %cer %spire dengan spesi5kasi sebagai berikut

N* Ura(an %/es(:kas($ Processor ntel #ore i7 +7<Gm

+ emory /&%2 + 3' DD&7 S!D P#-$CCC

$$

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 12/13

7 arddisk Drive 4CC3' DD

< 3raphic #ard ;vidia 3eforce $C +3'

4 onitor$<J ">3% :@D Display ntel D

<CCC

6eyboard Standart /*S'1PS+2 ouse Standart /*S'1PS+2G #onection "i-Fi GC+.$$ a1b1g1n ,:%;

H %pplication ;eeded ?avaK &untime @nvironment $.

2. #e'utuhan Perangkat Lunak 5%*"t&are7

• "indows G.$

• >%PP v7.+.$• %dobe Dreamweaver #S

• ySE:yog *ltimatev$+.CH

• oBilla FirefoA

• 3oogle #hrome

• !pera ini

DA6TAR PU%TA#A

$+

8/16/2019 Sistem Antrian Restoran Berbasis Web

http://slidepdf.com/reader/full/sistem-antrian-restoran-berbasis-web 13/13

idayatullah, Priyanto dan 6awistara, ?auhari 6hairul. +C$4. "emrograman

Web. 'andung nformatika 'andung.

Saputra, %gus. +C$4. "royek 2343334333 Website oko Online dengan

smarty ")". #irebon %SL% Solution.

$7