surya.docx

8/15/2019 SURYA.docx

http://slidepdf.com/reader/full/suryadocx 1/120

1

PENGEMBANGAN WEB APLIKASI

PADA SMK NEGERI 4 BATAM

SKRIPSI

disusun oleh

Julian Damas Suryawan12.11.!2

J"R"SAN TEKNIK IN#$RMATIKA

SEK$LA% TINGGI MANAJEMEN IN#$RMATIKA DAN K$MP"TER

AMIK$M &$G&AKARTA



2

&$G&AKARTA

2'1

PENGEMBANGAN WEB APLIKASI

PADA SMK NEGERI 4 BATAM

SKRIPSI

Untuk memenuhi sebagian persyaratan

mencapai derajat Sarjana S1

pada jurusan Teknik Informatika

disusun oleh

Julian Damas Suryawan

12.11.!2



2

J"R"SAN TEKNIK IN#$RMATIKA

SEK$LA% TINGGI MANAJEMEN IN#$RMATIKA DAN K$MP"TER

AMIK$M &$G&AKARTA

&$G&AKARTA

2'1

DAFTA ISI

!A"A#A$ %UDU" &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& i

DAFTA ISI &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ii

DAFTA 'A#(A &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& )i

DAFTA TA(*" &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& )ii

(A( I +*$DA!U"UA$

1&1 "atar (elakang #asalah &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 1

1&2 umusan #asalah &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2

1&, (atasan #asalah &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,

1&- Tujuan +enelitian &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,

1&. #anfaat +enelitian &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -

1&/ #etode +enelitian &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -

1&0 Sistematika +enulisan &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /

(A( II "A$DASA$ T*I

2&1 Tinjauan +ustaka &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0

2&2 Dasar Teori &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 1

2&2&1 Definisi Sistem3 Informasi dan Sistem Informasi &&&&&&&&&&&&&&&&&&&& 1



,

2&2&1&1 Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 1

2&2&1&2 Informasi &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 11

2&2&1&, Sistem Informasi &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 12

2&2&2 4arakteristik Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 12

2&2&2&1 4omponen Sistem Informasi &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 1,

2&2&, #odel +roses &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 1-

2&2&,&1 Soft5are De)elopment "ife 6ycle 7SD"68 &&&&&&&&&&&& 1-

2&2&- 4onsep +emodelan Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 1.

2&2&-&1 +ermodelan +roses 7+rocess #odelling8 &&&&&&&&&&&&&&&&& 1/

2&2&-&2 +ermodelan Data 7Data #odelling8 &&&&&&&&&&&&&&&&&&&&&&&&& 10

2&2&-&, Flo5chart Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2

2&2&. 4onsep (asis Data &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 22

2&2&.&1 +engertian (asis Data &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 22

2&2&.&2 4omponen Sistem (asis Data &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2,

(A( III A$A"ISIS DA$ +*A$6A$'A$

,&1 Tinjauan Umum &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2.

,&1&1 Tentang S#4$ - (atam &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2.

,&1&2 9isi3 #isi dan Tujuan &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2.

,&1&, Struktur rganisasi &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 20

,&2 Analisis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2:

,&2&1 Analisis +I*6*S &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2:



-

,&2&1&1 Analisis Performance &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2:

,&2&1&2 Analisis Information &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2;

,&2&1&, Analisis Economy &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,

,&2&1&- Analisis Control &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,1

,&2&1&. Analisis Eficiency &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,1

,&2&1&/ Analisis Services &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,2

,&2&2 Analisis 4ebutuhan &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,,

,&2&2&1 Analisis 4ebutuhan Fungsional &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,,

,&2&2&2 Analisis 4ebutuhan $on<Fungsional &&&&&&&&&&&&&&&&&&&&&&& ,.

,&2&2&, Analisis 4ebutuhan (iaya &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,0

,&, +erancangan Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,:

,&,&1 +emodelan Data &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,:

,&,&1&1 *ntity elationship Diagram &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,:

,&,&1&2 elasi Antar Tabel &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,;

,&,&2 +emodelan +roses &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -

,&,&2&1 Data Flo5 Diagram 7DFD8 &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -

,&,&, +erancangan Tampilan &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -:

(A( I9 I#+"*#*$TASI DA$ +*#(A!ASA$

-&1 Implementasi +erancangan Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .-

-&1&1 +embuatan Database &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .-

-&1&1&1 #enjalankan 5ebser)er local dan database local &&&& .-



.

-&1&1&2 +embuatan Database3 Tabel beserta Atributnya &&&&&&& ..

-&1&2 4oneksi +ada Database &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /2

-&1&, "isting +rogram &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /2

-&1&,&1 "isting +rogram +ada !alaman Admin &&&&&&&&&&&&&&&&&&& /2

-&1&,&2 "isting +rogram +ada !alaman Utama =ebsite &&&&&& /:

-&2 Implementasi Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0.

-&2&1 Uji 6oba Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0.

-&2&2 #anual Sistem &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0/

(A( 9 4*SI#+U"A$ DA$ SAA$

.&1 4esimpulan &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ;1

.&2 Saran &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ;1

DAFTA +USTA4A && &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ;2

DA#TAR TABEL

Tabel 2&1 Tabel +erbedaan +enelitian &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :

Tabel 2&2 *lemen > elemen dari DFD dan Simbolnya &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 10

Tabel 2&, *lemen > elemen dari *D &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 1:

Tabel 2&- Simbol > simbol Flo5chart Standar &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 21

Tabel ,&1 Analisis +erformance &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 2;

Tabel ,&2 Analisis Information &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,

Tabel ,&, Analisis *conomy &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ,



0

'ambar ,&12 DFD "e)el 2 +roses lah Data #apel &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -.

'ambar ,&1, DFD "e)el 2 +roses lah Data #ateri &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -.

'ambar ,&1- DFD "e)el 2 +roses lah DataTugas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -/

'ambar ,&1. DFD "e)el 2 +roses lah Data Album &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -/

'ambar ,&1/ DFD "e)el 2 +roses lah Data 'allery &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -0

'ambar ,&10 DFD "e)el 2 +roses lah Data !alstatis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -0

'ambar ,&1: Tampilan "ogin &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -:

'ambar ,&1; !alaman Utama =ebsite &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -:

'ambar ,&2 !alaman Statis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -;

'ambar ,&21 !alaman (erita3 Informasi dan Agenda &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& -;

'ambar ,&22 !alaman Daftar 'uru &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .

'ambar ,&2, !alaman Daftar Sis5a &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .

'ambar ,&2- !alaman 'allery &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .1

'ambar ,&2. !alaman Dashboard &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .1

'ambar ,&2/ Admin Tambah (erita &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .2

'ambar ,&20 Admin Data Album3 4elas dan #ata +elajaran &&&&&&&&&&&&&&&&&&&&&&&&& .2

'ambar ,&2: Admin Tambah 'uru dan Sis5a &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .,

'ambar ,&2; Admin Tambah #ateri dan Tugas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .,

'ambar -&1 Interface @A#++ &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ..

'ambar -&2 Tabel +ada Database smkn-batam &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ./

'ambar -&, Tabel Admin &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ./



:

'ambar -&- Tanel Admin &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .0

'ambar -&. Tabel (erita &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .0

'ambar -&/ Tabel 'allery &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .:

'ambar -&0 Tabel 'uru & &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .:

'ambar -&: Tabel !alstatis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .;

'ambar -&; Tabel 4ategori &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .;

'ambar -&1 Tabel 4elas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& .;

'ambar -&11 Tabel #apel &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /

'ambar -&12 Tabel #ateri &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /

'ambar -&1, Tabel Sis5a &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /1

'ambar -&1- Tabel Tugas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /1

'ambar -&1. 4ode +rogram Untuk 4oneksi Database &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /2

'ambar -&1/ 4ode +rogram Auntentikasi "ogin Admin &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /2

'ambar -&10 4ode +rogram #enampilkan Data (erita &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /,

'ambar -&1: 4ode +rogram Tambah (erita &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /,

'ambar -&1; 4ode +rogram Tambah 'uru &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /-

'ambar -&2 4ode +rogram Tambah 4elas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /.

'ambar -&21 4ode +rogram #enampilkan Data 4elas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /.

'ambar -&22 4ode +rogram Tambah #ata +elajaran &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& //

'ambar -&2, 4ode +rogram #enampilkan Data #ata +elajaran &&&&&&&&&&&&&&&&&&& //

'ambar -&2- 4ode +rogram Tambah #ateri &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /0



;

'ambar -&2. 4ode +rogram *dit (erita &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /0

'ambar -&2/ 4ode +rogram !apus Data Sis5a &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /:

'ambar -&20 4ode +rogram Autentikasi "ogin guru &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& /:

'ambar -&2: 4ode +rogram !alaman Utama =ebsite bagian 1 &&&&&&&&&&&&&&&&&&&&& /;

'ambar -&2; 4ode +rogram !alaman Utama =ebsite bagian 2 &&&&&&&&&&&&&&&&&&&&& 0

'ambar -&, 4ode +rogram !alaman Statis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 01

'ambar -&,1 4ode +rogram Tampilan +anel 'uru bagian 1 &&&&&&&&&&&&&&&&&&&&&&&&&& 02

'ambar -&,2 4ode +rogram Tampilan +anel 'uru bagian 2 &&&&&&&&&&&&&&&&&&&&&&&&&& 0,

'ambar -&,, 4ode +rogram Tampilan +anel 'uru bagian , &&&&&&&&&&&&&&&&&&&&&&&&&& 0,

'ambar -&,- 4ode +rogram Tampilan 'allery &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0-

'ambar -&,. !alaman "ogin Admin &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0/

'ambar -&,/ !alaman Tampil (erita &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0/

'ambar -&,0 !alaman Data 'uru &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 00

'ambar -&,: !alaman Data Sis5a &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 00

'ambar -&,; !alaman Data #ateri &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0:

'ambar -&- !alaman Data Tugas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0:

'ambar -&-1 !alaman Data !alaman Statis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0;

'ambar -&-2 !alaman Tambah (erita &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& 0;

'ambar -&-, !alaman Tambah Album &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :

'ambar -&-- !alaman Tambah 'allery &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&:

'ambar -&-. !alaman Tambah !alaman Statis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :1



1

'ambar -&-/ !alaman Tambah 'uru &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :1

'ambar -&-0 !alaman Tambah Data Sis5a &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :2

'ambar -&-: !alaman 4elas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :,

'ambar -&-; !alaman #ata +elajaran &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :,

'ambar -&. !alaman Tambah #ateri &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :-

'ambar -&.1 !alaman Tambah Tugas &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :-

'ambar -&.2 !alaman Utama =ebsite &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :.

'ambar -&., !alaman Statis &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :/

'ambar -&.- !alaman (erita3 Informasi dan Agenda &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :0

'ambar -&.. !alaman Daftar 'uru &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ::

'ambar -&./ !alaman Daftar Sis5a &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& :;

'ambar -&.0 !alaman 'allery &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& ;

BAB I

PENDA%"L"AN

1.1 La(ar B)la*an+ Masala,

Teknologi masa kini yang tidak bisa lagi dipungkiri bah5a sudah sangat

berkembang pesat& ang mana salah satu teknologi yang sangat umum bagi semua

orang adalah internet& Internet bagi beberapa orang bukan lagi sebuah pilihan atau

pun sebagai pelengkap3 namun sudah sebagai kebutuhan sehari<hari& Dengan

menggunakan internet semua orang bisa dengan mudah melakukan sesuatu yang

dahulunya mungkin sulit dilakukan&



2

Salah satu kegunaan internet adalah sebagai sarana untuk mengakses sebuah

5ebsite& Saat ini media promosi3 iklan3 penyampaian informasi3 jual dan beli3

bersosialisasi3 dan banyak lagi lainnya sudah dapat dengan mudah dilakukan

melalui sebuah 5ebsite& Dengan 5ebsite banyak orang dengan mudah

mendapatkan apa yang dicari tanpa kesulitan& Salah satu contoh 5ebsite yang

umumnya sering di akses adalah sosial media3 jual beli online3 media informasi

berita3 artikel3 profil instansi3 profil sekolahBuni)ersitas3 dan masih banyak lagi&

S#4$ - (atam3 merupakan salah satu Sekolah #enengah 4ejuruan $egeri

yang ada di +ro)insi 4epulauan iau3 yang beralamat di TI(A$ II kelurahan

+atam "estari3 Sekupang > (atam3 merupakan sekolah yang ingin memajukan

sekolah nya melalui media internet lebih tepat nya adalah menggunakan media

5ebsite& ang mana dengan mengguanakan 5ebsite3 kedepannya sekolah akan

lebih dikenal oleh masyarakat luas dan dapat dengan mudah diakses oleh semua

masyarakat&

=ebsite S#4$ - (atam yang saat ini masih belum maksimal membuat

para masyarakat sulit mendapatkan informasi tentang sekolah tersebut& %ika tanpa

menggunakan media 5ebsite3 para sis5a atau masyarakat yang ingin

mendapatkan informasi yang dicari dari sekolah terebut harus datang langsung

kesekolah itu3 sehingga itu kurang efektif dan efisien&

Dengan begitu solusi dari masalah tersbut adalah pengembangan 5ebsite

S#4$ - (atam yang sudah ada sekarang agar dapat memajukan citra sekolah&



,

=ebsite yang bagus akan menambah daya tarik para masyarakat yang melihat

nya3 dan juga dengan 5ebsite yang bagus itu juga akan mencerminkan sekolah itu

bagus pula&

(erdasarkan latar belakang diatas3 maka penulis ingin melakukan

pengembangan 5ebsite S#4$ - (atam& ang mana tujuan nya adalah sebagai

media penyampaian informasi yang berhubungan dengan S#4$ - (atam&

1.2 Rumusan Masala,

(erdasarkan latar belakang kekurangan dan kelemahan yang ada serta

masalah yang telah dijelaskan diatas3 maka penulis merumuskan masalah yaitu

bagaimana 5ebsite resmi sekolah dapat dipergunakan dengan optimal dengan

tampilan yang menarik agar nyaman dipergunakan user&

1.- Ba(asan Masala,

(erdasarkan rumusan masalah diatas3 maka 5ebsite yang akan dibangun

memiliki batasan masalah sebagai berikut C

1& +engembangan 5ebsite ini dikhususkan untuk S#4$ - (atam&

2& +engembangan 5ebsite ini meliputi desain3 fungsi<fungsi beberapa

page3 dan olah data&



-

,& =ebsite ini membahas informasi mengenai S#4$ - (atam baik itu

profile sekolah3 data informasi3 berita terbaru3 data guru3 data sis5a3 dan

kegiatan sekolah&

-& +embuatan 5ebiste menggunakan bahasa pemrograman +!+ dengan

base !T#"3 database menggunakan #yS"3 5eb desain

menggunakan 6SS3 dan beberapa fitur 5ebsite menggunakan

%a)ascript&

1.4 Tuuan P)n)li(ian

Tujuan dari penelitian ini adalah sebagai berikut C

1& Sebagai syarat kelulusan program Strata<1 %urusan Teknik Informatika

pada Sekolah Tinggi #anajemen Informatika Dan 4omputer EST#I4

A#I4# ogyakarta&

2& Untuk membangun 5ebsite S#4$ - (atam sebagai media informasi

yang efektif dan efisien sehingga memudahkan akses infromasi yang

dicari userBmasyarakat&

1. Man/aa( P)n)li(ian

1& (agi penulis

a& #ememuhi syarat kelulusan program strata sati di ST#I4

A#I4# ogyakarta&



.

b& Secara nyata dan langsung dapat menerapkan ilmu dan pengetahuan

yang sudah didapat dan dimiliki&

c& #enambah pengetahuan dan pengalaman dalam pembuatan sebuah

5ebsite&

2& (agi S#4$ - (atam

a& #emiliki 5ebsite yang efisien dan efektif dalam media penyampain

informasi&

b& #empermudah akses informasi bagi guru3 sis5a3 dan masyarakat&

1.0 M)() P)nili(ian

#etode penelitian yang digunakan dalam pengumpulan data yang

diperlukan untuk menyusun skripsi ini adalah sebagai berikut C

1& #etode +engumpulan Data

a& #etode bser)asi

#etode pengumpulan data dengan langsung mengadakan penelitian

terhadap permasalahan yang di teliti&

b& #etode =a5ancara

#etode pengumpulan data dengan mangajukan pertanyaan<

pertanyaan yang sejalur pada pokok masalah&

c& #etode 4epustakaan



/

#etode pengumpulan data dengan cara mengetahui metode apa yang

di gunakan untuk menyelesaikan permasalahan yang di teliti serta

mendapatkan dasar referensi yang baik buat penulis&

2& Analisis

Dengan menganalisis data<data yang telah diperoleh dari sekolah3

kemudian membuat diagram aliran data yang terdiri dari flo5chart dan

data flo5 diagram 7DFD8 untuk menggambarkan sistem yang sedang

berjalan dan untuk memproleh kebutuhan informasi&

,& +erancangan

#etode perancangan adalah metode dengan cara merancang dan

membuat 5ebsite untuk keperluan penyampaian informasi yang

berkaitan dengan S#4$ - (atam&

-& Uji 6oba

!asil dari penelitian dan hasil deri perancangan 5ebsite yang dibuat

akan di uji coba di ser)er local host terlebih dahulu3 untuk mengetahui

sejauh mana kelayakan 5ebsite tersebut& Dan juga memperbaiki

kesalahan<kesalahan yang ada pada 5ebsite tersebut&

.& Implementasi

!asil yang telah lulus uji coba kemudian akan diimplementasikan dan

diupload langsung agar 5ebsite tersebut online dan sudah dapat di

akses secara langsung bagi sis5a3 guru3 dan masyarakat&



0



:

1.3 Sis()ma(i*a P)nulisan

"aporan skripsi ini di tulis secara sistematika ke dalam . bab& ang

masing<masing di uraikan sebagai berikut C

BAB I PENDA%"L"AN

(erisi latar latar belakang masalah3 rumusan masalah3

batasan masalah3 tujuan penelitian3 manfaat penelitian3

metode penelitian dan sistematika penulisan laporan skripsi&

BAB II LANDASAN TE$RI

(ab ini berisi uraian mengenai konsep dasar internet3

konsep dasar 5ebsite3 tentang +!+ #yS" 6SS dan

%a)ascript3 dan sejarah internet& Dan juga menjelaskan

tentang perangkat lunak yang digunakan&

BAB III ANALISIS DAN PERANANGAN SISTEM

Analisis terhadap masalah yang sedang di teliti di uraikan

pada bab ini& Selain itu menganalisa3 bab ini membahas

tentang analisis sistem3 dan perancangan sistem&

BAB I5 IMPLEMENTASI DAN PEMBA%ASAN

(ab ini berisi penjelasan tentang penerapan implementasi3

pembahasan mengenai rancangan 5ebiste S#4$ - (atam

yang dibuat&

BAB 5 PEN"T"P



;

(ab ini berisi kesimpulan dan saran dari penelitian yang

telah di lakukan sehingga di harapkan bermanfaat&

BAB II

LANDASAN TE$RI

2.1 Tinauan Pus(a*a

(agus unianto =ibo5o 721,83 Uni)ersitas STI4U(A$4 Semarang

dengan judul Analisis dan Pengembangan Web SMP-SMA-SMK Unggulan Nurul

Islami Semarang membahas tentang pengembangan 5ebsite pada S#+<S#A<

S#4 Unggulan $urul Islami Semarang& Dengan pengembangan yang dibuat

penulis memfokuskan pada sistem proses +enerimaan 6alon Sis5a baru dengan

menerapkan metode nline yang telah menggunakan sistem ini& Sehingga lebih

dipermudah dan proses yang cepat serta akurat&

D5i Sutanti 721,83 Uni)ersitas Surakarta dengan judul Pembuatan

Website Profil Seola! Menenga! Pertama Negeri " Ker#o Kabu$aten

Karanganyar membahas tentang pembuatan sebuah 5ebsite sekolah untuk media

informasi yang sebelum nya belum memiliki sistem ini& Dengan menggunakan

sistem yang dibuat oleh penulis sekolah tersebut akan dapat berkembang dalam

meyampaikan informasi&

Dedi Trisna5arman 721-83 Uni)ersitas Tarumanegara dengan judul

Pengembangan Website %an E-&earning Seola! membahas tentang



1

pengembangan 5ebsite dan e<learning pada SDS Fajar Islami Tangerang (anten&

Sistem lama masih menggunakan metode manual belum menggunakan sebuah

sistem& Sekolah tersebut masih menggunakan surat atau pengumuman tertulis

sehingga informasi kurang tepat 5aktu dan juga belum ada nya sistem e<learning

sehinga penyebaran materi dan belum bisa dilakukan secara maksimal&

Ta6)l 2.1 Ta6)l P)r6)aan P)n)li(ian

N$ J"D"L

PENELITIAN

NAMA

PEN"LIS

TA%"N %ASIL PERBEDAAN

1 Analisis dan

+engembangan

=eb S#+<

S#A<S#4

Unggulan $urul

Islami

Semarang

(agus

unianto

=ibo5o

21, #enghasilkan

sebuah sistem

informasi3

pembelajaran

dan penerimaan

sis5a baru

berbasis 5eb&

#emiliki proses

untuk pendaftaran

sis5a baru

melalui jalur

online dan

menggunakan

frame5ork

codeigniter&



11

2 +embuatan

=ebsite +rofil

Sekolah

#enengah

+ertama $egeri

2 4erjo

4abupaten

4aranganyar

D5i

Sutanti

21, =ebsite sebagai

media

penyampaian

informasi

Sistem ini

memfokuskan

pada media

informasi untuk

mempermudah

penyampaian

informasi&

Ta6)l 2.1 Ta6)l P)r6)aan P)n)li(ian



12

, +engembangan

=ebsite Dan *<

"earning

Sekolah

Dedi

Trisna5ar

man

21- ancangan dan

penerapan

5ebsite sekolah

dengan aplikasi

e<learning ini

digunakan

sebagai sarana

promosi yang

intensif melalui

forum diskusi

tanpa dibatasi

jam sekolah dan

tempat&

Sistem ini

ditujukan untuk

media promosi

sekolah dengan

manambahan fitus

sistem e<learning

yang berguna

untuk

mempermudah

sistem belajar

namun

menggunakan

cms yang sudah

ada yaitu %oomla

untuk

membangun

5ebsite tersebut&



1,

2.2 Dasar T)ri

2.2.1 D)/inisi Sis()m7 In/rmasi an Sis()m In/rmasi

2.2.1.1 Sis()m

Al Fatah 72083 Sistem adalah sekumpulan elemen3 komponen yang

saling berinteraksi dan berinteraksi untuk mencapai tujuan tertentu& #urdick dan

oss 71;;,8 mendefinisikan sistem sebagai seperangkat elemen yang

digabungkan satu dengan yang lainya untuk tujuan bersama& Sedangkan definisi

sistem dari kamus Webster's Unbriged adalah elemen<elemen yang saling

berhubungan dan membentuk satu kesatuan dan organisasi& #enurut Scott 71;;/83

sistem terdiri dari unsur<unsur seperti masukan (in$ut)3 pengolahan ($rocessing)3

serta keluaran (out$ut)& (anyak ahli mengajukan konsep mengenai sistem dengan

deskripsi yang berbeda3 tetapi pada prinsipnya hampir sama dengan konsep dasar

sistem pada umumnya&

Suatu sistem yang kompleks biasanya tersusun atas beberapa subsistem&

Subsistem biasa dijelaskan sebagai sebuah sistem dalam sistem yang lebih besar&

Setiap sistem mempunyai subsistem<subsistem yang saling berhubungan&

Subsistem tersebut terdiri dari atas komponen<komponen atau elemen<elemen&

#isalnya komputer adalah sistem& Sebagai subsistemnya adalah soft*are+

!ard*are dan brain*are&



1-

Untuk subsistem dari hard5are terdiri dari in$ut+ proses dan out$ut,

4emudian subsistem dari input terdiri dari komponen seperti mouse3 eyboard 3

layar sentuh dan perangkat<perangkat in$ut <an lainya&

2.2.1.2 In/rmasi

Informasi adalah data yang telah diolah menjadi sebuah bentuk yang berarti

bagi penerimanya dan bermafaat dalam pengambilan keputusan saat ini atau

mendatang 7 %avis+ ../8& Mc &eod (../) mengatakan bah5a informasi adalah

data yang telah diproses atau data yang memiliki arti&

4ualitas informasi dikatakan lebih manfaat dalam proses pengambilan

keputusan apabila informasi tersebut memiliki kualitas nilai& 4riteria kualitas

informasi C

1& Akurat3 Informasi harus tidak menyesatkan dan bebas dari kesalahan&

2& Tepat =aktu3 Informasi yang sampai tidak boleh terlambat&

,& ele)an

-& Informasi bermanfaat bagi penerima&

Informasi dapat menjadi tidak bernilai apabila C

1& #etode pengukuran dan pengumpulan data yang salah&

2& Tidak mengikuti prosedur&

,& Data yang hilang&

-& 4esalahan mencatat B koreksi data&



1.

.& File historis B induk yang salah 7salah pilih file historis8&

/& Salah dalam pengolahan data&

0& Disengaja 7informasi salah8&

2.2.1.- Sis()m In/rmasi

Sistem informasi adalah sistem dalam organisasi yang mempertemukan

pengolahan data transaksi harian3 mendukung operasi3 bersifat manajerial3

kegiatan strategis dari suatu organisasi dan menyediakan pihak luar tertentu

dengan laporan<laporan yang diperlukan& Data sebagai bahan baku informasi

adalah kejadian yang ber5ujud karakter3 angka atau simbol<simbol yang

mempunyai arti&

Sasaran sistem informasi adalah pengingkaran kinerja3 peningkatan

efektifitas informasi3 penurunan biaya3 peningkatan keamanan aplikasi3

peningkatan efisiensi dan peningkatan pelayanan pada pelanggan&

2.2.2 Kara*()ris(i* Sis()m

1& (atasan 7boundary8

+enggambaran dari suatu elemen atau unsur mana yang termasuk didalam

sistem dan mana yang diluar sistem&

2& "ingkungan 7environment 8



1/

Segala sesuatu diluar sistem3 lingkungan yang menyediakan asumsi3

kendala dan input terhadap suatu sistem&

,& #asukan 7in$ut 8

Sumber daya 7data3 bahan baku3 peralatan3 energi8 dari lingkungan yang

dikonsumsi dan dimanipulasi oleh sistem&

-& 4eluaran 7out$ut 8

!asil dari suatu sistem yang dapat berupa informasi3 laporan3 dokumen

dan hasil lainnya yang disediakan untuk lingkungan sistem&

.& 4omponen 7com$onent 8

+roses dalam suatu sistem yang mengolah masukan 7in$ut 8 menjadi

keluaran 7out$ut 8&

/& +enghubung 7interface8

Tempat dimana komponen atau sistem dan lingkungannya bertemu atau

berinteraksi&

0& +enyimpanan 7 storage8

Suatu unsur yang digunakan untuk menyimpan informasi dan sebagian

banyak yang bersifat sementara atau tetap&



1:

melalui in)estigasi3 analisis3 perancangan3 implementasi dan pera5atan& SD"6

juga dikenal sebagai pengambangan sistem informasi atau pengembangan

aplikasi& Sebuah SD"6 harus menghasilkan sistem berkualitas tinggi yang

memenuhi atau bahkan melibihi harapan pelanggan dalam hal perkiraan 5aktu

dan harga3 dapat bekerja dengan efektif dan efisien dalam insfratuktur teknologi

informasi yang ada sekarang atau yang sedang dirancang3 serta membutuhkan

biaya yang rendah dalam pera5atannya dan cost-effective dalam pengembangan

selanjutnya&

Selain itu3 SD"6 juga menggunakan model konseptual yang digunakan

dalam manajemen proyek yang mendeskripsikan tahapan<tahapan yang dilakukan

dala proyek pembangunan sistem informasi3 mulai dari studi kelayakan pertama

sampai pera5atan aplikasi yang telah sempurna& Ada banyak metode yang

dikembangkan untuk menuntun jalannya proses pengembangan yang harus

dilalui3 misalnya 0a$id A$$lication %evelo$ment 7AD83 fountain model 3 s$iral

model dan *aterfall model 7metode SD"6 klasik8&

Setiap ahli mendefinisikan proses<proses kedalam tahapan yang berbeda&

Secara garis besar tahapan tersebut dibagi menjadi .3 yaitu analsis3 desain3

impelementasi3 pengujian dan pemeliharaan&



Requirement

Analysis

Design

Imple-mentation

Testing

Evolution

1;

Gam6ar 2.1 System Development Life Cycle

2.2.4 Kns)8 P)m)lan Sis()m

"angkah a5al desain biasanya dimulai dengan permodelan sistem& #odel

digunakan untuk menyederhanakan cara mengkomunikasikan proses<proses bisnis

yang harus dilakukan sistem dengan cara yang formal antara pemain pengembang

sistem informasi& +ermodelan yang dilakukan biasanya mencakup dua hal3 yaitu

permodelan proses dan permodelan data&



21

rang3 organisasi atau sistem yang berada di luar sistem tetapi berinteraksi

dengan sistem&

#asing<masing dari elemen tersebut akan diberi lambang tertentu untuk

membedakan satu dengan yang lain& Ada beberapa metode untuk menggambarkan

elemen<elemen tersebut& Untuk lebih jelasnya dapat dilihat pada gambar berikut C

Ta6)l 2.2 El)m)n=)l)m)n ari D#D an Sim6lnya

K)()ran+an Sim6l G)n) an Sarsn Sim6l D) Mar: an

Juran

+roses

Aliran Data

+enyimpanan Data

*ntitas *ksternal

2.2.4.2 P)rm)lan Da(a ;Da(a M)llin+<

Data model adalah cara formal untuk menggambarkan data yang

digunakan dan diciptakan dalam suatu sistem bisnis& #odel ini menunjukkan

orang3 tempat atau benda dimana data diambil dan hubungan antar data tersebut&



22

+enyusunan permodelan data harus seimbang dengan permodelan proses& Salah

satu cara permodelan data adalah dengan menggunakan *D 7*ntity elationship

Diagram8&

*D adalah gambar atau diagram yang menunjukan informasi yang

dibuat3 disimpan dan digunakan dalam sistem bisnis& *ntitas biasanya

menggambarkan jenis informasi yang sama& Dalam entitas digunakan untuk

menghubungkan antar entitas yang sekaligus menunjukkan hubungan antar data&

+ada akhirnya *D bisa juga digunakan untuk menunjukan aturan<aturan bisnis

yang ada pada sistem informasi yang akan dibangun&

Seperti Data Flo5 Diagram3 *D juga menggunakan simbol<simbol

khusus untuk menggambarkan elemen<elemen *D& (erikut simbol<simbol yang

digunakan&

Ta6)l 2.- El)m)n=)l)m)n ari ERD

IDE#I> ,)n In/rma(in

En+in))rin+



2,

*ntitas C

rang3 tempat atau

benda

#emiliki nama tunggal

Ditulis dengan huruf

besar

(erisi lebih dari 1

instance

*ntity $ame *ntity $ame *ntity $ame

Ta6)l 2.- El)m)n=)l)m)n ari ERD

Atribut C

+roperti dan entitas

!arus digunakan oleh

menimal 1 proses bisnis

Dipecah dalam detail

*ntity $ame *ntity $ame

ID*$TIFI* GIdentifier

Attribute<name

Attribute<name

Attribute<name

Attribute<

name

Attribute<name

Attribute<name

Attribute<name



2/

+enghubung 4eluar komputer masuk dari

bagian lain flo5chart khususnya

halaman yang sama&

Anak +anah #erepresentasikan alur kerja&

4eputusan 4eputusan dalam program&

Terminal +oints A5alBakhir flo5chart

Dokumen IB dalam format yang dicetak&

#agnetic Drum +enyimpanan Data 7 storage8

#anual Input Input yang dimasukkan secara

manual dari keyboard&

2.2. Kns)8 Basis Da(a

2.2..1 P)n+)r(ian Basis Da(a

(asis data adalah sekumpulan data yang saling terintegrasi satu sama lain

dan terorganisasi berdasarkan sebuah skema atau struktur tertentu dan tersimpan

pada sebuah !ard*are komputer& (asis data terdiri dari beberapa tabel yang saling

terorganisir& Tabel digunakan untuk menyimpan data dan terdiri dari baris dan

kolom& Data tersebut dapat ditampilkan3 dimodifikasi dan dihapus dari tabel&



2:

Terdapat tiga jenis data3 yaitu C

a& Data perasional

Data daru suatu organisasi berupa data yang disimpan dalam basis data&

b& Data #asukkan 7in$ut data8

Data dari sistem yang dimasukkan melalui peralatan input 7misalnya C

keyboard8 yang dapat mengubah data operasional&

c& Data 4eluaran 7out$ut data8

Data dapat berupa laporan melalui peralatan output 7misalnya C screen3

printer dan lain<lain8 sebagai hasil proses dari dalam suatu sistem yang

mengakses data operasional&

2& +erangkat 4eras 7!ard*are8

Terdiri dari semua peralatan komputer yang digunakan untuk pengelolaan

sistem basis data3 berupa C

a& +eralatan untuk menyimpan basis data&

b& +eralatan input dan output&

c& +eralatan proses dan komunikasi data dan lain<lain&

,& +ernagkat "unak 7 soft*are8

(erfungsi sebagai perantara 7interface8 antara pemakai dengan data fisik pada

basis data& Soft5are dari basis data dapat berupa C



2;

a& D(#S 7 %atabase Management System8 yang menangani akses terhadap

basis data sehingga tidak perlu memikirkan proses penyimpanan dan

pengolahan data secara detail&

b& +rogram<program aplikasi dan prosedur<prosedurnya&

-& +emakai 7user 8

+emakai basis data dapat dibagi atas tiga klasifikasi3 yaitu C

a& Database administrator3 orang atau tim yang bertugas mengelola sistem

basis data secara keseluruhan&

b& +rogrammer3 orang atau tim yang bertugas membuat program aplikasi&

c& User3 orang yang mengakses basis data melalui terminal dengan

menggunakan program aplikasi yang dibuat oleh programmer&

BAB III

ANALISIS DAN PERANANGAN

-.1 Tinauan "mum

-.1.1 T)n(an+ SMKN 4 Ba(am

S#4$ - (atam adalah salah satu instansi sekolah negeri yang beralamat

di kota (atam3 4epulauan iau& Sekolah ini sudah mulai berkembang sejak a5al

berdiri nya pada tahun 2/& Dengan saat ini memiliki , buah jurusan yaitu 4imia

Industri3 ekayasa +erangkat "unak dan #ultimedia& (erikut adalah identitas

resmi dari S#4$ - (atam C



2/

$+S$ C 112.01

$ama Sekolah C S#4$ - (atam

Alamat Sekolah C Tiban II +atam "estari3 Sekupang3 (atam

$o Telpon C ,20/2/

*<#ail C infoHsmkn-batam&sch&id

-.1.2 5isi7 Misi an Tuuan

1& 9isi

#e5ujudkan Sumber Daya #anusia yang (erakhlak #ulia yang #ampu

(ersaing Dalam Dunia 4erja Secara 'lobal&

2& #isi

a& #enciptakan suasana yang kondusif untuk mengembangkan potensi

sis5a melalui penekanan pada penguasaan kompetensi bidang ilmu

pengetahuan dan teknologi serta (ahasa Inggris&

b& #eningkatkan penguasaan (ahasa Inggris sebagai alat komunikasi

dan alat untuk mempelajari pengetahuan yang lebih luas&



20

c& #eningkatkan penguasaan (ahasa Inggris sebagai alat komunikasi

dan alat untuk mempelajari pengetahuan yang lebih luas&

d& #enumbuhkembangkan nilai<nilai ketuhanan dan nilai<nilai

kehidupan yang bersifat uni)ersal dan mengintegrasikannya dalam

kehidupan&

e& #enerapkan manajemen partisipatif dengan melibatkan seluruh 5arga

sekolah3 "embaga S5adaya #asyarakat3 stake holders dan instansi

serta institusi pendukung pendidikan lainnya&

,& Tujuan

a& Sis5a memiliki kompetensi penguasaan konsep untuk seluruh mata

pelajaran secara komprehensif dan benar sehingga mampu

berkompetisi ditingkat nasional dan tahun 212 mampu berkompetisi

di tingkat internasional

b& Sis5a mampu menggunakan (ahasa Inggris sebagai alat komunikasi

untuk mendapatkan pengetahuan yang lebih luas

c& Sis5a mampu membangun kebiasaan yang aktif untuk mencari

informasi menggunakan teknologi informasi&

d& Sekolah memiliki sarana dan prasarana penunjang +(# yang lengkap&



2:

e& Sekolah memiliki guru dan tenaga pendukung yang handal untuk

mendukung seluruh manajemen sekolah&

f& Sekolah memiliki hubungan kemitraan yang baik dengan seluruh

5arga sekolah3 stake holders dan instansi serta institusi pendukung

pendidikan lainnya&

g& Sis5a memiliki3 mengaplikasikan dan meningkatkan nilai<nilai

ketuhanan serta nilai<nilai kehidupan yang bersifat uni)ersal dalam

kehidupannya&

-.1.- S(ru*(ur $r+anisasi

Gam6ar -.1 S(ru*(ur $r+anisasi SMKN 4 Ba(am



2;

-.2 Analisis

-.2.1 Analisis PIEES

Sistem memiliki kelemahan dan potensi terjadinya permasalahan saat

sistem berjalan maka dari itu di lakukanlah analisis sistem3 sehingga diharapkan

pada sistem yang akan dibangun dapat mengurangi kelemahan yang ada& Untuk

menganalisis sistem yang dibuat ini menggunakan metode +I*6*S sebagai dasar

untuk memperoleh pokok<pokok permasalahan yang jelas dan spesifik& Dengan

menggunakan metode ini yang akan menghasilkan hasil analisis yang digunakan

sebagai usulan<usulan yang akan diterapkan pada sistem baru3 dan juga dapat

mengetahui apakah sistem tersebut layak digunakan atau tidak& (erikut adalah

hasil dari analisa C

-.2.1.1 Analisis Performance

Sebuah sistem pasti memiliki tugas masing<masing3 dalam menjalankan

tugas tersebut kinerja sistem sangatlah penting& Dengan kinerja sistem

yang cepat3 tepat dan akurat akan membantu mencapai sebuah tujuan&

%umlah produksi 7troug!$ut 8 dan 5aktu yang digunakan untuk

menyelesaikan pekerjaan 7res$onse time8 adalah sebagai tolak ukur kinerja

sistem& +ada S#4$ - (atam menghasilkan analisa sebagai berikut C



,

a& Sebagai sekolah yang telah memiliki sebuah 5ebsite resmi3 selayaknya

5ebsite tersebut dapat digunakan sesuai dengan fungsinya3 namun

bagaimana jika ternyata 5ebsite tersebut susah untuk diakses dan

susah untuk dimengerti oleh user 7tidak user freindly8&

b& +roses belajar<mengajar dalam kelas memiliki 5aktu 1@-. menit per

mata pelajaran dan 2@-. menit per mata pelajaran3 namun dengan

5aktu tersebut sis5a hanya disibukkan untuk mencatat materi&

Ta6)l -.1 Analisis Performance

4eterangan Sistem "ama Sistem (aru !asil

Performance =aktu yang

dibutuhkan untuk

mengolah data

sis5a dan guru

masih lama&

+engolahan data

sis5a dan guru

lebih cepat karena

sudah ada

perkembangan&

Sistem baru lebih

menghemat aktu

dan kinerja yang

optimal&

-.2.1.2 Analisis Information

*)eluasi terhadap kemampuan sistem informasi dalam menghasilkan dan

menyampaikan informasi yang bermanfaat& +ada S#4$ - (atam

menghasilkan analisa sebagai berikut C

a& Sebagai sekolah yang sering mengadakan event dan acara<acara namun

belum dapat menyampaikan informasi tersebut dengan baik&



,1

b& Sekolah yang memikiki guru3 staff dan murid yang banyak dengan

sistem yang sekarang sulit untuk dijalankan&

c& +ekerjaan rumah adalah salah satu tugas yang sering diberikan oleh

guru kepada sis5a namun dengan penanganan yang masih kurang

untuk saat ini&

Ta6)l -.2 Analisis Information


Information Informasi yang

dihasilkan

kurang akurat3

rele)an dantepat 5aktu

karena sistem

belum optimal&

+engembangangan

5ebsite yang telah

optimal untuk

penyampaianinformasi&

Sistem baru lebih

akurat3 rele)an dan

tepat 5aktu dalam

menyampaikaninformasi&

-.2.1.- Analisis Economy

Analisis ekonomi berkaitan dengan biaya operasional yang dikeluarkan

oleh sistem& +ada S#4$ - (atam menghasilkan analisa sebagai berikut C

a& Sebuah informasi dan berita jika dilakukan melalui selebaran dan surat&

ang memakan biaya yang lebih banyak& 4ertas !9S p -&3<



,,

dan keamanan

data masih kurang

karna hanya dan

hanya satu orang

yang memiliki hak

askes&

keamanan data

lebih aman dan

hak akses sudah

dibagi menjadi

tiga yaitu admin3

guru dan sis5a&

keamanan lebih

terjaga dan

terjamin&

-.2.1. Analisis Eficiency

Dengan sumber daya yang terdapat di S#4$ - (atam maka dari itu

bagaimana agar tidak terjadi nya pemborosan yang mana menghasilkan

out$ut yang semaksimal mungkin dan in$ut yang seminimal mungkin&

+ada S#4$ - (atam menghasilkan analisa sebagai berikut C

a& Sumber daya manusia yang dikerahkan dalam penyampaian informasi&

b& =aktu yang lama agar informasi dapat tersebar dengan cepat&

c& 0esources yang penggunaan nya masih kurang maksimal seperti

jaringan internet dan komputer&

Ta6)l -. Analisis Eficiency


Eficiency Sistem lama

kurang efisien

karena dibutuhkan

banyak tenaga dan

"ebih cepat dan

efisien dalam

mencapai tujuan

seperti

*fisien dan

mudah dalam

mencapai tujuan



,.

-.2.2 Analisis K)6u(u,an

-.2.2.1 Analisis K)6u(u,an #un+sinal

Analisis ini dilakukan untuk mengetahui apa saja yang dapat dilakukan

oleh sistem& #enjelaskan fungsi<fungsi yang dapat dilakukan oleh sistem sesuai

hak akses yang diberlakukan pada sistem& Sebagai berikut C

1& Admin

a& Admin bisa menambah data berita3 kategori berita3 data guru3 data

sis5a3 profil sekolah3 kelas3 mata pelajaran3 materi3 tugas3 album dan

gellery&

b& Admin bisa merubah data berita3 kategori berita3 data guru3 data sis5a3

profil sekolah3 kelas3 mata pelajaran3 materi3 tugas3 album dan gellery&

c& Admin bisa menghapus data berita3 kategori berita3 data guru3 data


gellery&

d& Admin bisa melihat informasi data berita3 kategori berita3 data guru3

data sis5a3 profil sekolah3 kelas3 mata pelajaran3 materi3 tugas3 album

dan gellery&



,/

2& 'uru

a& 'uru bisa menambah data materi dan data tugas&

b& 'uru bisa merubah data materi dan data tugas&

c& 'uru bisa menghapus data materi dan data tugas&

d& 'uru bisa melihat informasi data berita3 kategori berita3 data guru3 data


gellery&

,& Sis5a

a& Sis5a dapat merubah data sis5a&

b& Sis5a bisa melihat informasi data berita3 kategori berita3 data guru3

data sis5a3 profil sekolah3 kelas3 mata pelajaran3 materi3 tugas3 album

dan gellery&

-& Tamu

Tamu bisa melihat informasi data berita3 data guru3 data sis5a3 album dan

gallery&

-.2.2.2 Analisis K)6u(u,an Nn=#un+sinal

Analisis ini dilakukan untuk mengetahui apa saja yang dibutuhkan untuk

menjalan kan sistem dan berisi properti prilaku yang dimiliki oleh sistem&



,0

1& perasional

a& =ebsite

1& Ser)er !osting3 digunakan untuk 5ebser)er dengan spesifikasi

minimal sebagai berikut C

Ta6)l -.3 S)r9)r %s(in+

Storage 0

(and5idth 1 #(Bbulan

2& Domain3 alamat yang akan di akses oleh semua orang& Domain

yang digunakan adalah 555&smkn-batam&sch&id&

b& Admin

Seorang admin membutuhkan perangkat untuk pengoperasionalan

dengan menggunakan spesifikasi minimal sebagai berikut C

Ta6)l -.! S8)si/i*asi Minimial Km8u()r Amin



,;

-.2.2.- Analisis K)6u(u,an Biaya

Dalam pengembangan sistem ini dibutuhkan rincian biaya untuk

implementasi sistem baru pada S#4$ - (atam&

Ta6)l -.? Rin:ian Biaya

D)s*ri8si Biaya

!osting : '( B bulan p :0&. @ 12 J p 1&.&

Domain B tahun p .&

Internet Speedy 2 #bps B bukan p 2.& @ 12 J p ,&&

T(al @ Ta,un R8 4.1''.'''



-

-.- P)ran:an+an Sis()m

-.-.1 P)m)lan Da(a

-.-.1.1 En(i(y R)la(ins,i8 Dia+ram



-1

Gam6ar -.2 Ran:an+an ERD

-.-.1.2 R)lasi An(ar Ta6)l



-2



-,

Gam6ar -.- R)lasi An(ar Ta6)l

-.-.2 P)m)lan Prs)s

-.-.2.1 Da(a #lw Dia+ram ;D#D<

Gam6ar -.4 Dia+ram Kn()*s W)6si() SMKN 4 Ba(am



--



-.

Gam6ar -. D#D L)9)l ' W)6si() SMKN 4 Ba(am

Gam6ar -.0 D#D L)9)l 2 Prs)s $la, Da(a Amin



-0

Gam6ar -.! D#D L)9)l 2 Prs)s $la, Da(a Ka()+ri

Gam6ar -.? D#D L)9)l 2 Prs)s $la, Da(a Guru



-:

Gam6ar -.1' D#D L)9)l 2 Prs)s $la, Da(a Siswa



-;

Gam6ar -.11 D#D L)9)l 2 Prs)s $la, Da(a K)las

Gam6ar -.12 D#D L)9)l 2 Prs)s $la, Da(a Ma8)l



.1

Gam6ar -.1 D#D L)9)l 2 Prs)s $la, Da(a Al6um



.2

Gam6ar -.10 D#D L)9)l 2 Prs)s $la, Da(a Gall)ry

Gam6ar -.13 D#D L)9)l 2 Prs)s $la, Da(a %als(a(is

-.-.- P)ran:an+an Tam8ilan

1& Tampilan "ogin



.,

Gam6ar -.1! Tam8ilan L+in

2& !alaman Utama =ebsite

Gam6ar -.1? %alaman "(ama W)6si()



.-

,& !alaman Statis

Gam6ar -.2' %alaman S(a(is

-& !alaman (erita3 Informasi dan Agenda



./

Gam6ar -.22 %alaman Da/(ar Guru

/& !alaman Daftar Sis5a

Gam6ar -.2- %alaman Da/(ar Siswa

0& !alaman 'allery



.0

Gam6ar -.24 %alaman Gall)ry

:& Admin Dashboard



.;

Gam6ar -.23 Amin Da(a Al6um7 K)las an Ma(a P)laaran

11& Admin Tambah 'uru dan Sis5a



/

Gam6ar -.2! Amin Tam6a, Guru an Siswa

12& Admin Tambah #ateri dan Tugas

Gam6ar -.2? Amin Tam6a, Ma()ri an Tu+as

BAB I5

IMPLEMENTASI DAN PEMBA%ASAN

4.1 Im8l)m)n(asi P)ran:an+an Sis()m

Tahapan ini adalah tahapan dimana suatu sistem yang telah dibuat akan

diterapkan yang rancangan pembuatan sistem sudah ada pada pokok pembahasan

sebelum nya& Adapun pembahasan yang dilakukan adalah mengenai pembuatan

database3 pembuatan program dan testing&



/1

4.1.1 P)m6ua(an Da(a6as)

+ada pengembangan sistem ini menggunakan database #yS" dan

menggunakan 5eb ser)er local yaitu apache& Database yang digunakan

diberinama smkn-batam dengan memiliki 12 tabel yaitu3 admin3 guru3 sis5a3

tugas3 materi3 berita3 kategori3 kelas3 mata pelajaran3 album3 gallery dan halaman

statis&

4.1.1.1 M)nalan*an w)6s)r9)r l:al an a(a6as) l:al

@A#++ merupakan suatu soft5are open source yang menyediakan

bundling layanan yang dikemas dalam satu soft5are yaitu @A#++& Salah satu

diantara nya yang akan digunakan adalah Apache dan #yS"& Untuk

menjalankan nya3 buka @A#++3 pada control panel @A#++ klik start Apache

dan #yS"



/2

Gam6ar 4.1 Interface >AMPP

4.1.1.2 P)m6ua(an Da(a6as)7 Ta6)l 6)s)r(a A(ri6u(nya

@A#++ yang telah berjalan dan service yang dibutuhkan juga suda mulai

jalan yaitu Apache dan #yS"3 selanjutnya adalah membuat database&

#embuatnya dengan menjalankan Kuery sebagai berikutC

6*AT* DATA(AS* smkn-batam

uery tersebut akan diproses dan terbentukan sebuah database yang

bernama smkn-batam3 kemudian pada database tersebut langkah selanjutnya



/,

adalah membuat tabel beserta dengan atributnya& (erikut tabel<tabel yang sudah

dibuat C

Gam6ar 4.2 Ta6)l Paa Da(a6as) sm*n46a(am

(erikut adalah atribut<atribut yang telah dibuat pada masing<masing tabel C

, Tabel admin

Tabel admin memiliki 0 atribut3 berikut adalah tampilan atribut yang telah

diimplementasikan kedalam tabel admin C



/-

Gam6ar 4.- Ta6)l Amin

", Tabel album

Tabel album memiliki - atribut3 berikut adalah tampilan atribut yang telah


Gam6ar 4.4 Ta6)l Al6um

1, Tabel berita

Tabel berita memiliki . atribut3 berikut adalah tampilan atribut yang telah




/.

Gam6ar 4. Ta6)l B)ri(a

2, Tabel gallery

Tabel gallery memiliki - atribut3 berikut adalah tampilan atribut yang telah


Gam6ar 4.0 Ta6)l Gall)ry

/, Tabel guru

Tabel guru memiliki 1, atribut3 berikut adalah tampilan atribut yang telah




/:

6, Tabel materi

Tabel materi memiliki 0 atribut3 berikut adalah tampilan atribut yang telah


Gam6ar 4.12 Ta6)l Ma()ri

, Tabel sis5a

Tabel sis5a memiliki 1, atribut3 berikut adalah tampilan atribut yang telah




/;

Gam6ar 4.1- Ta6)l Siswa

", Tabel tugas

Tabel tugas memiliki / atribut3 berikut adalah tampilan atribut yang telah


Gam6ar 4.14 Ta6)l Tu+as



0

4.1.2 Kn)*si Paa Da(a6as)

4oneksi database merupakan suatu proses untuk menghubungkan antara

sistem dengan database yang telah dibuat& (erikut implementasinya C

Gam6ar 4.1 K) Pr+ram "n(u* Kn)*si Da(a6as)

4.1.- Lis(in+ Pr+ram

4.1.-.1 Lis(in+ Pr+ram Paa %alaman Amin

1& !alaman login

!alaman ini adalah porses auntentikasi untuk login seorang admin3 berikut

adalah cuplikan kode login admin C

Gam6ar 4.10 K) Pr+ram Aun()n(i*asi L+in Amin

2& !alaman das!board menampilkan data berita3 data guru3 data sis5a3 data

materi3 data tugas3 data halaman statis dan data gallery&



01

!alaman ini menampilkan data berita3 guru3 sis5a3 materi3 tugas3 halaman

statis dan gallery yang sudah tersimpan di database& (erikut adalah cuplikan

dara salah satu halaman yaitu halaman yang menampilan data berita C

Gam6ar 4.13 K) Pr+ram M)nam8il*an Da(a B)ri(a

,& !alaman fitur tambah berita3 album3 gallery dan halaman statis&

!alaman ini berisi tentang proses penambahan berita3 album3 gallery dan

halaman statis& (erikut salah satu cuplikan kode program tambah beritaC



02

Gam6ar 4.1! K) Pr+ram Tam6a, B)ri(a

-& !alaman tambah data guru dan sis5a

!alaman ini berisi tentang proses penambahan data guru dan sis5a& (erikut

salah satu cuplikan kode program yaitu tambah guruC



0,

Gam6ar 4.1? K) Pr+ram Tam6a, Guru

.& !alaman tambah kelas dan data kelas

!alaman ini berisi tentang proses tambah kelas dan menampilkan data

kelas& (erikut adalah cuplikan kode program terserbut C

Gam6ar 4.2' K) Pr+ram Tam6a, K)las



0-

Gam6ar 4.21 K) Pr+ram M)nam8il*an Da(a K)las

/& !alaman tambah mata pelajaran dan data pelajaran

!alaman ini berisi tentang proses tambah mata pelajaran dan menampilkan

data mata pelajaran& (erikut adalah cuplikan kode program tersebut C



0.

Gam6ar 4.22 K) Pr+ram Tam6a, Ma(a P)laaran

Gam6ar 4.2- K) Pr+ram M)nam8il*an Da(a Ma(a P)laaran

0& !alaman *<"earning tambah materi dan tambah tugas

!alaman ini berisi tentang proses tambah materi dan tambah tugas& (erikut

adalah cuplikan kode program yaitu tambah materi C



0/

Gam6ar 4.24 K) Pr+ram Tam6a, Ma()ri

:& !alaman edit

!alaman ini berisi proses edit data berita3 guru3 sis5a3 kelas dan mata

pelajaran& (erikut adalah salah satu cuplikan kode program untuk proses

edit yaitu edit berita C

Gam6ar 4.2 K) Pr+ram Ei( B)ri(a

;& !alaman hapus



0:

2& !alaman utama 5ebsite

!alaman utama 5ebsite yang berisi informasi berita3 pengumuman dan

agenda& (erikut adalah listing program halaman utama 5ebsite C



0;

Gam6ar 4.2! K) Pr+ram %alaman "(ama W)6is() 6a+ian 1

Gam6ar 4.2? K) Pr+ram %alaman "(ama W)6si() 6a+ian 2

,& !alaman statis

!alaman ini berisi tampilan data dari halaman statis untuk di gunakan

seperti profil sekolah3 )isi misi3 tujuan dll& ang tidakt terlalu berubah<

ubah& (erikut salah satu listing program nya C



:

Gam6ar 4.-' K) Pr+ram %alaman S(a(is



:1

-& !alaman panel info user login

!alaman ini berisi panel disaat login& (aik itu admin3 guru maupun sis5a3

nanti setiap panel akan berbdeda sesuai le)el user login& (erikut adalah

kode program tampilan panel guru C

Gam6ar 4.-1 K) Pr+ram Tam8ilan Pan)l Guru 6a+ian 1



:2

Gam6ar 4.-2 K) Pr+ram Tam8ilan Pan)l Guru 6a+ian 2



:,

Gam6ar 4.-- K) Pr+ram Tam8ilan Pan)l Guru 6a+ian -

.& 'allery

(erisi tampilan gallery foto<foto yang sudah tersimpan didatabase sesuai

dengan album& (erikut adalah kodep program nya C



:-

Gam6ar 4.-4 K) Pr+ram Tam8ilan Gall)ry

4.2 Im8l)m)n(asi Sis()m

4.2.1 "i 6a Sis()m

Untuk mengetahui apakah sistem yang sudah dibuat sudah memenuhi

sesuai kebutuhan dilakukan lah sebuah uji coba sistem& #etode yang digunakan



:/

1& "ogin

#enu halaman untuk login sesuai jenis user login&

Gam6ar 4.- %alaman L+in Amin

2& Tampilan Data (erita

#anampilkan data berita yang sudah tersimpan pada database

Gam6ar 4.-0 %alaman Tam8il B)ri(a



:0

,& Tampilan Data 'uru

!alaman yang menampilkan data guru yang sudah tersimpan didatabase

Gam6ar 4.-3 %alaman Da(a Guru

-& Tampilan Data Sis5a

!alaman yang menampilkan data sis5a yang sudah tersimpan didalam

database&

Gam6ar 4.-! %alaman Da(a Siswa



::

.& Tampilan Data #ateri

!alaman yang mampilkan data materi yang tersimpan pada database

Gam6ar 4.-? %alaman Da(a Ma()ri

/& Tampilan Data Tugas

!alaman yang menampilkan data tugas yang sudah tersimpan didatabase



:;

Gam6ar 4.4' %alaman Da(a Tu+as

0& Tampulan Data !alaman Statis

!alaman yang menampilkan data halaman statis yang tersimpan pada

database&

Gam6ar 4.41 %alaman Da(a %alaman S(a(is



;

:& Tambah (erita

!alaman untuk menambahkan data berita kedalam database&

Gam6ar 4.42 %alama Tam6a, B)ri(a

;& Tambah Album

!alaman untuk menambahkan data album ke dalam database&



;1

Gam6ar 4.4- %alaman Tam6a, Al6um

1& Tambah 'allery

!alaman untuk menambahkan data gallery sesuai album kedalam

database&

Gam6ar 4.44 %alaman Tam6a, Gall)ry



;,

Gam6ar 4.40 %alaman Tam6a, Guru

1,& Tambah Data Sis5a

!alaman untuk menambahkan data sis5a kedalam database&



;-

Gam6ar 4.43 %alaman Tam6a, Da(a Siswa



;.

1-& 4elas

!alaman untuk menambahkan data kelas serta menampilkan data kelas&

Gam6ar 4.4! %alaman K)las

1.& #ata +elajaran

!alaman untuk menambahkan data mata pelajaran serta menampilkan data

mata pelajaran&



;/

Gam6ar 4.4? %alaman Ma(a P)laaran

1/& *<learning #ateri

!alaman untuk menambahkan data materi bagi sis5a&

Gam6ar 4.' %alaman Tam6a, Ma()ri

10& *<learning Tugas

!alaman untuk menambahkan data tugas bagi sis5a&



;0

Gam6ar 4.1 %alaman Tam6a, Tu+as

1:& !alaman Utama =ebsite

!alaman utama 5ebsite yang menampilkan berita3 info sekolah3 dan

agenda&



1

2& !alaman (erita3 Informasi dan Agenda

!alaman ini berisi tentang informasi berita3 informasi sekolah dan agenda

sekolah yang akan dimuat di5ebsite yang berfungsi sebagai media

menyampaikan informasi&

Gam6ar 4.4 %alaman B)ri(a7 In/rmasi an A+)na



11

21& !alaman Daftar 'uru

!alaman ini berisi daftar guru dan staff yang ada dalam instansi

pendidikan S#4$ - (atam ini&

Gam6ar 4. %alaman Da/(ar Guru



12

22& !alaman Daftar Sis5a

(erisi tentang sis5a yang terdaftar dan aktif di S#4$ - (atam&

Gam6ar 4.0 %alaman Da/(ar Siswa



1,

2,& !alaman 'allery

!alaman ini berisi tentang gallery dari dokemtasi agenda dan acara yang

diadakan S#4$ - (atam&



1-

Gam6ar .3 %alaman Gall)ry



BAB 5

KESIMP"LAN DAN SARAN

.1 K)sim8ulan

Telah diuraikan dan dijelaskan pada bab<bab sebelumya dari hasil

penelitian yang dilakukan penulis3 dapat mengambil kesimpulan sebagai berikut C

1& Data guru dan sis5a dapat di tampilkan dengan baik dan di olah dengan

mudah&

2& Sistem yang sudah dikembangkan ini mampu mempercepat

menyampaikan informasi dari sekolah&

,& Ada , jenis user yaitu admin3 guru3 sis5a dan tamu 7pengakses umu8&

-& Ada 12 tabel database dalam sistem yaitu3 materi3 gallery3 album3 mapel3

guru3 kelas3 tugas3 sis5a3 admin3 halstatis3 kategori3 berita&

.2 Saran

Dengan pengembangan 5ebsite S#4$ - (atam ini3 bukan berarti sudah

sempurna& #aka dari itu penulis memiliki beberapa saran yang dapat

dipertimbangkan guna untuk meningkatkan kualitas dan kuantitas pada 5ebsite C

1& (agi sekolah3 hendaknya upgrade ser)er yang menyediakan autobackup

per hari agar terhindar dari kehilangan data&

2& (agi peneliti berikunya yang akan melakukan penelitian dengan topik

sejenis disarankan hendaknya menambah fitur guna meningkatkan kualitas

dan kuantitas kerja&

;1



DA#TAR P"STAKA

L1&M Al fatta3 !anif& 20& Analisis dan perancangan system informasi untuk

keunggulan perusahaan dan organisasi kelas dunia& ogyakarta C +enerbit

Andi&

L2&M Arif3 #&udyanto& 2/& +emrograman (asis Data menggunakan Transact

S" dengan #icrosoft S" ser)er 2& ogyakartaC A$DI&

L,&M %ogiyanto& 2.& Analisis dan Desain Sistem Informasi C +endekatan

Terstruktur3 Teori dan +raktik Aplikasi (isnis& ogyakarta C +enerbit Andi&

L-&M ouf3 Abdul3 2123 E +engujian +erangkat "unak Dengan #enggunakan

#etode =hite (o? Dan (lack (o?3

httpCBBejournal&himsya&ac&idBinde?&phpB!I#SAT*6!BarticleBdo5nloadB2

:B20& 7Diakses 1. Agustus 21.8&

L.&M Supriyanto3 Aji& 2.& +engantar Teknologi Informasi& %akarta C +enerbit

Salemba Infotek&

surya.docx

Documents