Perancangan Sistem Informasi Berbasis Web Pada Toko Cahaya Baru Ponsel Kota Padangsidimpuan

PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA

TOKO CAHAYA BARU PONSEL KOTA PADANGSIDIMPUAN

TUGAS AKHIR

MAYA MASYITA K NST

112406042

PROGRAM STUDI D-3 TEKNIK INFORMATIKA

DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

MEDAN

2014

PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA

TOKO CAHAYA BARU PONSEL KOTA PADANGSIDIMPUAN

TUGAS AKHIR

Diajukan untuk melengkapi tugas akhir dan memenuhi syarat memperoleh gelar

Ahli Madya

MAYA MASYITA K NST

112406042

PROGRAM STUDI D-3 TEKNIK INFORMATIKA

DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

MEDAN

2014

PERSETUJUAN

Judul

: PERANCANGAN

SISTEM

INFORMASI

BERBASIS WEB PADA TOKO CAHAYA BARU

PONSEL KOTA PADANGSIDIMPUAN

Kategori

: TUGAS AKHIR

Nama

: MAYA MASYITA K NST

Nomor Induk Mahasiswa : 112406042

Program Studi

: DIPLOMA (D3) TEKNIK INFORMATIKA

Departemen

: MATEMATIKA

Fakultas

: MATEMATIKA DAN ILMU PENGETAHUAN

ALAM (FMIPA) UNIVERSITAS SUMATERA

UTARA

Disetujui di

Medan, Juni 2014

Disetujui Oleh

Program Studi D3 Teknik Informatika

Pembimbing

FMIPA USU

Ketua,

Dr. Elly Rosmaini, M.Si

Drs. Ujian Sinulingga, M.Si

NIP. 19600520 198503 2 002

NIP. 19560303 198403 1 004

PERNYATAAN

PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA TOKO

CAHAYA BARU PONSEL KOTA PADANGSIDIMPUAN

TUGAS AKHIR

Saya mengakui bahwa tugas akhir ini adalah hasil karya saya sendiri, kecuali

beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.

Medan,

Juni 2014

MAYA MASYITA K NST

112406042

PENGHARGAAN

Puji dan syukur penulis ucapkan atas kehadirat Allah SWT yang telah

memberikan Rahmat serta Hidayah kepada kita semua, sehingga berkat

Karunia-Nya penulis dapat menyelesaikan Tugas Akhir dengan baik yang berjudul

“Perancangan Sistem Informasi Berbasis Web Pada Toko Cahaya Baru Ponsel

Kota Padangsidimpuan“ pada waktu yang telah ditetapkan.

Terimakasih penulis sampaikan kepada bapak Drs. Ujian Sinulingga, M.Si,

selaku pembimbing yang telah meluangkan waktunya selama penyusunan tugas

akhir. Terimakasih kepada Ibu Dr. Elly Rosmaini, M.Si dan Bapak Syahriol

Sitorus, S.Si, M.IT selaku Ketua dan Sekretaris Program Studi D3 Teknik

Informatika FMIPA USU, Bapak Prof. Dr. Tulus, M.Si dan Ibu Dr. Mardiningsih,

M.Si selaku Ketua Departemen dan Sekertaris Departemen Matematika FMIPA

USU, Bapak Dr. Sutarman M.Sc selaku Dekan FMIPA USU, seluruh Staff dan

Dosen Program Studi D3 Teknik Informatika FMIPA USU, pegawai FMIPA USU

dan rekan-rekan kuliah. Teristimewa kepada kedua Orang tua Ayahanda Alm.

Zulkarnain, Ibunda Siti Aisyah dan adinda tersayang Salina Ramadhani K Nst

yang selama ini memberikan bantuan dan dorongan yang diperlukan. Semoga

Allah SWT akan membalasnya.

ABSTRAK

Perkembangan teknologi saat ini semakin berkembang pesat dan teknologi

sekarang ini sangat erat kaitannya dengan kehidupan masyarakat. Handphone

merupakan salah satu alat telekomunikasi yang perkembangan teknologinya

sangatlah pesat. Sekarang handphone bukanlah termasuk barang mewah yang

susah didapatkan. Selain itu, baik kalangan remaja, orangtua bahkan anak-anak

dapat menggunakan alat telekomunikasi ini.

Karena perkembangan teknologi handphone yang pesat sekarang ini

sehingga memicu Toko Cahaya Baru Ponsel Kota Padangsidimpuan menjual

berbagai jenis handphone kepada konsumen. Sistem informasi transaksi

penjualan, pembelian bahkan persediaan barang di Toko Cahaya Baru Ponsel

masih menggunakan sistem manual. Jadi, memungkinkan terjadinya kesalahan

dalam mengolah data barang yang ada di toko tersebut.

Oleh sebab itu penulis mencoba merancang suatu sistem informasi berbasis

web yang bersifat komputerisasi dalam pengolahan data dan pembuatan laporan

transaksi penjualan, pembelian dan persediaan barang. Sehingga diharapkan agar

dapat mengatasi kesalahan-kesalahan dari sistem yang manual.

Sistem informasi berbasis web ini dirancang dengan menggunakan bahasa

pemrograman web, yaitu PHP 5.0 dan MySQL 5.0 sebagai server database serta

XAMPP sebagai web server. Sistem informasi ini bersifat

offline

, yaitu

penggunaannya hanya di toko Cahaya Baru Ponsel Kota Padangsidimpuan.

DAFTAR ISI

Halaman

Persetujuan

ii

Pernyataan

iii

Penghargaan

iv

Abstrak

v

Daftas Isi

vi

Daftar Tabel

viii

Daftar Gambar

ix

Bab 1 Pendahuluan

1

1.1 Latar Belakang

3

1.2 PerumusanMasalah

3

1.3 Batasan Masalah

3

1.4 Maksud dan Tujuan Penelitian

4

1.5 Metodologi Penelitian

4

1.6 Lokasi dan Waktu Penelitian

5

1.7 Sistematika Penulisan

6

Bab 2 Landasan Teori

8

2.1 Pengertian Sistem Informasi

8

2.1.1

Data

9

2.1.2

Sistem

9

2.1.3

Informasi

10

2.2 Pengertian Handphone (Telepon Seluler)

10

2.3 Bagan Alir (Flowchart)

11

2.4 Entity Diagram Realtionship (ERD)

13

2.5 HTML

13

2.5.1

Kelebihan dan Kekurangan HTML

15

2.5.2

Refensi HTML

16

2.6 WWW (World Wide Web)

19

2.7 Pengenalan PHP

20

2.7.1

Kelebihan dan Kelemahan PHP

21

2.7.2

Konsep Dasar PHP

22

2.7.3

Variabel pada PHP

24

2.7.4

Operator pada PHP

25

2.8

Pengenalan XAMPP

28

2.9

Pengenalan MySQL

28

2.9.1

Kelebihan MySQL

29

2.10 CSS ( Cascading Style Sheet)

30

2.11 Pengenalan Adobe Dreamweaver CS5.5

31

Bab 3 Perancangan Sistem

35

3.1 Perancangan Sistem

35

3.2 Metode Pengembangan Sistem

35

3.3 Data Flow Diagram (DFD)

36

3.4 Bagan Alir (Flowchart)

38

3.4.1

Flowchart Login Admin

38

3.4.2

Flowchart Halaman Utama

39

3.5 Entity Relationship Diagram (ERD)

40

3.6 Perancangan Database

42

Bab 4 Implementasi Sistem

45

4.1 Pengertian Implementasi Sistem

45

4.2 Tujuan Implementasi Sistem

45

4.3 Komponen Utama dalam Implementasi Sistem

46

4.4 Pemeliharaan Sistem

48

4.5 Demonstrasi Program

48

4.5.1

Tampilan Halaman Utama

49

4.5.2

Tampilan Form Menu

49

4.5.3

Tampilan Halaman Penjualan

50

4.5.4

Tampilan Form Input Data Penjualan

50

4.5.5

Tampilan Form Edit Data Penjualan

51

4.5.6

Tampilan Form Hapus Data Penjualan

51

4.5.7

Tampilan Halaman Pembelian

52

4.5.8

Tampilan Form Input Data Pembelian

52

4.5.9

Tampilan Form Edit Data Pembelian

53

4.5.10 Tampilan Form Hapus Data Pembelian

53

4.5.11 Tampilan Halaman Persediaan

54

4.5.12 Tampilan Form Input Data Persediaan

54

4.5.13 Tampilan Form Edit Data Pembelian

55

4.5.14 Tampilan Form Hapus Data Persediaan

55

4.5.15 Tampilan Halaman Cetak Data

56

Bab 5 Kesimpulan dan Saran

52

5.1 Kesimpulan

52

5.2 Saran

53

Daftar Pustaka

54

DAFTAR TABEL

Halaman

Tabel 2.1 Tabel Simbol-Simbol Data Flow Diagram

11

Tabel 2.2 Tabel Simbol-Simbol Entity Diagram Realtionship

13

Tabel 2.3 Tabel Refensi Tag HTML

17

Tabel 2.4 Operator Aritmatika pada PHP

25

Tabel 2.5 Operator Penegasan pada PHP

26

Tabel 2.6 Operator Perbandingan pada PHP

27

Tabel 2.7 Operator Logika pada PHP

27

Tabel 3.1 Tabel Login Admin

43

Tabel 3.2 Tabel Penjualan

43

Tabel 3.3 Tabel Pembelian

44

DAFTAR GAMBAR

Halaman

Gambar 2.1 Tampilan Awal pada Adobe Dreamweaver CS5.5

32

Gambar 2.2 Tampilan Ruang Kerja pada Adobe Dreamweaver CS5.5

32

Gambar 3.1 Diagram Konteks Perancangan Sistem Informasi

37

Gambar 3.2 Diagram Alir Level Nol Perancangan Sistem Informasi

38

Gambar 3.3 Flowchart Login Admin

39

Gambar 3.4 Flowchart Halaman Utama

40

Gambar 3.5 Entity Relationship Diagram Perancangan Sistem Informasi

41

Gambar 4.1 Tampilan Halaman Utama

49

Gambar 4.2 Tampilan Form Menu

49

Gambar 4.3 Tampilan Halaman Penjualan

50

Gambar 4.4 Tampilan Form Input Data Penjualan

50

Gambar 4.5 Tampilan Form Edit Data Penjualan

51

Gambar 4.6 Tampilan Form Hapus Data Penjualan

51

Gambar 4.7 Tampilan Halaman Pembelian

52

Gambar 4.8 Tampilan Form Input Data Pembelian

52

Gambar 4.9 Tampilan Form Edit Data Pembelian

53

Gambar 4.10 Tampilan Form Hapus Data Pembelian

53

Gambar 4.11 Tampilan Halaman Persediaan

54

Gambar 4.12 Tampilan Form Input Data Persediaan

54

Gambar 4.13 Tampilan Form Edit Data Pembelian

55

Gambar 4.14 Tampilan Form Hapus Data Persediaan

55

ABSTRAK

Perkembangan teknologi saat ini semakin berkembang pesat dan teknologi

sekarang ini sangat erat kaitannya dengan kehidupan masyarakat. Handphone

merupakan salah satu alat telekomunikasi yang perkembangan teknologinya

sangatlah pesat. Sekarang handphone bukanlah termasuk barang mewah yang

susah didapatkan. Selain itu, baik kalangan remaja, orangtua bahkan anak-anak

dapat menggunakan alat telekomunikasi ini.

Karena perkembangan teknologi handphone yang pesat sekarang ini

sehingga memicu Toko Cahaya Baru Ponsel Kota Padangsidimpuan menjual

berbagai jenis handphone kepada konsumen. Sistem informasi transaksi

penjualan, pembelian bahkan persediaan barang di Toko Cahaya Baru Ponsel

masih menggunakan sistem manual. Jadi, memungkinkan terjadinya kesalahan

dalam mengolah data barang yang ada di toko tersebut.

Oleh sebab itu penulis mencoba merancang suatu sistem informasi berbasis

web yang bersifat komputerisasi dalam pengolahan data dan pembuatan laporan

transaksi penjualan, pembelian dan persediaan barang. Sehingga diharapkan agar

dapat mengatasi kesalahan-kesalahan dari sistem yang manual.

Sistem informasi berbasis web ini dirancang dengan menggunakan bahasa

pemrograman web, yaitu PHP 5.0 dan MySQL 5.0 sebagai server database serta

XAMPP sebagai web server. Sistem informasi ini bersifat

offline

, yaitu

penggunaannya hanya di toko Cahaya Baru Ponsel Kota Padangsidimpuan.

BAB 1

PENDAHULUAN

1.1

Latar Belakang

Seiring berkembangnya teknologi, contohnya

handphone

, tidak lagi dianggap

sebagai barang mewah dalam kehidupan sehari-hari. Kebutuhan terhadap

handphone

telah menjadi keperluan penting bagi banyak orang. Penggunanya juga

tidak terbatas oleh orang dewasa saja, tetapi juga anak-anak dan remaja. Salah

satu sebab dari kenaikan jumlah permintaan untuk produk ini adalah

perkembangan fasilitas produknya yang berlanjut terus menerus.

Fasilitas yang dimiliki

handphone

semakin lama semakin canggih.

Produk-produk baru terus bermunculan dengan fasilitas yang menarik, seperti kamera,

kemampuan untuk transfer data, bahkan untuk melakukan koneksi ke internet. Hal

ini mendorong para pengguna

handphone

membeli produk

handphone

yang baru.

Pembelian dan penjualan merupakan kegiatan yang mempengaruhi jumlah

persediaan. Pembelian akan menambah jumlah persediaan, sedangkan penjualan

akan menguranginya. Ketiga hal tersebut saling berkaitan dan merupakan inti

kegiatan toko. Informasi yang dihasilkan akan membantu pemilik toko dalam

memutuskan jumlah persediaan yang akan dibeli, maupun jumlah yang tersedia

untuk dijual, serta mengontrol dan mengawasi jumlah aset persediaan toko.

Toko Cahaya Baru Ponsel Kota Padangsidimpuan adalah bentuk usaha

swasta yang bergerak di bidang penjualan

handphone

dan aksesoris

handphone

.

Toko Cahaya Baru Ponsel Kota Padangsidimpuan berdiri pada tahun 2002,

terletak di Jalan Merdeka No. 90 Padangsidimpuan, yang dimiliki oleh Ibu Merry.

Latar belakang didirikanya Toko Cahaya Baru Ponsel Kota Padangsidimpuan

adalah untuk memberikan pengalaman di bidang usaha dan menciptakan

lapangan usaha untuk masyarakat serta mampu melayani masyarakat dengan

baik.

Saat ini, pencatatan atas transaksi pembelian dan penjualan toko masih

dilakukan secara manual dan bisa dikatakan kurang memadai melihat kenyataan

transaksi yang terjadi relatif besar jumlahnya, sehingga agak menyita waktu bila

ingin menghasilkan laporan persediaan dalam waktu singkat. Saatnya toko

menerapkan sistem informasi pembelian, penjualan dan persediaan secara

komputerisasi untuk mengatasi hal tersebut.

Berdasarkan uraian-uraian di atas, penulis tertarik melakukan penelitian

dengan judul

“Perancangan Sistem Informasi Berbasis Web Pada Toko

Cahaya Baru Ponsel Kota Padangsidimpuan.”

1.2

Perumusan Masalah

Berdasarkan latar belakang tersebut, perumusan masalah yang diangkat oleh

penulis adalah bagaimana membangun suatu sistem informasi berbasis web yang

dapat digunakan untuk pencatatan, pengolahan, penyimpanan, dan pelaporan

data Toko Cahaya Baru Ponsel Kota Padangsidimpuan

1.3

Batasan Masalah

Dengan keterbatasan waktu dan agar pembahasan tidak menyimpang dari tujuan,

maka penulis melakukan pembatasan masalah sebagai berikut:

1.

Transaksi pembelian dan penjualan bersifat tunai.

2.

Informasi yang dihasilkan berupa laporan pembelian (per tanggal, per

supplier

, per produk), laporan penjualan (per tanggal, per

customer

, per

produk) dan laporan persediaan barang.

3.

Bahasa pemrograman yang digunakan adalah PHP, Java Script dan MySQL

sebagai format basisdatanya.

4.

Software

yang digunakan adalah XAMPP, DREAMWEAVER CS5,

SUBLIME Text.

5.

Aplikasi berbasis web ini di jalankan secara

offline

karena aplikasi ini hanya

untuk Toko Cahaya Baru Ponsel.

1.4

Maksud dan Tujuan Penelitian

Maksud dari penelitian ini adalah sebagai berikut :

1.

Rancangan sistem yang baru akan dapat mengatasi masalah efisiensi dan

ketepatan penggunaan waktu dalam memproses laporan pembelian, penjualan

dan persediaan barang.

2.

Untuk dapat mengaplikasikan ilmu yang telah didapat dari perkuliahan dan

praktikum, sehingga nantinya dapat menambah pengalaman dan keterampilan

penulis.

Tujuan penelitian adalah sebagai berikut:

1.

Merancang suatu sistem informasi pembelian, penjualan dan persediaan yang

diharapkan bisa mempermudah toko dalam mengolah data dan melaporkan

informasi yang berkaitan dengan pembelian, penjualan dan persediaan.

2.

Menambah wawasan dan pengetahuan serta kreativitas penulis berdasarkan

ilmu yang telah diperoleh di perkualiahan.

1.5

Metodologi Penelitian

Dalam melakukan penelitian ini untuk mendapatkan informasi yang dibutuhkan,

penulis melakukan pengumpulan data dengan cara sebagai berikut:

1.

Penelitian Lapangan

Untuk mendapatkan data yang relevan dan akurat serta diperlukan dalam

penelitian, dilakukan pengumpulan data secara langsung ke objek.

Data dalam penelitian dilapangan diperoleh melalui:

a.

Observasi

Observasi dilakukan dengan melihat beberapa dokumen dan

mengamati kegiatan toko di bagian pembelian dan penjualan untuk

mengetahui prosedur pembelian dan penjualan pada toko.

b.

Wawancara

Wawancara dilakukan dengan mengajukan pertanyaan-pertanyaan

kepada pemilik toko dan karyawan di bagian pembelian dan penjualan

secara lisan mengenai pembelian, penjualan dan persediaan.

2.

Penelitian Kepustakaan

Mengumpulkan data dengan cara mencari referensi-referensi serta literature

untuk membantu dalam mengumpulkan informasi serta dapat menjadi bahan

acuan dalam penyelesaian penelitian ini.

1.6

Lokasi dan Waktu Penelitian

Dalam penyusunan dan penelitian tugas akhir ini, penulis melakukan penelitian

pada Toko Cahaya Baru Ponsel Kota Padangsidimpuan di Jalan Merdeka No. 90

Padangsidimpuan.

1.7

Sistematika Penulisan

Penulisan tugas akhir ini tersusun dalam 5 (lima) bab dan beberapa lampiran.

Adapun sistematika penulisan tugas akhir ini adalah:

BAB 1 :

PENDAHULUAN

Dalam bab ini penulis menjelaskan tentang latar belakang pemilihan

judul, rumusan masalah, batasan masalah, tujuan penyusunan tugas

akhir, manfaat penyusunan tugas akhir, lokasi penelitian, metodologi

penelitian, dan sistematika penyusunan tugas akhir.

BAB 2 :

LANDASAN TEORI

Dalam bab ini penulis menjelaskan tentang beberapa teori berasal dari

referensi yang mendasari dan berhubungan dengan perancangan

sistem informasi berbasis web pada Toko Cahaya Baru Ponsel Kota

Padangsidimpuan.

BAB 3 :

PERANCANGAN SISTEM

Pada bab ini diuraikan deskripsi tentang perancangan

database

yang

dipergunakan, sistem yang dirancang, dan

flowchart

sistem.

BAB 4 : IMPLEMENTASI SISTEM

Dalam bab ini penulis menjelaskan tentang implementasi seperti

komponen utama implementasi, instalasi XAMPP serta Dreamwaver

CS5.

BAB 5 :

PENUTUP

Bab Penutup ini merupakan bab terakhir yang berisi kesimpulan dan

saran hasil perancangan sistem yang dibentuk oleh penulis.

BAB 2

LANDASAN TEORI

2.1

Pengertian Sistem Informasi

Computer Based Information System

(CBIS) atau yang dalam Bahasa Indonesia

disebut juga Sistem Informasi Berbasis Komputer merupakan sistem pengolah

data menjadi sebuah informasi yang berkualitas dan dipergunakan untuk suatu alat

bantu pengambilan keputusan. Sistem Informasi yang akurat dan efektif, dalam

kenyataannya selalu berhubungan dengan istilah

“computer-based”

atau

pengolahan informasi yang berbasis pada komputer. Sistem Informasi “berbasis

komputer” mengandung arti bahwa komputer memainkan peranan penting dalam

sebuah sistem informasi.

Secara teori, penerapan sebuah Sistem Informasi memang tidak harus

menggunakan komputer dalam kegiatannya. Tetapi pada prakteknya tidak

mungkin sistem informasi yang sangat kompleks itu dapat berjalan dengan baik

jika tanpa adanya komputer. Sistem Informasi merupakan sistem pembangkit

informasi. Dengan integrasi yang dimiliki antar subsistemnya, sistem informasi

akan mampu menyediakan informasi yang berkualitas, tepat, cepat dan akurat

sesuai dengan manajemen yang membutuhkannya.

2.1.1 Data

Secara konseptual, data adalah deskripsi tentang benda, kejadian aktivitas, dan

transaksi, yang tidak mempunyai makna atau tidak berpengaruh secara langsung

kepada pemakai. Data merupakan deskripsi dari sesuatu dan kejadian yang kita

hadapi. Data adalah fakta yang jelas lingkup, tempat, dan waktunya. Data

diperoleh dari sumber data primer atau sekunder dalam bentuk berita tertulis atau

sinyal elektronis. Jadi pada intinya, data merupakan kenyataan yang

menggambarkan suatu kejadian dan merupakan kesatuan nyata yang nantinya

akan digunakan sebagai bahan dasar suatu informasi.

2.1.2 Sistem

Sistem adalah kumpulan dari beberapa elemen yang saling berintegrasi untuk

mencapai tujuan tertentu. Elemen-elemen yang mewakili suatu sistem secara

umum adalah masukan

(input)

, pengolahan

(processing)

, dan keluaran

(output)

.

Sistem mempunyai karakteristik atau sifat-sifat tertentu, yaitu mempunyai

komponen-komponen

(components)

, batas sistem

(boundary)

, lingkungan luar

sistem

(environment)

, penghubung

(interface)

, masukan

(input)

, keluaran

(output)

,

pengolah

(process)

, dan sasaran

(objectives)

atau tujuan

(goal)

.

2.1.3 Informasi

Informasi adalah data yang telah diproses sedemikian rupa seingga meningkatkan

pengetahuan seseorang yang menggunakan data tersebut. Kegunaan informasi

adalah untuk mengurangi ketidakpastian di dalam proses pengambilan keputusan

tentang suatu keadaan. Suatu informasi dikatakan bernilai bila manfaatnya lebih

efektif dibandingkan dengan biaya untuk mendapatkan informasi tersebut.

Informasi itu sendiri memiliki ciri-ciri seperti berikut (Davis, 1999):

1.

Benar atau salah. Dalam hal ini, informasi berhubungan dengan kebenaran

terhadap kenyataan. Jika penerima informasi yang salah mempercayainya,

efeknya seperti kalau informasi itu benar.

2.

Baru. Informasi benar-benar baru bagi si penerima.

3.

Tambahan. Informasi dapat memperbarui atau memberikan perubahan

terhadap informasi yang telah ada.

4.

Korektif. Informasi dapat digunakan untuk melakukan koreksi terhadap

informasi sebelumnya yang salah atau kurang benar.

5.

Penegas. Informasi dapat mempertegas informasi yang telah ada sehingga

keyakinan terhadap informasi semakin meningkat.

2.2

Pengertian Handphone (Telepon Seluler)

Telepon seluler (ponsel) atau telepon genggam (telgam) atau

handphone

(HP) atau

disebut pula adalah perangkat

telekomunikasi

elektronik yang mempunyai

kemampuan dasar yang sama dengan

telepon

konvensional saluran tetap, namun

dapat dibawa ke mana-mana (portabel,

mobile

) dan tidak perlu disambungkan

dengan jaringan telepon menggunakan

kabel

(nirkabel;

wireless

). Saat ini

Indonesia mempunyai dua jaringan telepon nirkabel yaitu sistem

GSM

(

Global

System for Mobile Telecommunications

) dan sistem

CDMA

(

Code Division

Multiple Access

).

2.3

Bagan Alir (Flowchart)

Flowchart

adalah gambaran dalam bentuk diagram alir dari algoritma-algoritma

dalam suatu program, yang menyatakan arah alur program tersebut. Berikut

adalah beberapa simbol yang digunakan dalam menggambar suatu

flowchart

:

Tabel 2.1 Tabel Simbol-Simbol Data Flow Diagram

SIMBOL

NAMA

FUNGSI

TERMINATOR

Permulaan/akhir program

GARIS ALIR

(FLOW LINE)

Arah aliran program

PREPARATION

Proses inisialisasi/pemberian harga

awal

PROSES

Proses perhitungan/proses pengolahan

INPUT/OUTPUT

DATA

Proses input/output data, parameter,

informasi

PREDEFINED

PROCESS

(SUB PROGRAM)

Permulaan sub program/proses

menjalankan sub program

DECISION

Perbandingan pernyataan, penyeleksian

data yang memberikan pilihan untuk

langkah selanjutnya

ON PAGE

CONNECTOR

Penghubung bagian-bagian flowchart

yang berada pada satu halaman

OFF PAGE

CONNECTOR

Penghubung bagian-bagian flowchart

yang berada pada halaman berbeda

DOCUMENT

Simbol dokumen merupakan symbol

untuk menunjukkan data yang

berbentuk kertas maupun informasi

LINE

CONNECTOR

Arus/flow dari prosedur yang dapat

dilakukan dari atas kebawah, dari

bawah ke atas, dan dari kiri ke kanan

2.4

Entity Diagram Realtionship (ERD)

ERD merupakan suatu model untuk menjelaskan hubungan antar data dalam basis

data berdasarkan objek-objek dasar data yang mempunyai hubungan antar relasi

.

ERD

untuk memodelkan struktur data dan hubungan antar data, untuk

menggambarkannya digunakan beberapa notasi dan simbol.

Tabel 2.2 Tabel Simbol-Simbol Entity Diagram Realtionship

SIMBOL

NAMA

FUNGSI

Entitas

(Entity)

Entitas merupakan objek yang mewakili

sesuatu yang nyata dan dapat dibedakan

dari sesuatu yang lain.

Atribut

(Attribute)

Atribut berfungsi untuk mendeskripsikan

karakteristik dari entitas tersebut. Isi dari

atribut mempunyai sesuatu yang dapat

mengidentifikasikan isi elemen satu

dengan yang lain.

Hubungan

(Relationship)

Hubungan antara sejumlah entitas yang

berasal dari himpunan entitas yang

berbeda.

2.5

HTML

HTML singkatan dari

Hyper Text Markup Language

adalah file teks atau file

ASCII yang berisi instruksi/

script

kepada web browser untuk menampilkan suatu

tampilan grafis dari sebuah halaman web. HTML adalah sebuah standar yang

digunakan secara luas untuk menampilkan halaman web. HTML saat ini

merupakan standari

internet

yang didefinisikan dan dikendalikan penggunaannya

oleh

World Wide Web Consortium

(W3C).

HTML merupakan bahasa pemrograman

fleksible

di mana kita bisa

meletakkan script dari bahasa pmrograman lain seperti

Java, Visual Basic,

dan

lain-lain. Jika HTML tersebut tidak dapat mendukung suatu perintah

pemrograman tertentu, browser tidak menampilkan kotak dialog

“Syntax Error”

jika ada penulisan kode yang keliru pada

script

HTML sepanjang kode-kode yang

kita tuliskan merupakan kode-kode HTML tanpa penambahan kode-kodedari luar

seperti

Java

. Oleh karena itu, jika terjadi

syntax error

pada

script

HTML efek

yang paling jelas adalah HTML tersebut tidak akan ditampilkan pada jendela

browser.

File HTML dapat dibuat dengan aplikasi

text editor

apapun di sistem

operasi apapun, antara lain : Notepad di Windows, emasc atau vi di Unix atau

SimpleText di Macintosh. File HTML ini juga bisa dibuat di aplikasi word

processor apapun asalkan saat menyimpan file tersebut disimpan dengan

format

text-only

.

Salah satu kelebihan file HTML adalah

cross platform

, artinya file HTML

dapat ditampilkan di beberapa

Operating System

(OS) yang berbeda dan memiliki

tampilan yang sama walaupun saat pembuatannya menggunakan satu OS tertentu

saja.

2.5.1 Kelebihan dan Kekurangan HTML

1.

Kelebihan-kelebihan HTML, antara lain:

a.

Merupakan bahasa penkodean yang lintas

platform

(

cross platform

),

maksudnya HTML dapat digunakan pada berbagai jenis mesin komputer

yang berbeda dan berbagai macam sistem operasi yang berbeda. Jadi

bersifat fleksibel karena ditulis cukup dengan menggunakan

editor

karakter ASCII.

b.

Dapat disisipi gambar baik gambar statis atau dinamis (animasi) termasuk

menggunakan gambar untuk dijadikan

hyperlink

. Gambar di sini

digunakan untuk merujuk pada suatu halaman web, dimana setiap

titik-titik yang sudah didefinisikan berupa

rectangular

(kotak),

poligon

(kurva

tak beraturan) atau lingkaran digunakan untuk

jump

ke halaman lain, atau

link ke halaman di luar web yang bersangkutan.

c.

Dapat disisipi animasi berupa Java Applet atau file-file animasi dari

Macromedia Flash atau Macromedia Shockwave (untuk keperluan ini,

browser harus memiliki

plug-in

khusus untuk menjalankan file-file

animasi ini).

d.

Dapat disisipi bahasa pemrograman untuk mempercantik halaman web

seperti Javascript, VBScript, Active Server Pages, Perl, Tcl, PHP dan

sebagainya.

e.

Bukan merupakan bahasa pemrograman jadi tidak memerlukan kompiler.

Cara menjalankannya cukup dengan menggunakan browser.

2.

Adapun kekurangan dari HTML antara lain :

a.

Menghasilkan halaman yang statis.

b.

Memiliki tag-tag yang banyak sehingga susah dipelajari untuk pemula.

c.

Tidak dapat menghasilkan halaman yang interaktif. Interaktif di sini

maksudnya

client

dapat berinteraksi dengan server. Untuk keperluan itu,

HTML harus disisipi bahasa pemrograman yang dapat menangani hal

tersebut, contohnya Perl atau Tcl.

2.5.2 Refensi HTML

Berikut ini adalah referensi dalam dokumen HTML:

1.

DOCTYPE

Penjelasan versi dari dokumen HTML tersebut yang ditulis pada bagian

atas pada editor-editor tertentu seperti DREAMWEAVER CS5 yang

menjelaskan tentang DTD (

Document Type Defenition

).

2.

Komentar

Menuliskan suatu komentar pada dokumen HTML seperti keterangan

elemen dan tag-tag dan lain-lain. Keterangan ini akan diabaikan oleh

browser

.

Tabel 2.3 Tabel Refensi Tag HTML

TAG

KETERANGAN

<!--...-->

Mendefinisikan komentar HTML

<!DOCTYPE> Mendefinisikan tipe dokumen

<a>

Mendefinisikan anchor link

<acronym>

Mendefinisikan akronim

<address>

Mendefiniskan informasi kontak untuk pemiliki / penulis

dokumen

<area />

Mendefinisikan arae di dalam image-map

<b>

Mendefinisikan tulisan tebal

<base />

Mendefinisikan URL utama/target untuk semua URL

alternatif di dalam dokumen

<bdo>

Menggantikan arah tulisan

<big>

Mendefinisikan tulisan besar

<blockquote>

Mendefinisikan kutipan yang panjang

<body>

Mendefinisikan badan dokumen

<br />

Mendefinisikan satu baris baru

<button>

Mendefinisikan tombol yang bisa di-klik

<caption>

Mendefinisikan judul dari tabel

<center>

Mendefinisikan tulisan agar ditengah

<cite>

Mendefinisikan kutipan

<code>

Mendefinisikan kode komputer

<col />

Mendefinisikan nilai atribut dari satu atau lebih kolom pada

tabel

<colgroup>

Merincikan sebuah grup atau lebih dari kolom-kolom dalam

tabel untuk di format

<dd>

Mendefinisikan deskripsi dari sebuah item di daftar definisi

<del>

Mendefinisikan penghapusan sebuah bagian dalam

dokumen

<dfn>

Mendefinisikan ketentuan definisi

<div>

Mendefinisikan sebuah bagian di dalam sebuah dokumen

<dl>

Mendefinisikan daftar definisi

<dt>

Mendefinisikan ketentuan (dari sebuah item) di dalam daftar

definisi

<em>

Mendefinisikan tulisan emphasized

<fieldset>

Menggabungkan elemen-elemen yang saling berhubungan

di dalam form

<form>

Mendefinisikan sebuah form HTML

<frame />

Mendefinisikan sebuah frame

<frameset>

Mendefinisikan satu set frame

<h1> to <h6>

Mendefinisikan kepala dari HTML

<head>

Mendefinisikan informasi mengenai sebuah dokumen

<hr />

Mendefinisikan garis horisontal

<i>

Mendefinisikan tulisan italic

<iframe>

Mendefinisikan inline frame

<img />

Mendefinisikan gambar

<input />

Mendefinisikan kontrol input

<ins>

Mendefinisikan tulisan yang telah dimasukkan ke dalam

dokumen

<kbd>

Mendefinisikan input keyboard

<label>

Mendefinisikan label dari elemen <input>

<legend>

Mendefinisikan Judul dari sebuah elemen <fieldset>

<li>

Mendefinisikan daftar item

<link />

Mendefinisikan hubungan antara dokumen dari sumber

diluar dokumen

<map>

Mendefinisikan sebuah image-map

<meta />

Mendefinisikan metada mengenai sebuah dokumen HTML

<noframes>

Mendefinisikan konten alternatif untuk user yang tidak

mendukung frame

<noscript>

Mendefinisikan konten alternatif untuk user yang tidak

mendukung skrip client-side

<object>

Mendefinisikan obyek yang tertanam / embedded

<ol>

Mendefinisikan urutan teratur

<option>

Mendefinisikan pilihan dalam a drop-down list

<p>

Mendefinisikan paragraf

<param />

Mendefinisikan parameter dari sebuah obyek

<pre>

Mendefinisikan tulisan yang belum di format

<q>

Mendefinisikan kutipan pendek

<s>

Mendefinisikan tulisan strikethrough

<samp>

Mendefinisikan contoh dari output program komputer

<script>

Mendefinisikan client-side script

<select>

Mendefinisikan drop-down list

<small>

Mendefinisikan tulisan yang lebih kecil

<span>

Mendefinisikan sebuah bagian dari dokumen

<strong>

Mendefinisikan tulisan strong

<style>

Mendefinisikan informasi style dari dokumen

<sub>

Mendefinisikan tulisan subscripted

<sup>

Mendefinisikan tulisan superscripted

<table>

Mendefinisikan tabel

<tbody>

Menggabungkan isi dari badan tabel

<td>

Mendefinisikan kolom dari tabel

<textarea>

Mendefinisikan kontrol dari banyak baris input (text area)

<tfoot>

Menggabungkan footer menjadi satu grup pada tabel

<th>

Mendefinisikan header dari tabel

<thead>

Mendefinisikan Grup header dari tabel

<title>

Mendefinisikan Judul dari sebuah dokumen

<tr>

Mendefinisikan baris dari tabel

<tt>

Mendefinisikan tulisan teletype

<u>

Mendefinisikan tulisan garis bawah / underline

<ul>

Mendefinisikan urutan acak

<var>

Mendefinisikan variabel

2.6

WWW (World Wide Web)

World Wide Web

(biasa disingkat WWW) atau web adalah salah satu dari sekian

banyak layanan yang ada di internet. Layanan ini paling banyak digunakan di

internet untuk menyampaikan informasi karena sifatnya mendukung multimedia.

Artinya informasi tidak hanya disampaikan melalui teks, tapi juga gambar, video

dan suara. Beberapa Jenis Web:

1.

Web Server

adalah komputer yang tergabung dalam jaringan atau internet

yang memberikan informasi.

2.

Web client

adalah komputer yang tergabung dalam jaringan atau internet yang

meminta informasi. Untuk dapat mengakses web server, web client

menggunakan aplikasi yang disebut

Web browser.

Web browser

meminta dan

menerima data dari web server melalui suatu protokol yang disebut

http

(hypertext tranfer protocol).

Protokol ini bertugas untuk mengirimkan

perintah dari web browser ke web server serta mengirimkan file/data dari web

server ke web browser. File yang dikirim dalam layanan web ini berekstensi

*.htm atau *.html. HTML merupakan singkatan dari hypertext markup

language, yaitu satu bahasa yang digunakan untuk mendefinisikan susunan

informasi dalam file hypertext. Hypertext sendiri adalah suatu struktur

pemyampaian informasi dimana satu atau beberapa kata pada suatu file dapat

di link untuk mengeluarkan file baru yang biasanya berisi informasi detail

tentang kata tersebut.

2.7

Pengenalan PHP

Pada awalnya PHP merupakan kependekan dari

Personal Home Page

(Situs

personal). PHP pertama kali dibuat oleh

Rasmus Lerdorf

pada tahun

1995

. Pada

waktu itu PHP masih bernama

Form Interpreted

(FI), yang wujudnya berupa

sekumpulan skrip yang digunakan untuk mengolah data formulir dari

web

. Pada

tahun 1997, sebuah perusahaan bernama

Zend

menulis ulang interpreter PHP

menjadi lebih bersih, lebih baik, dan lebih cepat.

Kemudian pada Juni 1998, perusahaan tersebut merilis interpreter baru

untuk PHP dan meresmikan rilis tersebut sebagai

PHP 3.0

dan singkatan PHP

diubah menjadi

akronim berulang

PHP: Hypertext Preprocessing

.

PHP

merupakan bahasa standar yang digunakan dalam dunia

website

yang berbentuk

script

dan diletakkan dalam

web server .

Web server

adalah sebuah bentuk

server

yang khusus digunakan untuk

menyimpan halaman

website

atau

homepage

. Rasmus Lerdorf merupakan seorang

programmer

yang menciptakan PHP pada tahun 1994. PHP terus mengalami

perkembangan dan perubahan hingga saat ini dalam berbagai versi.

bahasa PHP akan dieksekusi di server, sehingga yang dikirimkan ke browser

adalah hasil jadi dalam bentuk HTML, dan kode PHP tidak akan terlihat.

2.7.1

Kelebihan dan Kelemahan PHP

Beberapa keunggulan yang dimiliki program PHP adalah sebagai berikut:

1.

PHP mempunyai tingkat akses yang lebih cepat

2.

PHP memiliki tingkat

lyfe cycle

yang cepat sehingga selalu mengikuti

perkembangan teknologi internet

3.

PHP mampu berjalan di

platform

linux dan juga Windows

4.

PHP juga mendukung akses ke beberapa database yang sudah ada, antara

lain

MySQL, Microsoft SQL Server, PostgressSQL

dan sebagainya

5.

PHP bersifat gratis (

free).

6.

PHP merupakan bahasa yang dapat diletakkan dalam tag HTML.

Adapun kelemahan PHP adalah:

1.

Tidak ideal untuk pengembangan skala besar

2.

Tidak bisa memisahkan antara tampilan dengan logik dengan baik (walau

penggunaan

template

dapat memperbaikinya).

3.

PHP memiliki kelemahan

security

tertentu apabila programmer tidak jeli

dalam melakukan pemrograman dan kurang jeli memperhatikan isu dan

konfigurasi PHP.

2.7.2

Konsep Dasar PHP

Kode PHP diawali dengan tanda lebih kecil (<) dan diakhiri dengan tanda lebih

besar (>). Ada tiga cara untuk menuliskan script PHP yaitu :

1.

<?

script PHP

?>

2.

<?php

Script PHP

?>

3.

<SCRIPT LANGUAGE=”php”>

Script php

</script>

Pemisah antar instruksi adalah tanda titik koma (;). Untuk membuat atau

menambahkan komentar, standar penulisan adalah /*komentar*/, //komentar dan

#komentar. Untuk menuliskan

script

PHP, ada dua cara yang sering digunakan

yaitu

Embedded Script

dan

Non-Embedded Script

.

a.

Embedded Script

Embedded Script

yaitu

script

PHP yang disisipkan diantara tag-tag HTML.

Contoh:

<html>

<head>

</head>

<body>

<?php

Echo “Hallo, selamat menggunakan PHP”;

?>

</body>

</html>

b.

Non-Embedded Script

Non-Embedded Script adalah script program PHP murni. Termasuk tag

HTML yang disisipkan dalam script PHP.

Contoh:

<?php

echo “<html>”;

echo “<head>”;

echo “<title>Mengenal PHP</title>”;

echo “</head>”;

echo “<body>”;

echo “<p>PHP cukup jitu</p>’;

echo “</body>”;

echo “</html>”;

?>

Variabel adalah sebuah wadah yang menampung nilai-nilai tertentu. Variabel

dapat dikatakan sebagai inti dari sebuah bahasa pemograman. Karena melalui

variabel inilah kita memanipulasi data inputan agar menjadi nilai yang diinginkan.

PHP mendukung berbagai jenis variabel yaitu:

1.

Integer

(bilangan bulat)

2.

Floating Point

(presisi tunggal, ganda)

3.

Boolean

4.

Null

(untuk variabel yang belum diset)

5.

String

6.

Array

7.

Object

8.

Resource

Cara pendeklarasian variabel PHP memiliki aturan sebagai berikut :

1.

Deklarasi variabel dimulai dengan menggunakan tanda $.

2.

Nama variabel php hanya dapat berupa angka, huruf, dan tanda underscore

(_).

3.

Nama variabel hanya dapat dimulai dengan huruf, dan karakter

underscore. Contoh nama variabel yang valid : $aku, $_aku. Contoh nama

variabel yang tidak valid $123, $aku+123, $+123.

4.

Deklarasi variabel PHP bersifat case sensitive, yang artinya penulisan

menggunakan huruf besar dan huruf kecil dibedakan. Contoh $aku dan

$Aku dianggap oleh PHP sebagai dua variabel yang berbeda.

2.7.4 Operator pada PHP

Dalam bahasa pemrograman secara umum, operator digunakan untuk

memanipulasi atau melakukan proses perhitungan pada suatu nilai variabel.

Variable yang nilainya dimodifikasi oleh operator disebut

operand

. Berikut adalah

jenis-jenis operator pada PHP.

1.

Operator Aritmatika

Merupakan operator matematika yang sering digunakan dalam operasi

matematika. Berikut ini adalah tabel daftar dari operator Aritmatika.

Tabel 2.4 Operator Aritmatika pada PHP

Operator

Operasi / Fungsi

+

Penjumlahan

-

Pengurangan

*

Perkalian

/

Pembagian

%

Modulo

++

Increment

--

Decrement

2.

Operator Penegasan

Merupakan operator yang digunakan untuk memberi nilai ke suatu variabel

ke variabel lain. Simbol operator ini adalah (=). Berikut ini adalah daftar tabel

dari operator penegasan.

Operator

Operasi / Fungsi

Contoh

+=

Menambahkan nilai di kiri dengan nilai di kanan

x += 2;

x=x+2;

-=

Mengurangi nilai di kiri dengan nilai di kanan

x -= 2;

x = x-2;

.=

Melakukan concatenation / operasi gabungan antara

nilai di kiri dengan nilai di kanan

x .= “maya”;

x=x. “maya”;

/=

Membagi nilai di kiri dengan nilai di kanan

x /= 2;

x =x/2;

%=

Sisa hasil bagi antara nilai di kiri dengan nilai di

kanan

x %=2;

x = x%2;

|=

Melakukan operasi OR antara nilai di kiri dengan

nilai di kanan

x != 2;

x = x!2;

^=

Melakukan operasi XOR antara nilai dikiri dengan

nilai di kanan

x ^= 2;

x = x^2;

3. Operator Perbandingan / Relasional

Operator ini digunakan untuk melakukan perbandingan antara dua buah

operand dan menghasilkan nilai TRUE

&

FALSE. Adapun tabel daftar

operator perbandingan adalah sebagai berikut:

Tabel 2.6 Operator Perbandingan pada PHP

Operator

Operasi / Fungsi

= =

Sama Dengan

= = =

Identik

! = atau < >

Tidak Sama Dengan

! = =

Tidak Identik

<

Kurang Dari

>

Lebih Dari

< =

Kurang Dari atau Sama Dengan

> =

Lebih Dari atau Sama Dengan

4.

Operator Logika

Operator ini Biasanya digunakan untuk menggabungkan kondisi berganda

&

menghasilkan sebuah ekspresi bernilai TRUE

&

FALSE. Adapun tabel daftar

operator logika pada PHP adalah sebagai berikut:

Tabel 2.7 Operator Logika pada PHP

Operator

Operasi / Fungsi

AND

Melakukan operasi AND dimana semua kondisi harus

bernilai TRUE.

|| atau OR

Melakukan operasi OR dimana salah satu kondisi bernilai

TRUE.

XOR

Melakukan operasi XOR.

!

Melakukan operasi NOT dimana jika nilai A adalah TRUE,

maka akan menjadi FALSE.

2.8

Pengenalan XAMPP

XAMPP yaitu sebuah aplikasi yang dapat merangkum beberapa aplikasi

server

sekaligus. Fungsinya adalah sebagai

server

yang berdiri sendiri

(

localhost

)

, yang

terdiri atas program

Apache HTTP Server

,

MySQL database

, dan

penerjemah bahasa

yang ditulis dengan

bahasa pemrogramanPHP

dan

Perl

. Nama XAMPP merupakan

singkatan dari X (empat sistem operasi apapun),

Apache

,

MySQL

,

PHP

dan

Perl

.

Untuk mendapatkanya dapat men

download

langsung dari situs

www.xampp.org

secara gratis.

Bagian Pent ing

XAMPP yang biasa digunakan pada umumnya:

1.

htdoc

adalah folder tempat meletakkan berkas-berkas yang akan dijalankan,

seperti berkas

PHP, HTML

dan skrip lain.

2.

phpMyAdmin

merupakan bagian untuk mengelola basis data

MySQL

yang ada

dikomputer. Untuk membukanya, buka browser lalu ketikkan alamat

http://localhost/phpMyAdmin, maka akan muncul halaman

phpMyAdmin.

3.

control panel

yang berfungsi untuk mengelola layanan (

service

) XAMPP.

Seperti menghentikan (

stop

) layanan, ataupun memulai (

start

).

2.9

Pengenalan MySQL

MySQL

adalah salah satu jenis

database server

yang sangat terkenal.

Kepopulerannya disebabkan

MySQL

menggunakan SQL sebagai bahasa dasar

untuk mengakses databasenya.

MySQL

termasuk jenis RDBMS

(Relational

Database Management System).

Pada

MySQL

, sebuah database mengandung satu

atau sejumlah tabel. Tabel terdiri atas sejumlah baris dan setiap baris mengandung

satu atau beberapa kolom. Untuk mengelola database

MySQL

ada beberapa cara

yaitu melalui

prompt

DOS

(tool command line)

dan dapat juga menggunakan

program utility

seperti:

1. PHP

MyAdmin

2. MySQLGUI

3. MySQL

Manager Java Based

4. MySQL

Administrator for windows.

2.9.1 Kelebihan MySQL

Kelebihan

MySQL

adalah menggunakan bahasa

query

standar yang dimiliki SQL.

SQL adalah suatu bahasa permintaan yang terstruktur dan yang telah di

standarkan untuk semua program pengakses

database

seperti

Oracle,

PostgressSQl, Microsoft SQL Server

dan sebagainya. Adapun yang menjadi

kelebihan MySQL dari program

database

lain:

1.

Kecepatan mengakses

database

sebanding

database

lainnya.

2.

Perintah yang digunakan pada

MySQL

adalah standar SQL yang mudah

diingat dalam proses instalasinya relative mudah.

3.

Sifatnya

open source,

siapapun dapat mengembangkan

MySQL

dan hasil

pengembangan tersebut diserahkan kepada umum atau komunitas

open

source.

4.

Kapabililtas,

MySQL

mampu mengelola

database

untuk 60 ribu table

dengan jumlah baris 5 Milyar.

5.

Replikasi data, memiliki beberapa

database

bayangan pada beberapa

server lainnya yang berasal dari

database

induk, sehingga akan

meningkatkan kinerja dan kecepatan.

6.

Konektivitas dan keamanan,

MySQL

mendukung dan menerapkan sistem

keamanan dan izin akses tingkat tinggi.

7.

Fleksibilitas, mendukung perintah ANSI SQL 99 dan beberapa perintah

database

alternatif lainnya sehingga memudahkan untuk beralih ke

MySQL.

8.

Dapat dijalankan pada beberapa sistem operasi yang berbeda seperti linux,

windows, machintos, solaris, dan sebagainya.

9.

Biaya rendah (relative gratis).

2.10

CSS ( Cascading Style Sheet)

CSS banyak digunakan untuk memperluas kemampuan HTML dalam memformat

dokumen

web

atau untuk mempercantik tampilan

web

, bahkan untuk pemosisian

dan

layout

halaman

web.

Dengan mendefenisikan suatu

style

sekali saja, itu akan

dapat digunakan berulang kali.

CSS telah didukung oleh kebanyakan

browser

, terutama versi baru

sehingga penempatan

layout

menjadi lebih fleksibel. Membuat HTML

menggunakan

tag

minimal berpengaruh terhadap ukuran file, dapat menampilkan

konten utama terlebih dahulu sementara gambar dan yang lain dapat ditampilkan

sesudahnya. Selain itu penggunaan file CSS secara terpisah dapat mempermudah

pengubahan tampilan situs secara keseluruhan.

2.11

Pengenalan Adobe Dreamweaver CS5.5

Adobe Dreamweaver

merupakan

program penyunting halaman web

keluaran

Adobe Systems

yang dulu dikenal sebagai

Macromedia Dreamweaver

keluaran

Macromedia

. Program ini banyak digunakan oleh pengembang web karena

fitur-fiturnya yang menarik dan kemudahan penggunaannya. Versi terakhir

Macromedia Dreamweaver

sebelum

Macromedia

dibeli oleh

Adobe Systems

yaitu

versi 8. Versi terakhir

Dreamweaver

keluaran

Adobe Systems

adalah versi 12 yang

ada dalam

Adobe Creative Cloud

(sering disingkat

Adobe Cc

).

Dreamweaver

dapat menggunakan ekstensi dari pihak ketiga untuk

memperpanjang fungsionalitas inti dari aplikasi, yang setiap pengembang web

bisa menulis (sebagian besar dalam

HTML

dan

JavaScript

).

Dreamweaver

didukung oleh komunitas besar pengembang ekstensi yang membuat ekstensi

yang tersedia (baik komersial maupun yang gratis) untuk pengembangan web dari

efek

rollover

sederhana sampai

full-featured shopping cart.

Dreamweaver

, seperti

editor

HTML

lainnya, edit file secara lokal kemudian

di

upload

ke

web server remote

menggunakan

FTP

,

SFTP

, atau

WebDAV

.

Komponen-komponen yang terdapat pada ruang kerja Adobe Dreamweaver CS5.5

adalah:

Gambar 2.1 Tampilan awal pada Adobe Dreamweaver CS5.5

Gambar 2.2 Tampilan ruang kerja pada Adobe Dreamweaver CS5.5

1.

Properties Bar

Merupakan sekumpulan menu untuk menampilkan menu-menu

toolbar

yang akan

digunakan sesuai dengan kebutuhan serta mengatur tampilan dokumen dan fungsi

lainya.

2.

Dokumen Toolbar

Bagian yang berfungsi menampilkan dokumen yang dibuat. Bagian ini tedapat 3

tab yang membantu dalam mendesain web, yaitu

Code, Split

, dan

Design

.

3.

Dokumen Windows

Bagian ini merupakan jendela dokumen untuk meletakan objek perancang web.

Jendela kerja dokumen terdiri atas layar kerja serta fasilitasnya.

4.

Properti Inspektor

Merupakan tab untuk mengatur propertis dari objek yang digunakan seperti

mengatur font, warna dan ukuran dari teks dan lain sebagainya.

5.

Panel Group

Kumpulan panel pelengkap untuk mengorganisir, mengatur

website

. Contohnya

Panel CSS

yang berfungsi untuk mempercantik tampilan web yang dibuat. Pada

6.

Search & CS Live

Search

merupakan

toolbar

pencarian informasi yang menuju kotak dialog

Adobe

Communiti Help

. Sedangkan

CS Live

merupakan kumpulan menu terbaru

BAB 3

PERANCANGAN SISTEM

3.1

Perancangan Sistem

Perancangan sistem adalah tahap setelah analisis dari siklus pengembangan sistem;

pendefenisian dari kebutuhan-kebutuhan fungsional, persiapan untuk merancang

implementasi, menggambarkan bagaimana suatu sistem di bentuk yang dapat berupa

penggmabaran, perancangan dan pembuatan sketsa atau pengaturan dari beberapa

elemen yang terpisah ke dalam satu kesatuan yang utuh dan berfungsi

mengkonfigurasikan perangkat lunak dan perangkat keras dari suatu sistem.

3.2

Metode Pengembangan Sistem

Dalam pembuatan tugas akhir ini, penulis menggunakan metode yang terdiri dari:

1.

Studi kelayakan yaitu mengidentifikasikan apakah sistem informasi yang akan di

Universitas Sumatera Utara

2.

Rencana pendahuluan yaitu menentukan lingkup sistem yang akan ditangani.

3.

Analisis sistem yaitu penguraian dari suatu sistem informasi yang utuh ke dalam

bagian-bagian komponennya dengan maksud untuk mengidentifikasikan dan

mengevaluasi permasalahan-permasalahan, kesempatan-kesempatan,

hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat

diusulkan perbaikan-perbaikan.

4.

Perancangan sistem yaitu pendefenisian dari kebutuhan-kebutuhan fungsional,

persiapan untuk merancang bangun implementasi, menggambarkan bagaimana

suatu sistem dibentuk serta mengkonfigurasikan komponen-komponen perangkat

lunak dan perangkat keras dari sistem.

3.3

Data Flow Diagram

(DFD)

Data Flow Diagram

adalah gambaran sistem secara logika. Gambaran ini tidak

tergantung pada perangkat keras, perangkat lunak, struktur data atau organisasi. Pada

tahap analisis, penanganan notasi simbol lingkaran dan anak panah mewakili/

menggambarkan arus data pada perancangan sistem sangat membantu didalam

komunikasi dengan pemakaian sistem menggunakan notasi-notasi ini untuk

menggambarkan arus dari data sistem.

Adapun rancangan diagram konteks dari sistem inventori Toko Cahaya Baru

Ponsel Kota Padangsidimpuan adalah:

Universitas Sumatera Utara

Gambar 3.2 Diagram Alir Level Nol Perancangan Sistem Informasi

3.4

Bagan Alir

(Flowchart)

3.4.1

Flowchart Login Admin

Gambar 3.3

Flowchart login

admin

3.4.2

Flowchart

Halaman Utama

Setelah berhasil melakukan

login

, admin akan dapat melihat halaman utama. Pada

halaman ini terdapat menu penjualan, pembelian, persediaan data barang pada toko.

Flowchart

dari halaman utama dapat dilihat pada gambar berikut ini:

Universitas Sumatera Utara

Gambar 3.4

Flowchart

halaman utama

3.5

Entity Relationship Diagram

(ERD)

Universitas Sumatera Utara

3.6

Perancangan

Database

Database

adalah kumpulan dari data yang berhubungan antara satu dengan yang

lainnya, tersimpan di perangkat keras komputer dan menggunakan perangkat lunak

untuk memanipulasinya.

Database

merupakan salah satu bagian penting Karena

diperlukan untuk mengelolah sumber informasi. Untuk mengelola sumber informasi

tersebut yang pertama kali di lakukan adalah merancang suatu sistem

database

agar

informasi yang ada pada Toko Cahaya Baru Ponsel Kota Padangsidimpuan dapat

digunakan dengan optimal.

Perancangan struktur

database

adalah untuk menentukan file

database

yang

menggunakan

field

, tipe data dan ukuran data. Ada beberapa alasan yang

menyebabkan

database

tersebut dibutuhkan. Adapun beberapa alasan mengapa

database

tersebut dibutuhkan adalah sebagai berikut:

1.

Database

merupakan salah satu komponen penting dalam sistem informasi,

karena merupakan dasar dalam menyediakan informasi.

2.

Database

dapat menentukan kualitas informasi: akurat, tepat pada waktunya dan

relevan.

3.

Database

dapat mengurangi duplikasi data (

data redundancy

).

4.

Dengan adanya

database

diharapkan hubungan data dapat ditingkatkan (

data

relatibility

).

Berikut tabel-tabel yang ada di dalam

database

perancangan sistem informasi

inventori Toko Cahaya Baru Ponsel Kota Padangsidimpuan ini:

Tabel 3.1 Tabel

Login Admin

Nama Field

Tipe Data

Ukuran

Keterangan

ID

varchar

10

ID admin / operator

Password

varchar

10

Password admin / operator

Tabel 3.2 Tabel Penjualan

Nama Field

Tipe Data

Ukuran

Keterangan

no_penjualan

varchar

10

No penjualan

tanggal

date

-

Tanggal

kode_barang

varchar

20

Kode barang

nama_pembeli

varchar

50

Nama pembeli

tipe_hp

varchar

50

Tipe HP

merk_hp

varchar

30

Merk HP

warna

varchar

30

Warna HP

jumlah

int

10

Jumlah

Universitas Sumatera Utara

Tabel 3.3 Tabel Pembelian

Nama Field

Tipe Data

Ukuran

Keterangan

no_pembelian

varchar

10

No pembelian

tanggal

date

-

Tanggal

kode_barang

varchar

20

Kode barang

nama_supplier

varchar

50

Nama supplier / pemasok

tipe_hp

varchar

50

Tipe HP

merk_hp

varchar

30

Merk HP

warna

varchar

30

Warna HP

jumlah

int

10

Jumlah

harga

int

10

Harga per satuan

Tabel 3.4 Tabel Data Barang

Nama Field

Tipe Data

Ukuran

Keterangan

kode_barang

varchar

20

Kode barang

tipe_hp

varchar

50

Tipe HP

merk_hp

varchar

30

Merk HP

warna

varchar

30

Warna HP

jumlah

int

10

Jumlah

BAB 4

IMPLEMENTASI SISTEM

4.1

Pengertian Implementasi Sistem

Implementasi sistem merupakan prosedur yang dilakukan untuk menyelesaikan

desain sistem yang ada di dalam komponen desain sistem yang disetujui dan

menguji, menginstal, dan memulai menggunakan sistem baru atau sistem yang

diperbaiki.

4.2

Tujuan Implementasi Sistem

Adapun tujuan-tujuan dari implementasi sistem, yaitu:

1.

Menyelesaikan rancangan sistem yang telah ditetapkan dan disetujui

sebelumnya.

2.

Memastikan bahwa

user

dapat mengoperasikan dengan mudah sehingga

mendapat informasi yang baik dan jelas.

3.

Menguji sistem secara menyeluruh sehingga dapat memenuhi permintaan

4.

Memastikan bahwa telah berjalan dengan baik dan lancar dengan membuat

rencana, mengontrol dan melakukan instalasi secara benar.

Langkah-langkah dalam implementasi sistem :

1.

Menyelesaikan desain web.

2.

Mendapatkan software dan hardware.

3.

Menulis, menguji, dan mendokumentasikan program komputer.

4.

Menguji sistem.

5.

Mendapatkan persetujuan.

4.3

Komponen Utama dalam Implementasi Sistem

Dalam pembuatan program system informasi dan pengolahan data dalam system

yang terkomputerisasi membutuhkan perangkat keras (

hardware

), perangkat lunak

(

software

), dan perangkat operator (

brainware

). Adapun

hardware

,

software,

dan

brainware

yang dibutuhkan adalah sebagai berikut:

1.

Hardware

Hardware

adalah seluruh komponen yang membentuk suatu sistem komputer

dan peralatan lainnya sehingga memungkinkan computer untuk melaksanakan

tugasnya. Dalam menyusun sistem informasi ini, penulis membutuhkan

perangkat keras sebagai berikut :

b.

Harddisk untuk program beroperasi dan sebagai media penyimpanan

data

c.

Memori

d.

Monitor

e.

Kartu VGA

f.

Keyboard

g.

Mouse

, dan lain-lain.

2.

Software

Software

adalah program-program aplikasi yang dibuat untuk menjadi

penerjemah antara perangkat keras dengan pemakai. Tanpa adanya perangkat

lunak, maka pemakai dan perangkat keras tidak dapat berinteraksi.

Software

yang digunakan adalah sebagai berikut:

a.

Sistem Operasi Windows 7.

b.

Bahasa pemrograman PHP dan MySQL.

c.

Adobe Dreamweaver CS5.5.

d.

Adobe Photoshop CS3.

e.

XAMPP

f.

Mozilla Firefox sebagai

web browser

.

3.

Brainware

Brainware

merupakan manusia yang menangani fasilitas komputer yang

ada. Faktor manusia yang dimaksud adalah orang-orang yang memiliki

keahlian di bidang komputer dan sangat dibutuhkan. Faktor manusia ini

meliputi:

a.

Analisis sistem

b.

Programmer

c.

Computer operator

d.

Data entry operator

4.4

Pemeliharaan Sistem

Berdasarkan penjelasan dari halaman sebelumnya, diperlukan pemeliharaan

sistem agar sistem tersebut dapat berjalan sebagaimana mestinya. Adapun tujuan

dari pemeliharaan sistem ini adalah sebagai berikut :

1.

Mencegah terjadinya kelainan sistem yang dapat mendatangkan

masalah-masalah baru.

2.

Menggantikan pemeliharaan sistem dengan survei sistem jika modifikasi

yang diminta relative besar.

4.5

Demonstrasi Program

Seluruh program

website

yang telah dibuat dimasukkan ke dalam folder

cahayabaruponsel dan disimpan di direktori C: XAMPP, htdocs. Adapun tampilan

halaman utama setelah diuji di Mozilla Firefox (

web browser

) dengan alamat

http://localhost/cahayabaruponsel

adalah sebagai berikut:

Gambar 4.1 Halaman Utama (index)

Gambar 4.2 Form Menu

4.5.3 Tampilan Halaman Penjualan

Gambar 4.3 Halaman Penjualan

Gambar 4.4 Form Input Data Penjualan

4.5.5 Tampilan Form Edit Data Penjualan

Gambar 4.5 Form Edit Data Penjualan

4.5.6 Tampilan Form Hapus Data Penjualan

4.5.7 Tampilan Halaman Pembelian

Gambar 4.7 Halaman Pembelian

4.5.8 Tampilan Form Input Data Pembelian

4.5.9 Tampilan Form Edit Data Pembelian

Gambar 4.9 Form Edit Data Pembelian

4.5.10 Tampilan Form Hapus Data Pembelian

4.5.11 Tampilan Halaman Persediaan

Gambar 4.11 Form Halaman Persediaan

4.5.12 Tampilan Form Input Data Persediaan

4.5.13 Form Edit Data Persediaan

Gambar 4.13 Form Edit Data Persediaan

4.5.14 Form Hapus Data Persediaan

4.5.15 Tampilan Halaman Cetak Data

</table>

</div> <br />

<input type="submit" value="UPDATE" ></form> <div id="footer">

Designed by MAYA MASYITA K NST D3 TI USU </div>

</body> </html>

22.

proseseditsedia.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>CAHAYA BARU PONSEL</title> </head>

<body> <?php

mysql_connect("localhost","root",""); mysql_select_db("datalogin");

$kodebar=$_POST['kodebarang']; $tipe=$_POST['tipehp'];

$merk=$_POST['merkhp']; $warna=$_POST['warna']; $jumlah=$_POST['jumlah']; $harga=$_POST['harga'];

$query="UPDATE data_barang set

kode_barang='".$kodebar."',tipe_hp='".$tipe."',merk_hp='".$merk."' ,warna='".$warna."',jumlah='".$jumlah."',harga='".$harga."' WHERE kode_barang='".$_GET['kodebarang']."'";

$hasil=mysql_query($query); if($hasil){

header('location:tampilpersediaan.php'); } else {

header('location:inputpersediaan.php'); }

?>

</body> </html>

23.

hapussedia.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>CAHAYA BARU PONSEL</title> </head>

<body> <?php

mysql_connect("localhost","root",""); mysql_select_db("datalogin");

mysql_query("DELETE from data_barang WHERE kode_barang='".$_GET['kodebarang']."'"); echo"Data telah dihapus<br/>

<a href=\"tampilpersediaan.php\">Kembali</a>"; ?>

</body> </html>

24.

tampilpersediaanlaporan.php

<?php

session_start();

if(!isset($_SESSION['id'])){

header('location:index.php'); }

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>CAHAYA BARU PONSEL</title> <script type="text/javascript"> window.print() ;

</script>

<link rel="stylesheet" type="text/css" href="style.css"/> <link rel="shortcut icon" href="images/icon.png" />

</head>

<form method="post" action="tampilpersediaan.php"> <body>

<div id="header">

<img src="images/logo.png" width="1185" height="217" /> </div>

<div id="menu">

<table border="0" bordercolor="#00FF33" align="center"> <td width="200">

<a href="tampilpenjualan.php">LAPORAN PENJUALAN</a></td> <td width="200">

<a href="tampilpembelian.php">LAPORAN PEMBELIAN</a></td> <td width="200">

<a href="tampilpersediaan.php">LAPORAN PERSEDIAAN</a></td> <td width="150">

<a href="logout.php">LOG OUT</a></td> </table></div> <div id="content">

<div id="header">

<h1> DATA PERSEDIAAN BARANG</h1> </div>

<?php

error_reporting(0);

mysql_connect("localhost","root",""); mysql_select_db("datalogin");

$query="select*from data_barang"; $hasil=mysql_query($query);

echo"<table border=3> <tr> <th>Kode Barang</th>

<th>Tipe HP</th> <th>Merk HP</th> <th>Warna</th> <th>Jumlah</th> </tr>";

if($hasil){

while($tampil=mysql_fetch_array($hasil)){ echo"<tr>

<td>".$tampil['kode_barang']."</td> <td>".$tampil['tipe_hp']."</td> <td>".$tampil['merk_hp']."</td> <td>".$tampil['warna']."</td> <td>".$tampil['jumlah']."</td> </tr>";

}} else {

echo"Query Gagal"; }

echo"</table>"; ?>

<br/> </div> <br/> <div id="footer">

Designed by MAYA MASYITA K NST D3 TI USU </div>

</body> </html>

25.

style.css

@charset "utf-8"; /* CSS Document */ body{

background: url(images/backgroundblue.png); background-position:center;

font-family:"Comic Sans MS", cursive font-size:18px;

margin:6%; padding:4px; color:#900; }

#header{

color:#00F;

background-image: url(images/backlogo.jpg); width:1185px;

} #menu{

background:url(images/menu.jpg); width:1185px;

height:30px;

text-align:center; font-weight:600;

font-family:"Arial Black", Gadget, sans-serif; }

#menu a{

text-decoration:none; }

a:hover{

background:#FF3; color:#F00; }

#runtext{

color:#00F; font-size:28px;

font-family:Georgia, "Times New Roman", Times, serif; }

#contentindex{

background:url(images/grasscopy.jpg); width:1185px;

height:500px; }

#contentlogin{

background:url(images/backgroundlogin.png); width:400px;

height:300px; font-size:24px; }

#content{

background:url(images/cotton_candy_color_background_by_mimig astory-d4wjpfb.png);

width:1185px; }

#contenthome{

background: url(images/grasscopysay.jpg); width:1185px;

height:500px; }

#contentinput{

background: url(images/preview010.png); width:1185px;

height:350px; }

#contenteditsedia{

background: url(images/5814830959_ab997f2ec8.jpg); width:1185px;

height:300px; }

#footer{

margin-top:4%; font-size:18px; color:#F00; }

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 Mahasiswa

: MAYA MASYITA K NST

Nomor Induk Mahasiswa

: 112406042

Program Studi

: Diploma (D3) Teknik Informatika

Judul

: Perancangan Sistem Informasi berbasis Web pada

Toko Cahaya Baru Ponsel Kota Padangsidimpuan

Dosen Pembimbing

: Drs. Ujian Sinulingga, M.Si

Tanggal Mulai Bimbingan : Februari 2014

Tanggal Selesai Bimbingan :

Juni 2014

Diketahui

Disetujui,

Program Studi D3 Teknik Informatika

Pembimbing Utama/

FMIPA USU

Penanggung Jawab

Ketua,

Dr. Elly Rosmaini, M.Si

Drs. Ujian Sinulingga, M.Si

SURAT KETERANGAN

Hasil Uji Program Tugas Akhir

Yang bertanda tangan di bawah ini, menerangkan bahwa mahasiswa Tugas Akhir

program Diploma (D3) Teknik Informatika :

Nama Mahasiswa

: MAYA MASYITA K NST

Nomor Induk Mahasiswa

: 112406042

Program Studi

: DIPLOMA (D3) TEKNIK INFORMATIKA

Judul Tugas Akhir

: PERANCANGAN

SISTEM

INFORMASI

BERBASIS WEB PADA TOKO CAHAYA BARU

PONSEL KOTA PADANGSIDIMPUAN

Telah melaksanakan tes program Tugas Akhir mahasiswa tersebut di atas

pada tanggal:

Dengan hasil : Sukses / Gagal

Demikian diterangkan untuk digunakan melengkapi syarat pendaftaran Ujian

Meja Hijau Tugas Akhir mahasiswa bersangkutan di Departemen Matematika FMIPA

USU Medan.

Medan,

Juni 2014

Dosen Pembimbing,

Program Studi D3 Teknik Informatika

Drs. Ujian Sinulingga, M.Si

NIP. 19560303 198403 1 004