MODUL 1-7

LAPORAN AKHIR PRAKTIKUM

PRAKTIKUM PEMGORAMAN WEB

Di Susun Oleh :

NAUFAL INSAN KAMIL

18041100133

PROGRAM STUDI SISTEM INFORMASI

JURUSAN TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS TRUNOJOYO MADURA
2020
 DAFTAR ISI

DAFTAR GAMBAR .............................................................................ii

BAB I PENGERTIAN .......................................................................... 1

1.1 Pengertian HTML .................................................................... 1

1.2 Pengertian CSS/BOOTSTRAP ................................................ 1

1.3 Pengertian JQUERY ............................................................... 1

1.4 Pengertian PHP ........................................................................ 1

1.5 Pengertian MYSQL .................................................................. 2

BAB II HASIL DAN PEMBAHASAN ...............................................3

2.1 Bahan Praktikum....................................................................3

2.2 Pembahasan Modul 1 .............................................................3

2.3 Pembahasan Modul 2 .............................................................5

2.4 Pembahasan Modul 3 .............................................................9

2.5 Pembahasan Modul 4 ...........................................................11

2.6 Pembahasan Modul 5 ...........................................................15

2.7 Pembahasan Modul 6 ...........................................................16

2.8 Pembahasan Modul 7 ...........................................................17

BAB III PENUTUP ...........................................................................18

3.1 Analisis ................................................................................18

3.2 Kesimpulan ..........................................................................18

DAFTAR PUSAKA ...............................................................................

REFERENSI ..........................................................................................

i
 DAFTAR GAMBAR

Pembahasan Modul 1 ............................................................................3

Pembahasan Modul 2 ............................................................................5

Pembahasan Modul 3 ............................................................................9

Pembahasan Modul 4 ..........................................................................11

Pembahasan Modul 5 ..........................................................................15

Pembahasan Modul 6 ..........................................................................16

Pembahasan Modul 7 ..........................................................................17

ii
 Bab I

Pengenalan

1. Pengertian HTML
HTML adalah scipt yang digunakan untuk membuat tampilan halaman web.
HTML bukan bahasa pemrograman, sehingga HTML tidak bisa digunakan
untuk membuat sebuah fungsi sistem. HTML adalah singkatan dari Hypertext
Markup Language. HTML menggunakan kode tag untuk menandai bagian
dalam HTML.

2. Pengertian CSS
CSS adalah bahasa yang digunakan untuk menentukan model / gaya / style
sebuah dokumen HTML. Dengan kata lain, CSS akan menentukan bagaimana
sebuah elemen HTML di tampilkan. Sebagai contoh, dengan menggunakan
CSS, kita bisa menentukan agar sebuah halaman HTML ditampilkan dengan
warna biru.

3. Pengertian JQUER
JQuery adalah sebuah library framework javascript. jadi singkat ceritanya
JQuery merupakan pengembangan dari javascript yang sengaja di buat untuk
memudahkan kita untuk mendevelop sebuah website dan ingin membuat
efek-efek dan keperluan penggunaan javascript lainnya di dalam
pengembangan sebuah website. sampai saat ini jQuery sudah sangat di kenal
di dunia web programming. sehingga banyak plugin-plugin web lainnya yang
di bangun menggunakan JQuery sebagai base nya. contohnya seperti plugin
calender, grafik, export html to image, design komponen web dan sebagainya.
Hampir semua developer dunia sekarang sudah aktif menggunakan jquery
sebagai pengganti javascript. artinya developer tidak perlu lagi mengetikkan
syntax javascript yang terbilang cukup panjang-panjang untuk sebuah event.
oleh karena itu banyak yang sudah aktif menggunakan jquery karena jquery
juga merupakan pengembangan dari javascript. javascript sudah di bungkus
menjadi fungsi-fungsi yang tinggal di gunakan saja pada jquery. untuk
menggunakan jquery yang harus di lakukan adalah menghubungkan file
jquery dengan file html atau php yang ingin kita hubungkan. caranya sama
dengan cara menghubungkan file js seperti biasa.

4. Pengertian PHP
PHP adalah singkatan dari Hypertext Prepocessor dan merupakan bahasa
pemrograman yang di desain khusus untuk web development atau
pengembangan web. PHP memiliki sifat Server-Side karena PHP dijalankan
atau di eksekusi dari sisi server. maksud di jalankan dari sisi server adalah
PHP di jalankan pada komputer server dan bukan pada komputer client. PHP
di jalankan melalui aplikasi web browser sama halnya seperti HTML.

1
5. Pengertian MYSQL
MySQL adalah sebuah database manajemen system (DBMS) popular yang
memiliki fungsi sebagai relational database manajemen system (RDBMS).
Selain itu MySQL software merupakan suatu aplikasi yang sifatnya open
source serta server basis data MySQL memiliki kinerja sangat cepat, reliable,
dan mudah untuk digunakan serta bekerja dengan arsitektur client server atau
embedded systems[4]. Dikarenakan faktor open source dan popular tersebut
maka cocok untuk mendemontrasikan proses replikasi basis data. Berkaitan
dengan uraian di atas, maka peneliti bermaksud untuk melakukan penelitian
yang berkaitan dengan keamanan sistem dan jaringan komputer dan replikasi
basis data yang di buat dalam bentuk perancangan replikasi basis data
MySQL dengan mekanisme pengamanan menggunakan SSL Encryption
dengan tujuan untuk meningkatkan faktor keamanan data dalam jaringan
komputer.

2
 BAB II
HASIL DAN PEMBAHASAN
2.1 Bahan Praktikum
Bahan yang di perlukan untuk pelaksanaan praktikum
1. Text Editor, Disini saya menggunakan Sublime
2. Browser, Disini saya menggunakan Crome
2.2 Pembahasan Modul 1
A. Soal
1. Buat tampilan full HTML seperti pada contoh berikut

Gambar 2.1

2. Buat tampilan full HTML seperti contohberikut

Gambar 2.2
B. Penyelesaian
1. Soal1

Gambar 2.3

2. Soal 2

Gambar 2.4

3
Source Code :

Soal 1 dan 2

Gambar 2.5

Tutorial 1:

Untuk soal 1 terdapat 3 tabel kolom dan 3 tabel baris. Perintah yang digunakan
pada html yaitu <table> untuk membuat table , <tr> untuk mendefinisikan baris
table , <td> untuk membuat isi baris/cell, Rowspan disini berfungsi untuk
menggabungkan 2 baris tabel menjadi 1 baris bagian, Colspan disini berfungsi
untuk menggabungkan 3 kolom menjadi 1 kolom

Tutorial 2:

Untuk soal 2 terdapat 4 tabel kolom dan 2 tabel baris. Perintah yang digunakan
pada html yaitu <table> untuk membuat table , <tr> untuk mendefinisikan baris
table , <td> untuk membuat isi baris/cell, Colspan disini berfungsi untuk
menggabungkan 4 tabel kolom menjadi 1 kolom.

4
 2.3 Pembahasan Modul 2
Buat tampilan full seperti pada contoh berikut

Gambar 2.1

Gambar 2.2

Penyelesaian

Gambar 2.3

2.1.1.1 Soal 2

Gambar 2.4

5
Source Code :

Tutorial 1:

Untuk soal 1 <h2> disini berfungsi sebagai judul dan pengatur besaran/ukuran
huruf pada web. Terdapat 7 besaran yakni (h1,h2,h3,h4,h5,h6,h7), <br> disini
fungsinya sebagai enter agar memberi jarak pada tampilan web. <a herf =”#”>
disini fungsinya sebagai teks link sehingga jika kita mengklik teks tersebut akan
tertuju pada halaman yang telah di set pada link tersebut.

Tutorial 2:

Untuk soal no 2 <form> disini berfungsi untuk membuat form pada web, <class =
”form-grop row”> tipe form yang digunakan pada web, <label
for=”inputEmail,inputPassword,inputTelepon> sebagai label yang bisa di
inputkan angka atau huruf, <col-sm-2-form-label> = sebagai pengatur jarak antara
Kata Email dan tabel inputan, <button> sebagai tombol perintah setelah kita
menginputkan data,maka data akan di proses.

6
2.4 Pembahasan Modul 3
A. Soal
1. Apa itu Jquery ?
2. Dengan menggunakan jquery, buatlah aplikasi
untuk menghitung modus, mean, max, min, dari
beberapa data yang diinputkan secara dinamis!
B. Penyelasaian

1. JQuery adalah sebuah library framework

javascript. Jadi singat cerita JQuery merupakan
pengembangan dari javascript yang sengaja di
buat untuk memudahka kita untuk mendevelop
sebuah website dan ingin membuat efe-efek dan
keperluan penggunaan javascript lainnnya di
dalam pengembangan sebuah website. Sampai
saat ini JQuery sudah sangat dikenak di dunia
web programing. Sehingga banyak plugin-plugin
web lainnya yang di bangun menggunakan
JQuery sebagai basenya. Contohnya seperti pugin
calender, grafik, export html to imgae, design
komponen web dan sebagainya.
2.

Gambar 2.3

7
Source Code :

Gambar 2.4

Tutorial :

Untuk <input> disini berfungsi sebagai kita menambahkan bilangan atau angka
yang akan kita eksekusi pada program yang telah kita buat, <scrip
type=”text/javascript”> disini fungsinya sebagai penghubung antar javascript dan
html dengan menghubungkan <src=”https://.....”> yang fungsinya sebagai tempat
file yang javascript berada(Online).$(‘#hasil1).val(....(..)); disini berfungsi untuk
menampilkan data yang telah di eksekusi. function min(data)berfungsi sebagai
menghubungkan rumus dengan fungsi yang akan ditampilkan.

8
2.5 Pembahasan Modul 4
A. Soal
1. Apa itu PHP
2. Buatkan aplikasi cara menghitung modus, mean,
max, min, dari beberapa data yang diinputkan
secara dinamis
B. Penyelasaian
1. PHP adalah singkatan dari Hypertext Prepocessor
dan merupakan bahasa pemrograman yang di
desain khusus untuk web development atau
pengembangan web. PHP memiliki sifat Server-
Side karena PHP dijalankan atau di eksekusi dari
sisi server. maksud di jalankan dari sisi server
adalah PHP di jalankan pada komputer server
dan bukan pada komputer client. PHP di
jalankan melalui aplikasi web browser sama
halnya seperti HTML.
2.

Gambar 2.2

9
Source Code :

Gambar 2.3

Tutorial :

Untuk <?php> disini berfungsi sebagai bahasa pemograman yang di gunakan pada
projek, <”funcition> disini fungsinya sebagai modul program yang berisi rumus
perhitungan dari progrm utama

<case”mean”>pemanggilan class dalam perhitungan .($count)syntax yang

berfungsi untuk menghitung banyak angka yang di masukkan. ($sum) syntax yang
berfungsi untuk menambkan secara otomatis data yang di inputkan.($total)
berfungsi sebagai pemanggil hasil akhir dengan rumus ($sum/$count) = banyak
angka yang otomatis di tambahkan / banyak angka yang di inputkan.

<case max>pemanggilan class dalam perhitungan. Rshort($array) berfungsi

mengambil angka terbesar yang di inputkan. ($s1rg = $array[0) disini untuk
pemanggilan dalam penampilan nanti. ($total= $s1rg) menampilkan angka
terbesar yang telah di inputkan.

10
<case min> sama dengan case max dengan perbedaan disini menggukana
Short($array) mengambilkan angka terkecil yang di inputkan.

<case modus> pemanggilan class dalam perhitungan. ($v =array_count_values)

berfungsi sebagai menghitung jumlah nilai yang terdapat di dalam array.
Arshort($array) berfungsi mengurutkan array asosiatif. Foreach($v as
$v=>$v){$total = $k;break;} rumus dalam perhitungan modul yang mengambil
angka terbanyak muncul.

<html> disini saya menggunakan html untuk membuat form dalam penginputan.
<label>Masukkan Angka, Pisah angka dengan tanda (;) :</label>

<input type="text" name="data" value="<?php echo($data); ?>"> sebagai inputan

angka pada label.

11
2.6 Pembahasan Modul 5
A. Soal
1. Apa itu Mysql?
2. Cari studi kasus database, desain database
(tabel,kolom,relasi) jelaskan perinta sql untuk
melakukan CRUD di semua tabel inputkan data
ke database anda, minimal 20 record
B. Penyelasaian
1. MySQL adalah sebuah database manajemen
system (DBMS) popular yang memiliki fungsi
sebagai relational database manajemen system
(RDBMS). Selain itu MySQL software merupakan
suatu aplikasi yang sifatnya open source serta
server basis data MySQL memiliki kinerja sangat
cepat, reliable, dan mudah untuk digunakan serta
bekerja dengan arsitektur client server atau
embedded systems[4]. Dikarenakan faktor open
source dan popular tersebut maka cocok untuk
mendemontrasikan proses replikasi basis data.
Berkaitan dengan uraian di atas, maka peneliti
bermaksud untuk melakukan penelitian yang
berkaitan dengan keamanan sistem dan jaringan
komputer dan replikasi basis data yang di buat
dalam bentuk perancangan replikasi basis data
MySQL dengan mekanisme pengamanan
menggunakan SSL Encryption dengan tujuan
untuk meningkatkan faktor keamanan data
dalam jaringan komputer.
2.

Gambar 2.1

12
Source Code :
Create

Gambar 2.2

13
Read

Gambar 2.3

14
Update

Gambar 2.4

Delete

Gambar 2.5

15
 2.7 Pembahasan Modul 6
A. Soal
1. Buat Form untuk memasukkan data tambahan
2. Buat Fom untuk menghapus data dari list
B. Penyelasaian
1.

Gambar 2.1

2.

Gambar 2.2

16
 2.8 Pembahasan Modul 7
A. Soal
1. Menampilkn data dengan menggunakan filter
pencarian
B. Penyelasaian
1.

Gambar 2.1

Hasil

Gambar 2.2

17
 BAB III

PENUTUP

3.1 ANALISA
Analisa yang dapat diambil dari tugas akhir praktikum kali ini kita
dapat mengetahui apa itu dasar dalam pembuatan sebuah website, dan cara
kerja website. Kita juga mengaplikasikan ilmu yang telah di pelajari dalam
praktikum tersebut dalam membuat sebuah website.
3.2 KESIMPULAN
Kesimpulan yang dapat kita ambil dari modul akhiar adalah kita
dapat membuat sebuah website dalam basis php dengan menghubungkan
database dan diperbagus dngan html,dan css.

Manfaat sebuah website sendiri adalah:

1. Kita dapat memasarkan sebuah produk atau brand pada sebuah website
sehingga produk atau brand tersebut dapat dikenl oleh masyarakat
khususnya pengguna internet.
2. Website juga berfungsi sebagai media informasi dalam menyampaikan
sebuah berita,ilmu,dan berbagai lainnya sehingga kita dapat meng-explor
lebih banyak ilmu dalam sebuah jejaring digital.

18
 DAFTAR PUSTAKA
Modul Akhir Praktikum Pemograman Berbasis Web Universitas Trunojoyo
Madura,Bangkalan,Jawa Timur.

REFRENSI
https://www.malasngoding.com/belajar-php-dasar-pengenalan-dan-kegunaan-php/

19