U se r W e b
Ad m in ist r at o r
Lu ra h W eb sit e Kelu r ah an
Po lo n ia - d a t a lin g k u n g an
- d a t a k e p ala lin g k u n g a n - d a t a p e n d u d u k
- d a t a ru m a h ib ad ah d at a b u k u t am u
D a t a b u k u t am u
- lap o r an d at a lin g k u n g a n - lap o r an d at a p en d u d u k p er lin g k u n g a n
- lap o r an d at a r u m ah ib ad a h - in f o p ro f il k e lu ra h an
- in f o lin g k u n g a n - in f o p en d u d u k p er lin g k u n g an
- in f o r u m ah ib ad a h
4.2 Perancangan DFD Data Flow Diagram
Berikut ini adalah gambar data flow diagram yang penulis gunakan dalam merancang website Kantor Lurah Polonia, yang terdiri dari diagram konteks dan data flow
diagram level 0, seperti terilihat pada gambar dibawah ini:
Gambar 4.1 Diagram Konteks Website Kantor Lurah Polonia
Universitas Sumatera Utara
U s e r W e b
A d m i n i s t r a t o r
L u r a h U p l o a d d a t a
1 . 0
- d a t a l in g k u n g a n - d a t a k e p a l a l i n g k u n g a n
- d a t a p e n d u d u k - d a t a r u m a h ib a d a h
d a t a b u k u t a m u D a t a b u k u t a m u
- l a p o r a n d a t a l i n g k u n g a n - l a p o r a n d a t a p e n d u d u k p e r l in g k u n g a n
- l a p o r a n d a t a r u m a h i b a d a h - i n f o p r o f i l k e l u r a h a n
- i n f o l i n g k u n g a n - i n f o p e n d u d u k p e r l in g k u n g a n
- i n f o r u m a h i b a d a h
F 1
a d m i n
F 2
l in g k u n g a n
F 3
p e n d u d u k
F 4
R u m a h ib a d a h
F 5
B u k u t a m u Pe m b u a t a n
L a p o r a n
2 . 0
Gambar 4.2 Data Flow Diagram Level 0 Website Kelurahan PoloniaPolonia
Universitas Sumatera Utara
S t a r t
T a m p i l h a l a m a n h o m e B a c a l i n k
H o m e ?
T a m p i l h a l a m a n h o m e P r o f i l
? T a m p i l h a l a m a n p r o f i l
B u k u T a m u ?
T a m p i l h a l a m a n b u k u t a m u
L o g i n A d m i n ?
L o g i n a d m i n C l o s e
? S t o p
y y
y
y n
n n
n
l o g i n
y n
x
C o n t a c t U s ?
y n
T a m p i l h a l a m a n c o n t a c t u s
S t r u k t u r ?
T a m p i l h a l a m a n s t r u k t u r O r g a n i s a s i
y n
4.3 Flowchart Sistem
Flowchart merupakan bagan yang menunjukkan alir didalam program atau prosedur sistem secara logika. Adapun flowchart yang didesain penulis adalah sebagai berikut:
Gambar 4.3 Flowchart Halaman Utama Home
Universitas Sumatera Utara
Login
Tampil halaman login admin
Input username,pass-
word
Ketemu ?
Pesan
y n
Menu administrator
Admin
Gambar 4.4 Flowchart Halaman Login Admin
Universitas Sumatera Utara
Admin
Tampilkan Menu Admin
Baca Menu Adm in Pilihan 1
? Pilihan 2
?
Pilihan 3 ?
Pilihan 4 ?
Logout ?
Data lingkungan
Data penduduk
Data rumah ibadah
A
B
C
x
n
n
n
n y
y y
y y
n
Tampil halaman buku tamu
Pilihan 1 = Tampil halaman buku tam u Pilihan 2 = D ata Lingkungan
Pilihan 3 = D ata Penduduk Pilihan 4 = D ata R umah Ibadah
Gambar 4.5 Flowchart Halaman Menu Administrator
Universitas Sumatera Utara
A
Tampilkan halaman data
lingkungan
Input data
Save ?
Simpan data
Lingkungan Batal
?
Kosongkan form
Admin
y n
y n
Gambar 4.6 Flowchart Halaman Data Lingkunga
Universitas Sumatera Utara
B
Tam pilkan halam an data
penduduk
Input data
S ave ?
S im pan data
P enduduk B atal
?
K osongkan form
A dm in
y n
y n
Gambar 4.7 Flowchart Halaman Data Penduduk
Universitas Sumatera Utara
C
Tam pilkan halam an data
rum ah ibadah
Input data
Save ?
Simpan data
Rum ah Ibadah Batal
?
Kosongkan form
Adm in
y n
y n
Gambar 4.8 Flowchart Halaman Data Rumah Ibad
Universitas Sumatera Utara
4.4 Mempersiapkan Database Server