Sistem Informasi Ni - Catering Berbasis Web Mobile

JUDUL APLIKASI
SISTEM INFORMASI NI_CATERING BERBASIS

WEB MOBILE
UJIAN TENGAH SEMESTER
GASAL 2023/2024
Muhamad raja’i
rajaii.muhamad@gmail.com
Abstrak
UD. Berkah adalah sebuah usaha rumah makan prasmanan dan penyedia
jasa catering yang sekarang sedang maju pesatnya usaha ini. Sistem yang berjalan
di UD. Berkah saat ini masih manual, sehingga dapat menyebabkan kehilangan
data peralatan catering dan bahan baku, kurang efektifnya pemesanan catering,
serta penyampaian informasi yang kurang luas. Tujuan dari penelitian ini adalah
merancang, membangun, mengimplementasi dan menguji sistem. Perancangan
sistem dalam penelitian ini menggunakan metode berorientasi objek dan metode
pengembangannya menggunakan sistem prototype. Hasil dari penelitian ini adalah
untuk membangun sistem informasi jasa catering yang dapat membantu mengatasi
permasalahan yang ada saat ini. (Arrahman & Hasti, 2019)
1. KAJIAN PUSTAKA
1.1. Perancangan
Dengan memahami situasi yang dihadapi oleh bisnis NI_Catering, dan
memahami jenis layanan dan fitur yang dapat dibuat untuk sistem
informasi manajemen catering ini, pembuatan dan pengembangan
aplikasi akan menjadi lebih terfokus dan bersifat strategis. Selain itu,
pemahaman proses bisnis yang dijalankan oleh NI_Catering akan
membantu perancangan sistem informasi yang lebih efektif. Berikut ini
adalah hasil dari analisis dan rancangan sistem. (Rohmalia & Djajalaksana,
2013)
1.2. Aplikasi
a. Adobe Dreamwaver CS6
Menurut jurnal Rozaq, Lestari dan Handayani (2015) Adobe
Dreamweaver adalah aplikasi desain dan pengembangan web yang
menyediakan editor WYSIWYG visual (bahasa sehari-hari yang
disebut sebagai Design view) dan kode editor dengan fitur standar
seperti syntax highlighting, code completion, dan code collapsing
serta fitur lebih canggih seperti real-time syntax checking dan code
introspection untuk menghasilkan petunjuk kode untuk membantu
pengguna dalam menulis kode. (Erlita Sulistiati, 2018)
b. Xampp 3.3.0
Menurut Nugroho (2009:74) mendefinisikan XAMPP merupakan
paket PHP berbasis Open Source yang dikembangkan oleh
komunitas Open Source. (Erlita Sulistiati, 2018)
c. Web Browser
Menurut Sibero (2013:12) mengemukakan bahwa“Web Browser
adalah aplikasi perangkat lunak yang digunakan untuk mengambil
dan menyajikan sumber informasi web”. Sedangkan menurut Gary
dan Veermat (2012:112) mengemukakan bahwa “Suatu Web Browser,
atau browser, adalah piranti lunak aplikasi yang dapat digunakan
pengguna untuk mengakses dan melihat laman Web atau program-
program Web”. (Bianglala & Firmansyah, 2017)
1.3. Catering
Catering adalah kegiatan usaha yang menyediakan makan dan pelayanan.
Pengelolaan bisnis catering melibatkan banyak aspek, baik itu yang berbasis
bisnis rumahan atau bisnis berskala besar/korporasi. Pada umumnya,
catering yang merupakan bisnis rumahan cenderung dikelola dengan
pengalaman yang terbatas, polis asuransi yang lebih kecil dan kurangnya
pengetahuan tentang sanitasi yang layak. Kompetisi bisnis catering yang
merupakan rumahan biasanya milik perorangan, dan terkadang menjadi
pesaing yang lebih diuntungkan dibandingkan dengan catering yang sudah
berlisensi, karena catering rumahan tidak dikenai biaya yang sama, memiliki
biaya yang rendah, dan dapat menetapkan harga yang lebih rendah.
(Rohmalia & Djajalaksana, 2013)
1.4. Website
Website adalah sering juga disebut Web, dapat diartikan suatu kumpulan-
kumpulan halaman yang menampilkan berbagai macam informasi teks, data,
gambar diam ataupun bergerak, data animasi, suara, video maupun gabungan dari
semuanya, baik itu yang bersifat statis maupun yang dinamis, yang dimana
membentuk satu rangkaian bangunan yang saling berkaitan dimana masing-
masing dihubungkan dengan jaringan halaman atau hyperlink (Mundzir, 2018).
1.5. Jquery
jQuery adalah JavaScript library yang dirancang untuk meringkas kode-kode
JavaScript, sehingga dapat menyederhanakan penulisan skrip program,
sesuai dengan slogan “writeless, do more” . jQuery pertama kali dirilis oleh
John Resig pada tahun 2006. (Yatini et al., 2014)
1.6. Mobile
Menurut Brian Fling (2016) Web Mobile merupakan situs web yang
dirancang khusus untuk perangkat mobile. Situs web mobile sering memiliki
desain yang sederhana dan biasanya bersifat memberikan informasi
(Abdurahman 2016).
Menurut Devi (2015) Web Mobile juga satu-satunya platfrom yang tersedia
dan mampu berjalan pada semua perangkat mobile, dan perancangan
menggunakan standar dan protokol yang sama dengan desktop web. Untuk
dapat mendesain aplikasi web untuk mobile harus diperhatikan betul bahwa
karakteristik web untuk mobile berbeda dengan desktop (Indriasari, Adi, and
Sidhi 2011). (Usmanto et al., 2018)
2. PEMBAHASAN
Merupakan tahap menguraikan seluruh hasil dan pembahasan yang
digunakan untuk menggambarkan secara detail dari laporan Perancangan Sistem
Informasi NI_Catering Berbasis Jquery Mobile.
2.1. Koding Program

Tabel 1. Script Koneksi Program
<?php
$mysqli = new mysqli("localhost","root","","dbnicatering");
?>
Tabel 2. Script Program

1. Halaman Index/Halaman Masuk
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="jquery-mobile/jquery.mobile.theme-1.4.5.css" rel="stylesheet"
type="text/css" />
<link href="jquery-mobile/jquery.mobile.structure-1.4.5.min.css"
rel="stylesheet" type="text/css" />
<script src="jquery-mobile/jquery-2.1.4.min.js"
type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.4.5.min.js"
</head>
<body>
<div class="jqm-demos" id="beranda" data-role="page" data-title="NI
CATERING">
<div data-role="header" data-position="fixed" >
<a href="#nav-panel" data-icon="bars">Menu</a>
<h1>NI CATERING</h1>
</div>
<div data-role="navbar">
<ul>
<li><a href="beranda.php" data-role="button" data-icon="home" data-
iconpos="top">BERANDA</a></li>
<li><a href="menu.php" data-role="button" data-icon="bullets" data-
iconpos="top">DAFTAR MENU</a></li>
<li><a href="pencarian.php" data-role="button" data-icon="search" data-
iconpos="top">PENCARIAN</a></li>
<li><a href="index.php" data-role="button" data-icon="user" data-
iconpos="top">MASUK</a></li>
</ul></div>
<center>
<h1>LOGIN</h1>
<form action="action-login.php" method="post">
<table>
<tr>
<td>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="reset" value="Cancel"><input
type="submit" value="Login"></td>
</tr>
</table>
</form>
</center>
<div data-role="footer">
<h4>Muhamad Raja'i NPM : 231055201075</h4>
</div>
<div id="nav-panel" data-role="panel" data-theme="c" data-

display="overlay" data-position-fixed="true">
<div data-role="collapsibleset" data-inset="false" data-theme="c">
<div data-role="collapsible" data-theme="c">
<h2>PROFIL</h2>
<ul data-role="listview" data-theme="c">
<li><a href="#">NI CATERING</a></li>
<li><td><a href="admin.php" data-rel="dialog" data-
transition="flow" class="ui-shadow">Admin</a></li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
2. Halaman Beranda
<!DOCTYPE html>
<html>
<head>
type="text/css" />
</head>
<body>
CATERING">
<ul>
</ul></div>
<img name="" src="catering.jpg" width="100%" height="100%" alt="" />
</div>

<h2>PROFIL</h2>
</ul>
</div>
</body>
</html>
3. Halaman Menu
<!DOCTYPE html>
<html>
<head>
type="text/css" />
</head>
<body>
CATERING">
<ul>
</ul></div>
<h4 align="center">DAFTAR HARGA MENU MAKANAN</h4>
<table border="2" width="100%">

<thead>
<tr>
<td width="5"><div align="center">No.</div></td>
<td><div align="center">Menu</div></td>
<td><div align="center">Harga</div></td>
</tr>
</thead>
<tbody>
<?php
$no = 1;
// tampilkan data namahotel
$query = mysqli_query($conn, "SELECT * FROM tbmenu");
while ($dt = mysqli_fetch_assoc($query)) {

?>
<tr>
<td><?= $no++; ?></td>
<td><?= $dt['menu']; ?></td>
<td><?= $dt['harga']; ?></td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
<h2>PROFIL</h2>
</ul>
</div>
</body>
</html>
4. Halaman Pencarian
<!DOCTYPE html>
<html>
<head>
type="text/css" />
</head>
<body>
CATERING">
<ul>
</ul></div>
<h4 align="center">PENCARIAN</h4>
<form method="get" action="">
<label for="cari"></label>
<input type="text" name="cari">
</form>
<br/>
<table border="1" width="100%">
<thead>
<tr>
<td width="5"><div align="center">No.</div></td>
<td><div align="center">Menu</div></td>
<td><div align="center">Harga</div></td>
</tr>
</thead>
<tbody>
<?php
$no = 1;
// tampilkan data namahotel
$query = mysqli_query($conn, "SELECT * FROM tbmenu");
// kondisi apabila form pencarian diisi

if (isset($_GET['cari'])) {
$query = mysqli_query($conn, "SELECT * FROM tbmenu WHERE
menu LIKE '%".$_GET['cari']."%'");
}
while ($dt = mysqli_fetch_assoc($query)) {

?>
<tr>
<td><?= $no++; ?></td>
<td><?= $dt['menu']; ?></td>
<td><?= $dt['harga']; ?></td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>

<h2>PROFIL</h2>
</ul>
</div>
</body>
</html>
2.2. Penerapan Program
Gambar 1. Halaman Index/Halaman Masuk

Halaman login wajib memasukan user dan password agar bisa
menggunakan aplikasi NI_Catering
Gambar 2. Halaman Beranda

Halaman Beranda menampilkan halaman depan catering
Gambar 3. Halaman Menu
Menampilkan daftar menu yang tersedi
Gambar 3. Halaman Pencarian

Berfungsi untuk mencari menu yang dipesan dengan cepat
3. PENUTUP
3.1 Kesimpulan
Berdasarkan perencanaan, analisis, implementasi, dan pembahasan yang
telah dilakukan dalam pembuatan aplikasi dan website jasa NI_Catering ini dapat
disimpulkan sebagai berikut :
1. Sistem Informasi Jasa Catering ini diharapkan dapat membantu proses
pemesanan catering menjadi efisien dan efektif yang awalnya menggunakan
via whatsapp kini sudah bisa pemesanan catering via online.
2. Sistem Informasi Jasa Catering ini dapat memudahkan dalam pengelolaan data
dengan baik sehingga proseskerjanya bisa lebih efisien.
3. Sistem Informasi Jasa Catering ini dapat memudahkan dalam pengontrolan
peralatan catering, sehingga tidak adanya lagi kesalahan perhitungan dalam
pendataan dalam peralatan catering.
3.2 Saran
Terdapat hal yang mungkin dapat dijadikan literatur untuk pengembangan
sistem informasi pada NI_Catering, antara lain :
1. Untuk kedepannya Sistem Informasi Jasa Catering ini diharapkan dapat
menambahkan lebih banyak menu lain agar memudahkan dalam proses
usahanya.
menambah hak akses agar dapat membantu pengguna yang lain.
membuat laporan yang dibutuhkan dengan lebih baik.
4. DAFTAR PUSTAKA
Implementasi Web Mobile Sebagai Mediainformasi Pemberdayaan Masyarakat Di

Desa Pirngadi. (Usmanto et al., 2018)
Aplikasi Pengolahan Citra Berbasis Web Menggunakan Javascript Dan Jquery.
(Yatini et al., 2014)
Pengelolaan Bisnis Catering dengan Memanfaatkan Sistem Informasi Berbasis
Web (Studi Kasus pada Anggun Catering). (Rohmalia & Djajalaksana, 2013)
Penerapan Metode SDLC Waterfall Dalam Pembuatan Aplikasi Pelayanan
Anggota Pada CU Duta Usaha Bersama Pontianak. (Bianglala & Firmansyah,
2017)
Membangun Website Pada Smp Negeri 33 Oku Menggunakan Php & Mysql.
(Erlita Sulistiati, 2018)
Sistem Informasi Jasa Catering Berbasis Web Pada Ud. Berkah Web Catering
Service Information System At Ud. Berkah. (Arrahman & Hasti, 2019)
Perancangan Customer Relationship Management Berbasis Web Dengan Library
Jquery Responsive Datatables. (Somya & Chandra Utama, 2019)

Sistem Informasi Ni - Catering Berbasis Web Mobile

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Sistem Informasi Ni - Catering Berbasis Web Mobile

Diunggah oleh

Hak Cipta:

Format Tersedia

JUDUL APLIKASI

SISTEM INFORMASI NI_CATERING BERBASIS

2.1. Koding Program

$mysqli = new mysqli("localhost","root","","dbnicatering");

Tabel 2. Script Program

<div id="nav-panel" data-role="panel" data-theme="c" data-

<img name="" src="catering.jpg" width="100%" height="100%" alt="" />

<div id="nav-panel" data-role="panel" data-theme="c" data-

<h4 align="center">DAFTAR HARGA MENU MAKANAN</h4>

<table border="2" width="100%">

while ($dt = mysqli_fetch_assoc($query)) {

// kondisi apabila form pencarian diisi

while ($dt = mysqli_fetch_assoc($query)) {

<div id="nav-panel" data-role="panel" data-theme="c" data-

Gambar 1. Halaman Index/Halaman Masuk

Gambar 2. Halaman Beranda

Gambar 3. Halaman Pencarian

Implementasi Web Mobile Sebagai Mediainformasi Pemberdayaan Masyarakat Di

Anda mungkin juga menyukai