TUTORIAL DIGITAL

PENGINDERAAN JAUH DAN

SISTEM INFORMASI GEOGRAFI
TEKNOLOGI INFORMASI
ACARA 1
WEB SERVER / WEB SERVICE DENGAN
XAMPP, WAMP, DAN MS4W

Disusun oleh :
Nama

: Ilham Guntara, A.Md.

Website

: www.guntara.com

(Bebas diakses dengan menyertakan sumber)

GUNTARA INDONESIA CORPORATION

DAERAH ISTIMEWA YOGYAKARTA
2015

I. JUDUL
Web Service (Web Server)

II. TUJUAN
1. Memahami fungsi web service (web server).
2. Memahami macam-macam perangkat lunak pengelola web server.
3. Memahami web server apache pada perangkat lunak pengelola web server.
4. Melatih menjalankan perangkat lunak web server XAMPP, WAMP, dan
MS4W.
5. Melatih membuat halaman (HTML dan PHP) pada perangkat lunak web
server XAMPP, WAMP, dan MS4W.

III. ALAT DAN BAHAN

1. Alat tulis
2. Kertas HVS
3. Perangkat lunak XAMPP
4. Perangkat lunak WAMP
5. Perangkat lunak MS4W
6. Seperangkat komputer dengan sistem operasi Windows XP

IV. TINJAUAN PUSTAKA

Web service atau web server merupakan perangkat lunak yang menyediakan
layanan

akses

kepada

pengguna

melalui

protokol

komunikasi HTTP atau HTTPS atas berkas-berkas yang terdapat pada suatu situs
web, pengguna menggunakan aplikasi tertentu berupa web browser dalam
melakukan permintaan. Halaman-halaman web yang dikirim oleh web server
biasanya berupa file-file HTML dan CSS yang nantinya akan diparsing atau ditata
oleh browser sehingga menjadi halaman-halaman web yang bagus dan mudah
dibaca.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

Sejarah web server dimulai di tahun 1989, Tim Berners-Lee lewat CERN
(European Organization for Nuclear Research) mengajukan sebuah proyek yang
bertujuan untuk mempermudah pertukaran informasi antar para peneliti dengan
menggunakan sistem hiperteks. Sebagai hasil atas implementasi proyek ini, tahun
1990 Berners-Lee menulis dua program komputer:
1. Server web pertama di dunia, yang kemudian dikenal sebagai CERN httpd,
yang berjalan pada sistem operasi NeXTSTEP.
2. Sebuah peramban yang dinamainya sebagai WorldWideWeb (WWW).
Tahun 1994, Tim Berners-Lee memutuskan untuk membakukan organisasi
World Wide Web Consortium (W3C) untuk mengatur pengembanganpengembangan lanjut atas teknologi-teknologi terkait lainnya (HTTP, HTML, dan
lain-lain) melalui proses standardisasi.
Fungsi utama sebuah server web adalah untuk mentransfer berkas atas
permintaan pengguna melalui protokol komunikasi yang telah ditentukan.
Disebabkan sebuah halaman web dapat terdiri atas berkas teks, gambar, video, dan
lainnya pemanfaatan server web berfungsi pula untuk mentransfer seluruh aspek
pemberkasan dalam sebuah halaman web yang terkait; termasuk di dalamnya teks,
gambar, video, atau lainnya.
Pengguna, biasanya melalui aplikasi web browser, meminta layanan atas
berkas ataupun halaman web yang terdapat pada sebuah server web, kemudian
server sebagai manajer layanan tersebut akan merespon balik dengan mengirimkan
halaman dan berkas-berkas pendukung yang dibutuhkan, atau menolak permintaan
tersebut jika halaman yang diminta tidak tersedia.
Saat ini umumnya server web telah dilengkapi pula dengan mesin
penerjemah bahasa skrip yang memungkinkan server web menyediakan layanan
situs web dinamis dengan memanfaatkan pustaka tambahan seperti PHP, ASP.
Pemanfaatan server web saat ini tidak terbatas hanya untuk publikasi situs web,
pada prakteknya server web banyak pula digunakan dalam perangkat-perangkat
keras lain seperti printer, router, kamera web yang menyediakan akses layanan http
dalam jaringan lokal yang ditujukan untuk menyediakan perangkat manajemen
serta mempermudah peninjauan atas perangkat keras tersebut

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

Cara kerja dari web server sebenarnya sangat mudah kita pahami. Contoh
paling mudah seperti berikut; kita akan membuka sebuah halaman website, yang
biasanya berupa URL http://www.wikipedia.org/home.htm. Kita akan mengetikkan
URL tersebut di peramban atau browser kemudian menekan tombol enter, tanpa
kita ketahui proses yang terjadi di belakang layar atau di dalam browser itu sendiri,
maka akan muncullah halaman website di layar monitor komputerkita. Proses yang
akan terjadi pada browser adalah browser akan membentuk koneksi dengan web
server, meminta halaman website dan menerimanya. Web server kemudian
mengecek permintaan tersebut apakah tersedia atau tidak.
Apabila tersedia, maka web server akan mengirimkan data kepada browser.
Apabila permintaan tidak ditemukan atau terjadi error maka web server akan
mengirimkan pesan error kepada browser. Pembentukan koneksi, permintaan data,
penerimaan

data

dari

browser

ke

web

server

diatur

dalam

sebuah

kode RFC2616. RFC2616 mencantumkan status web server dalam bentuk

kombinasi tiga angka yang memiliki arti berbeda-beda.
Salah satu jenis web server yang paling populer saat ini adalah Apache Web
Server. Apache merupakan web server terbaik berdasarkan riset dari Netcraft
dengan pengguna terbanyak. Kelebihannya dengan tiingkat kehandalan dan
kestabilan yang tinggi serta fitur-fitur yang terbilang sangat lengkap membuat
banyak pengguna mempercayakan Apache sebagai web server mereka. Selain itu
sifatnya sebagai open source membuat web server ini menjadi web server yang
gratis. Apache yang bersifat open source ini membuat para pengguna web server
memfavoritkannya dan banyak dukungan-dukungan yang datang dari komunitaskomunitas dan sponsor untuk ikut mengembangkan web server ini sehingga
menjadikan web server ini semakin handal. Apache web server dapat berjalan pada
sistem operasi berbasis Windows atau Unix. Apache mempunyai program
pendukung yang cukup banyak. Hal ini memberikan layanan yang cukup lengkap
bagi penggunanya.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

V. METODE
A. Perangkat Lunak Web Server XAMPP
1. Menyiapkan alat dan bahan praktikum
2. Menekan tombol On pada CPU dan monitor.
3. Menunggu hingga tampil layar desktop.
4. Menunggu hingga pointer berwujud panah muncul (artinya sistem
sudah siap untuk menerima perintah).
5. Memilih menu Start > All Programs > XAMPP for Windows > XAMPP
Control Panel.
6. Memilih start Apache pada jendela XAMPP yang muncul.

7. Muncul tulisan running, tandanya web server Apache sudah berjalan

pada XAMPP.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

8. Membuka web browser Mozilla Firefox dengan memilih menu Start

lalu mengklik Mozilla Firefox.
9. Menuliskan pada address bar Mozilla Firefox dengan tulisan localhost
lalu menekan enter.

10. Membuka Windows Explorer dengan mengklik kanan My Computer

lalu memilih explore.
11. Membuka folder Praktikum TI pada volume disk D di komputer
melalui Windows Explorer.
12. Menyalin dua file yaitu latihan1 dan latihan2 dari folder Praktikum
TI tersebut dengan cara mengklik kanan lalu memilih copy atau
dengan menekan tombol Ctrl+C.

13. Membuka Local Disk C lalu masuk ke folder xampp > htdocs > latihan1
di komputer melalui Windows Explorer.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

14. Mem-paste dua file yang sebelumnya telah di-copy ke dalam folder
tersebut dengan cara mengklik kanan lalu memilih 'pase' atau dengan
cara menekan tombol Ctrl+V.

15. Mengklik kanan pada file latihan1 lalu memilih open with notepad
untuk memanipulasi konten dari file HTML tersebut.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

16. Menuliskan TI 1 pada title dan menuliskan nama_NIM padabody

dengan ketentuan sebagai berikut:

17. Menyimpan file yang sudah dimanipulasi tersebut dengan cara memilih
menu file > save atau menekan tombol Ctrl+S.
18. Mengubah nama file yang sudah dimaniplasi tersebut menjadi
index.html dengan cara mengklik kanan > rename atau menekan F2
pada file tersebut.

19. Membuka web browser Mozilla Firefox dengan memilih menu Start
lalu mengklik Mozilla Firefox.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

20. Menuliskan pada address bar Mozilla Firefox dengan tulisan

localhost/latihan1/ lalu menekan enter.

21. Melakukan printscreen pada halaman web yang tampil tersebut.

22. Mengklik kanan pada file latihan2 lalu memilih open with notepad
atau memilih edit untuk memanipulasi konten dari file PHP tersebut.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

10

23. Menuliskan Selamat Pagi_NIM pada script file tersebut dengan

ketentuan sebagai berikut:

24. Menyimpan file yang sudah dimanipulasi tersebut dengan cara memilih
menu file > save atau menekan tombol Ctrl+S.
25. Mengubah nama file yang sudah dimaniplasi tersebut menjadi
index.php dengan cara mengklik kanan > rename atau menekan F2
pada file tersebut.

26. Membuka web browser Mozilla Firefox dengan memilih menu Start
lalu mengklik Mozilla Firefox.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

11

27. Menuliskan pada address bar Mozilla Firefox dengan tulisan

localhost/latihan1/ lalu menekan enter.

28. Melakukan printscreen pada halaman web yang tampil tersebut.

29. Memilih menu Start > All Programs > XAMPP for Windows > XAMPP
Control Panel.
30. Memilih stop Apache pada jendela XAMPP yang muncul untuk
mematikan Apache pada XAMPP.

B. Perangkat Lunak Web Server WAMP

1. Mengarahkan pointer ke pojok bawah kanan dekstop.
2. Memilih icon WAMP lalu memilih Apache > Start Service.

3. Membuka web browser Mozilla Firefox dengan memilih menu Start

lalu mengklik Mozilla Firefox.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

12

4. Menuliskan pada address bar Mozilla Firefox dengan tulisan localhost

lalu menekan enter.

5. Membuka Windows Explorer dengan mengklik kanan My Computer

lalu memilih explore.
6. Membuka folder Praktikum TI pada volume disk D di komputer
melalui Windows Explorer.
7. Menyalin dua file yaitu latihan1 dan latihan2 dari folder Praktikum
TI tersebut dengan cara mengklik kanan lalu memilih copy atau
dengan menekan tombol Ctrl+C.

8. Membuka Local Disk C lalu masuk ke folder wamp > www > latihan1
di komputer melalui Windows Explorer.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

13

9. Mem-paste dua file yang sebelumnya telah di-copy ke dalam folder

tersebut dengan cara mengklik kanan lalu memilih 'pase' atau dengan
cara menekan tombol Ctrl+V.

10. Mengklik kanan pada file latihan1 lalu memilih open with notepad
untuk memanipulasi konten dari file HTML tersebut.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

14

11. Menuliskan TI 1 pada title dan menuliskan Selamat Makan_NIM

padabody dengan ketentuan sebagai berikut:

12. Menyimpan file yang sudah dimanipulasi tersebut dengan cara memilih
menu file > save atau menekan tombol Ctrl+S.
13. Mengubah nama file yang sudah dimaniplasi tersebut menjadi
index.html dengan cara mengklik kanan > rename atau menekan F2
pada file tersebut.

14. Membuka web browser Mozilla Firefox dengan memilih menu Start
lalu mengklik Mozilla Firefox.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

15

15. Menuliskan pada address bar Mozilla Firefox dengan tulisan

localhost/latihan1/ lalu menekan enter.

16. Melakukan printscreen pada halaman web yang tampil tersebut.

17. Mengarahkan pointer ke pojok bawah kanan dekstop.
18. Memilih icon WAMP lalu memilih Apache > Stop Service.

C. Perangkat Lunak Web Server MS4W

1. Membuka Windows Explorer dengan mengklik kanan My Computer
lalu memilih explore.
2. Membuka Local Disk C lalu masuk ke folder ms4w di komputer
melalui Windows Explorer.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

16

3. Menjalankan apache pada MS4W dengan mendobel klik file apacheinstall.bat pada folder tersebut.

4. Membuka web browser Mozilla Firefox dengan memilih menu Start

lalu mengklik Mozilla Firefox.
5. Menuliskan pada address bar Mozilla Firefox dengan tulisan localhost
lalu menekan enter.

6. Memilih MapLab 2.2 pada jendela MS4W di web browser tersebut.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

17

7. Memilih Map Browser pada tampilan MapLab yang muncul.

8. Memilih open map untuk membuka peta dari folder komputer.

9. Mencari peta gmap75.map lalu memilih open

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

18

10. Memilih disable pada ROSA untuk menampilkan peta tersebut.

11. Peta telah berhasil ditampilkan pada halaman MS4W di web browser.

12. Melakukan printscreen pada tampilan tersebut.

13. Peta pada halaman MS4W dapat digeser-geser, diperkecil, maupun
diperbesar sesuai keinginan.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

19

14. Membuka Local Disk C lalu masuk ke folder ms4w > tmp > ms_tmp di
komputer melalui Windows Explorer untuk mengetahui Log aktivitas
yang dilakukan pada halaman peta MS4W di web browser.

15. Membuka Local Disk C lalu masuk ke folder ms4w di komputer

melalui Windows Explorer.
16. Mematikan Apache pada MS4W dengan mendobel klik file apacheuninstall.bat pada folder tersebut.

17. Menutup semua jendela program pada komputer.

18. Membereskan kabel-kabel dan switch.
19. Mematikan komputer dengan baik dan benar.
20. Merapikan kembali alat dan bahan praktikum.

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

20

VIII. HASIL
1. Printscreen Localhost XAMPP

2. Printscreen Latihan XAMPP

a. HTML

b. PHP

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

21

3. Printscreen Start dan Stop Apache pada XAMPP

a. Start

b. Stop

4. Printscreen Localhost WAMP

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

22

5. Printscreen Latihan WAMP

6. Printscreen Start dan Stop Apache pada WAMP

a. Start

b. Stop

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

23

7. Printscreen Localhost MS4W

8. Printscreen Maplap MS4W

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com

24

9. Printscreen Start dan Stop Apache pada MS4W

Tutorial PJSIG Ilham Guntara, A.Md. www.guntara.com