MODUL KEAHLIAN GANDA

1 MODUL KEAHLIAN GANDA Mata Pelajaran Reakayasa Perangkat Lunak Sekolah Menengah Kejuruan (SMK) Kelompok Kompetensi F PEMROGRAMAN WEB Penulis: Abd. Mu...
Author:  Yohanes Susman
216 downloads 572 Views 3MB Size
Report
DOWNLOAD PDF

Recommend Documents

... kode sesudah ...

by

7. Akses web dengan URL http://localhost/myproyek 8. Jalankan program di web browser tampilkan dan analisa hasilnya..

4. Membangun web dinamis (halaman admin), Langkah-langkah yang dilakukan untuk mebangun web dinamis anatra lain adalah sebagai berikut: 1. Buka file dashboard.html, ubah beberapa kode program menjadi seperti dibawah ini. Simpan dengan nama dashboard.php dalam folder views! C:xampp/htdocs/myproyek/application/ 1



147

2 3 4 5 6 7 8 9 10 11

<metacharset="utf-8"> <metaname="viewport"content="width=device-width, initial-scale=1"> Dashboard Admin /assets/css/bootstrap.min.css"rel="stylesheet"> /assets/style/dashboard.css"rel="stylesheet"> ... kode sesudah ...

2. Buat controller Admin.php dalam folder controllers, tulis kode dibawah ini! C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6 7 8 9 10

load->model('web_model'); $data['artikel']=$this->web_model->get_data_artikel(); $this->load->view('dashboard',$data); } } 4. Buka kembali file dashboard.php, ubah kode seperti dibawah ini,

kode ini digunakan untuk menampilkan data yang ada dalam database yang telah disimpan dalam sebuah tipe data array. C:xampp/htdocs/myproyek/application/

52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 50

148

... kode sebelum ... # Judul Konten Aksi judul;?> konten;?>
51 52 53 54 55 56 57

info">Update Hapus
... kode sesudah ...

btn-

5. Akses web dengan URL http://localhost/myproyek/index.php/admin 6.

Jalankan program tampilkan dan analisa hasilnya

4. Membangun form tambah artikel pada halaman admin: 1. Buka file form_artikel.html, ubah beberapa kode seperti dibawah ini, simpan dengan nama form_artikel.php dalam folder application views! C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6 7 8 9 10 52 53 54 55 56 57 58 59 60

<metacharset="utf-8"> <metaname="viewport"content="width=device-width, initial-scale=1"> Dashboard Admin /assets/css/bootstrap.min.css"rel="stylesheet"> /assets/style/dashboard.css"rel="stylesheet"> ... kode antara ... index.php/admin/do_tambah"method="POST">
Simpan Cancel

2. Tambahkan kode seperti dibawah ini dalam class Admin (file Admin.php)

149

3. Jalankan program dan tampilkan serta analisis hasilnya !

5. Membangun form update artikel pada halaman admin: 1. Buka file form_update.html, ubah beberapa kode seperti dibawah ini, simpan dengan nama form_update.php dalam folder application views! C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6 7 8 9 10

52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73

<metacharset="utf-8"> <metaname="viewport"content="width=device-width, initial-scale=1"> Dashboard Admin /assets/css/bootstrap.min.css"rel="stylesheet"> /assets/style/dashboard.css"rel="stylesheet"> ... kode antara ... index.php/admin/do_update"method="POST"> id;?>">
konten;?> Update Cancel

2. Tambahkan kode seperti dibawah ini dalam class Admin (file Admin.php) C:xampp/htdocs/myproyek/application/ 1 2 3 4 5

150

publicfunction update_artikel($id){ $this->load->model('web_model'); $data['artikel']=$this->web_model->get_for_update($id); $this->load->view('form_update',$data); }

6 7 8 9 10 11 12 13

publicfunction do_update(){ $judul =$_POST['judul']; $konten =$_POST['konten']; $id =$_POST['id']; $this->load->model('web_model'); $this->web_model->update_artikel($judul,$konten,$id); redirect(base_url()."index.php/admin"); }

3. Jalankan program dan tampilkan serta analisis hasilnya !

6. Membangun perintah untuk hapus artikel 1. Tambahkan kode seperti dibawah ini dalam class Admin (file Admin.php) C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6

publicfunction do_hapus($id){ $this->load->model('web_model'); $this->web_model->hapus_artikel($id); redirect(base_url()."index.php/admin"); }

2. Jalankan program dan tampilkan serta analisis hasilnya !

E. Latihan Soal Rancanglah sebuah halaman kontak yang nantinya berfungsi untuk pengiriman pesan oleh pengunjung web kepada admin, pesan dikirim melalui form halaman kontak, dan semua pesan yang dimasukan akan muncul dalam bentuk daftar pada halaman admin! Untuk antarmuka dari halaman kontak dan admin anda dapat menggunakan hasil dari studi kasus pada Kegiatan Pembelajaran pertama.

F. Rangkuman Back-End web adalah bagian utama dari sebuah web site yang berfokus pada pemrograman sisi server dan database. Segala fitur yang ada pada web dinamis seperti mengambil data, memasukan data, menghapus data dan mengupdate data adalah dibangun pada bagian back-end development. Seorang back-end developer minimal menguasai pemrograman sisi server seperti PHP dan DBMS seperti MySQL.

151

H. Umpan Balik dan Tindak Lanjut 1. Apakah saudara memahami konsep arsitektur MVC(Model View Controller)? 2. Apakah saudara memahami apa itu back-end Application? 3. Apakah saudara mengetahui cara menggunakan framework CodeIgnniter? 4. Apakah saudara mengetahui fitur-fitur dan keunggulan CodeIgniter web framework? 5. Setelah saudara melakukan kegiatan pembelajaran untuk modul “Membangun

Back-End

Application

dengan

Konsep

MVC

Menggunakan Framework CodeIgniter ” ini, silahkan mengisi tabel 12 secara jujur dan sesuai dengan kemampuan yang telah anda dapatkan!

Tabel 12. Tindak Lanjut

IPK

152

Hasil yang didapat

Rencana Tindak Lanjut

153

Membangun Sistem Autentikasi A. Tujuan Pembelajaran Melalui praktikum diharapkan peserta diklat dapat menerapkan sistem autentikasi pada aplikasi atau dokumen web.

B. Indikator Pencapaian Kompetensi Menerapkan sistem autentikasi pada aplikasi atau dokumen web

C. Uraian Materi Autentikasi adalah proses dalam rangka validasi user pada saat memasuki sistem, nama dan password dari user di cek melalui proses yang mengecek langsung ke daftar mereka yang diberikan hak untuk memasuki sistem tersebut. Autorisasi ini di set up oleh administrator, web master atau pemilik situs (pemegang hak tertinggi atau mereka yang ditunjuk di sistem tersebut). Untuk proses ini masing-masing user akan di cek dari data yang diberikannya seperti nama, password serta hal-hal lainnya yang tidak tertutup kemungkinannya seperti jam penggunaan, lokasi yang diperbolehkan. Autentikasi

merupakan

suatu

langkah

untuk

menentukan

atau

menginformasi bahwa seseorang adalah autentik atau asli. Melakukan autentikasi terhadap sebuah objek adalah melakukan konfirmasi terhadap kebenarannya. Sedangkan melakukan autentikasi terhadap seseorang biasanya adalah untuk memverifikasi identitasnya. Pada suatu sistem komputer, autentikasi biasanya terjadi pada saat login atau permintaan akses. Dalam aplikasi Web dibutuhkan mekanisme yang dapat melindungi data dari pengguna yang tidak berhak mengaksesnya, misalnya sebuah situs Web yang berisikan foto-foto keluarga dan hanya dapat diakses sesama anggota keluarga. Mekanisme ini dapat diimplementasikan dalam bentuk sebuah proses login yang biasanya terdiri dari tiga buah tahapan yaitu : identifikasi, Autentikasi dan otorisasi. Proses Autentikasi pada prinsipnya berfungsi sebagai kesempatan pengguna dan pemberi layanan dalam proses pengaksesan resource. Pihak 154

pengguna harus mampu memberikan informasi yang dibutuhkan pemberi layanan untuk berhak mendapatkan resourcenya. Sedang pihak pemberi layanan harus mampu menjamin bahwa pihak yang tidak berhak tidak akan dapat mengakses resource ini.

D. Aktifitas Pembelajaran 1. Identifikasi Kasus Pada Kegiatan Pembelajaran yang ke-12, telah dijelaskan bagaimana membangun sebuah halaman admin, akan tetapi aplikasi tersebut masih belum sempurna, karena semua user tanpa terkecuali bisa mengakses halaman tersebut, hal ini menjadi masalah karena seharusnya halaman admin hanya bisa diakses oleh pihak-pihak yang memiliki kewenangan saja. Pada Kegiatan Pembelajaran kali ini kita akan membangun sebuah system autentikasi, yang memberi batasan terhadap user untuk bisa mengakses halaman admin. User yang bisa mengakses halaman admin harus login terlebih dahulu dengan memasukan username dan password.

2. Membangun Sistem authentifikasi 1. Buka file autoload.php pada folder config, aktifkan libraries session! $autoload['libraries'] = array('database', 'session'); 2. Buat tabel pada database myproyek dengan nama akun dengan field id, username dan email. 3. Buat class controller Login, tulis kode dibawah ini dan simpan dengan nama Login.php C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6 7 8 9 10 11 12 13

load->view('login'); } publicfunction validasi_user(){ $username=$_POST['username']; $password=md5($_POST['password']); $this->load->model('akun_model'); $query=$this->akun_model->verifikasi_data($username,$password); if($query->num_rows()>0){ $data_user=array(

155

14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

'username'=>$username, 'logged_in'=>TRUE ); $this->session->set_userdata($data_user); redirect('admin'); }else{ header('location:'. base_url().'index.php/login/gagal_login'); } } publicfunction gagal_login(){ echo"Password atau username salah, Silahkan periksa kembali!"; } }

4. Buka file login.html, tuliskan kode dibawah ini, kemudian simpan dengan nama login.php C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33

156

<metacharset="utf-8"> <metaname="viewport"content="width=device-width, initial-scale=1"> Signin /assets/css/bootstrap.min.css"rel="stylesheet"> /assets/style/signin.css"rel="stylesheet"> index.php/login/validasi_user"method="POST"> Silahkan masuk Alamat Email Password Sign in

5. Buat class Akun_model, tuliskan code dibawah ini, simpan dengan nama Akun_model.php C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6 7 8 9 10

db->where('username',$username); $this->db->where('password',$password); $query=$this->db->get('akun'); return$query; } }

access

6. Buka controller admin, tambahkan kode fungsi dibawah ini! C:xampp/htdocs/myproyek/application/ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

publicfunction__construct(){ parent::__construct(); $this->is_logged_in(); } publicfunction is_logged_in (){ $logged_in=$this->session->userdata('logged_in'); if(!isset($logged_in)||$logged_in!=TRUE){ echo"Kamu tidak memiliki izin unntuk mengakses halaman ini, Silahkan login terlebih dahulu! "; die(); } } publicfunction logout(){ $session=$this->session->userdata('logged_in'); if($session!=TRUE){ header('location:'. base_url().'index.php/login'); }else{ $this->session->sess_destroy(); header('location:'. base_url().'index.php/login'); } }

7. Jalankan program pada web browser tampilkan dan analisis hasilnya.!

E. Latihan Soal Lakukan pengujian sistem autentikasi yang telah anda bangun, coba kunjungi URL: http://localhost/myproyek/index.php/admin tanpa login terlebih dahulu, apabila halaman admin masih bisa diakses tanpa login berarti sistem masih gagal, dan apabila halaman admin sudah tidak bisa diakses, berarti sistem autentikasi telah berhasil dibangun.

157

F. Rangkuman Autentikasi adalah proses dalam rangka validasi user pada saat memasuki sistem, nama dan password dari user di cek melalui proses yang mengecek langsung ke daftar mereka yang diberikan hak untuk memasuki sistem tersebut. Autentikasi merupakan suatu langkah untuk menentukan atau mengonfirmasi bahwa seseorang adalah autentik atau asli. Melakukan autentikasi terhadap sebuah objek adalah melakukan konfirmasi terhadap kebenarannya. Dalam aplikasi Web dibutuhkan mekanisme yang dapat melindungi data dari pengguna yang tidak berhak mengaksesnya, Proses Autentikasi pada prinsipnya berfungsi sebagai

kesempatan

pengguna

dan

pemberi

layanan

dalam

proses

pengaksesan resource. Pihak pengguna harus mampu memberikan informasi yang dibutuhkan pemberi layanan untuk berhak mendapatkan resourcenya. Sedang pihak pemberi layanan harus mampu menjamin bahwa pihak yang tidak berhak tidak akan dapat mengakses resource ini.

G. Umpan Balik dan Tindak Lanjut 1. Apakah anda sudah mampu membangun sistem autentikasi? 2. Apakah anda sudah mengetahui manfaat sistem autentikasi? 3. Setelah saudara melakukan kegiatan pembelajaran untuk modul “Membangun Sistem Autentikasi” ini, silahkan mengisi tabel 13 secara jujur dan sesuai dengan kemampuan yang telah anda dapatkan! Tabel 13. Tindak Lanjut

IPK

158

Hasil yang didapat

Rencana Tindak Lanjut

159

EVALUASI 1. Berikut ini adalah jenis browser yang digunakan untuk mengakses sebuah halaman web site, kecuali: A. B. C. D.

Mozilla Firefox Bootstrap Internet Explorer Google Chrome

2. Berikut ini adalah contoh perangkat lunak yang berfungsi sebagai web server kecuali? A. B. C. D.

Apache Internet Information Service (IIS) Internet Explorer (IE) Apache Tomcat

3. Jika anda ingin mengubah warna latar belakang pada halaman web site menjadi warna biru dengan menggunakan tag HTML, manakah diantara tag berikut ini yang paling tepat? A. B. C. D.



4. Kode HTML adalah berfungsi untuk A. B. C. D.

Menyisipkan gambar kedalam halaman web site Memberi bingkai pada gambar Membuat gambar dapat bergerak Tidak ada jawaban yang benar

5. Contoh salah satu penerapan tag HTML adalah Kirim Email , apakah fungsi dari tag tersebut? E. F. G. H.

Membuat hyperlink Membuat hyperlink Membuat hyperlink Membuat hyperlink

yang berfungsi untuk menampilkan halaman lain. yang berfungsi untuk memanggil alamat email. yang berfungsi untuk mengunduh sebuah file. yang berfungsi untuk mengunggah sebuah file.

6. Salah satu cara untuk menggunakan script CSS (Cascading Style Sheet) adalah dengan cara external. Manakah script yang paling tepat untuk mengimplementasikan cara tersebut? A. B. C. D.

160

<script type=”text/css” src=”style.css”>

7. Perhatikan script css berikut ini dengan seksama!

Manakah diantara kode berikut ini yang tepat untuk membuat huruf menjadi tebal dengan memanfaatkan script css tersebut? A. B. C. D.

Cetak Tebal
Cetak Tebal
Cetak Tebal
Cetak Tebal


8. Manakah bahasa pemrograman berikut ini yang menggunakan komunikasi server side dalam pemrosesannya? A. B. C. D.

PHP, JavaScript dan ASP.Net Bootstrap, CodeIgniter, JQuery ASP.Net, PHP, JSP CodeIgniter, AngularJS, Backbone

9. Berikut ini adalah penamaan variabel dalam PHP yang diperbolehkan kecuali: A. B. C. D.

$_nama $2nama $namaLengkap $for_nama

10. Dalam membangun back-end application, Pemrograman yang digunakan untuk mengkomunikasikan antara user dengan server dan database adalah . ... A. Server-side Scripting B. Client-side Scripting C. Database Server D. HTTP Server

11. Manakah diantara script PHP berikut ini yang berfungsi untuk melakukan perulangan sebanyak 100 kali dengan baik dan benar? A.

B.

161

D.

C.

12. Kode program dari JavaScript yang berfungsi untuk mengambil sebuah value dari input form adalah… A. B. C. D.

document.write() document.getElementByVal() document.getElementById().value document.getValue()

13. Selain menggunakan “if then else” untuk mengatasi permasalahan kondisi percabangan pada JavaScript dapat juga menggunakan…. A. B. C. D.

for… while… do while switch

14. Pada web dinamis, terdapat pemisahan antara layout web dengan konten web, hal ini yang menjadikan web dapat bekerja secara efisien. Hal itu disebabkan karena . . . . . . A. Saat konten berjumlah sangat banyak, tidak akan terjadi kesulitan saat pengelolaan atau memanipulasi data B. Saat konten berjumlah sangat banyak, Halaman akan diskses secara cepat dan ringan C. Database Server Data yang diminta dari server hanya data konten, sehingga web bekerja secara cepat D. Data yang diminta dari server hanya data konten, sehingga web bekerja secara cepat

15. Sistem autentikasi digunakan untuk pengkategorian user dalam pengaksesan atau pengelolaan aplikasi web. Hal tersebut perlu dilakukan karena . . . . . . A. Untuk memberian batasan pengunjung dan pengelola web, sehingga web dapat beroprasi secara semestinya B. Untuk memberikan hak akses kepada pengunjung sehingga pengunjung dapat mengunjungi web tanpa mengelolanya C. Untuk memberikan hak akses kepada pengunjung sehingga web dapat dikelola dengan baik D. Untuk memberikan kebebasan kepada pengunjung sehinggadapat mengakses web tanpa terganggu oleh system

162

16. Script PHP yang berfungsi untuk menghitung panjang karakter adalah.. A. B. C. D.

strlength() strlen() length() len()

17. Jika ada script echo substr("ALUN SUJJADA",0,4); Maka output yang dihasilkan adalah… A. B. C. D.

JADA ALUN 4 16

18. Jika ada script echo dihasilkan adalah…. A. 2 B. 5 C. 3 D. 4

strpos("SUJJADA","A");

Maka output yang

19. Manakah diantara pernyataan berikut ini yang paling tepat? A. CodeIgniter adalah framework untuk mempermudah pembuatan web dinamis berbasi Java. B. CodeIgniter adalah framework yang menerapkan konsep MVC (Model, View, Controller) C. CodeIgniter adalah sebuah web framework yang digunakan untuk pembuatan desain front-end D. Model pada CodeIgniter tidak diperbolehkan menuliskan fungsi untuk mengakses database.

20. Inti dari proses upload pada PHP adalah berada pada penerapan fungsi builtin yaitu move_uploaded_file() atau copy(). Script tersebut berfungsi untuk . . . A. B. C. D.

Memindahkan dari folder temporary ke folder tujuan upload Memindahkan dari folder temporary ke folder tujuan download Memindahkan dari folder temporary ke folder tujuan server Memindahkan dari folder temporary ke folder tujuan direktori local

163

164

PENUTUP

A. Kesimpulan Pemrograman web dinamis merupakan salah satu modul dari sepuluh modul diklat PKB. Modul grade 6 ini digunakan untuk pelatihan guru kejuruan Rekayasa Perangkat Lunak untuk jenjang diklat tingkat lanjut. Melalui modul ini peserta diklat diharapkan mampu memiliki kompetensi dalam membuat aplikasi berbasis web dinamis. Proses pembuatan aplikasi web dinamis diawali dengan pemahaman

tentang

perangkat-perangkat

yang

dibutuhkan

untuk

mengembangkan aplikasi web melalui aktifitas pembelajaran observasi dan analisis.

Dalam

ketrampilan

mengembangkan

dasar

yaitu

aplikasi

pembuatan

web

kode

dinamis program

ini

dibutuhkan

HTML.

Teknik

pengembangan web dinamis menggunakan server side scripting berbasis bahasa pemrograman PHP dengan menggabungkan CSS dan pemrograman java script. Pengembangan front end aplikasi menggunakan framework bootstrap. Pengembangan back-end aplikasi

menggunakan model MVC dan

data disimpan dalam database MySQL. studi kasus aplikasi yang dijadikan contoh untuk pengembangan adalah publikasi artikel. Dalam aplikasi tersebut pengguna dapat melihat dan mencari artikel sedangkan untuk mengedit, menambah dan menghapus artikel melalui proses authentifikasi user.

B. Tindak lanjut Modul diklat PKB guru RPL grade 6 ini memberikan kepada peserta didik pengetahuan dan ketrampilan dasar dalam mengembangkan aplikasi berbasi web. Dalam implementasi pengembangan aplikasi menggunakan penggabungan teknik web dinamis dasar dan pemrograman framework. Untuk menghasilkan aplikasi yang berkualitas, efektifitas dan efesiensi dalam pengembangan serta kompleksitas aplikasi yang tinggi dibutuhkan pemahaman, ketrampilan dan seni dalam

pengembangan

proyek

aplikasi

berbasis

web.

Modul

diklat

selanjutnyaakan memberikan pemahaman dan ketrampilan tentang manajeman proyek sistem informasi berbasis web. 165

166

DAFTAR PUSTAKA Duckett, Jon. (2011). HTML & CSS: Design and Build Websites. Canada: John Wiley & Sons, Inc. Jackson, Jeffrey C. (2007). Web Technologies: A Computer Sciense Perspective. United States of America: Pearson Prentice Hall. Kevin Tatroe, Peter Maclntyre and Rasmus Lerdorf. (2013). Programming PHP: Creating Dynamic Web Pages. United State of America: O’Reilly. Noxon, Robin. (2014). Learning PHP, MySQL, JavaScript, CSS & HTML5: A Step-By-Step Guide to Creating

Dynamic Websites. United States of

America: O’Reilly. https://id.wikipedia.org/wiki/XAMPP http://www.w3schools.com/ http://ihsanatkia.com/featur-lebih-dari-package-sublime-text/ http://www.htmlandcssbook.com/code-samples/ http://www.duniailkom.com/tutorial-belajar-javascript-pengertian-dan-fungsijavascript-dalam-pemograman-web/ https://id.wikipedia.org/wiki/MySQL https://id.wikipedia.org/wiki/PhpMyAdmin

167

168

GLOSARIUM

Address bar

Browser

Back-end

Client-side

CSS

Content

Download

FTP

Front-end

Home Page HTML

A : Kotak tempat penginputan alamat web lainnya pada web browser. B : Software yang digunakan untuk menelusuri dan menampilkan informasi dari web server, seperti Internet Explorer, Opera, Mozilla Firefox, dan Safari. : Berkaitan dengan alur program web dinamis. C : Operasi/kegiatan yang dilakukan di client dan tidak melibatkan server. Operasi yang terjadi hanya di browser, tidak ada permintaan data, verifikasi data ke server. : (Cascading Style Sheets): Bahasa yang direkomendasikan W3C (World Wide Web Consortium) untuk mendefiniskan style (seperti jenis, ukuran, warna huruf, dan lain-lain) pada dokumen web. : Isi sebuah website yang mencakup, teks, gambar, atau media-media lainnya. Content harus dibedakan dari layout. Yang disebut kemudian berhubungan dengan bagaimana sebuah halaman web ditampilkan. D : Transfer file atau informasi dari komputer lain ke komputer kita. Dalam istilah web, download berarti transfer file dari server web ke klien web. F : File Transfer Protocol, yaitu protokol yang memungkinkan seseorang mentransfer file dari satu komputer ke komputer lainnya. FTP biasa digunakan untuk menransfer file web kita ke komputer server atau penyedia hosting. : Berkaitan dengan user interface/tampilan website.

H : Halaman pertama dari situs web. : HyperText Markup Language. HTML merupakan bahasa yang digunakan untuk mendefinisikan sejumlah bagian dari sebuah dokumen web dalam bentuk tag, sehingga browser dapat mengetaui bagaimana menampilkan dokumen web tersebut 169

yang mencakup, link, text, gambar dan media-media lainnya seperti video dan audio. HTTP

Hypertext

: Kependekan dari Hypertext Transfer Protocol, yaitu aturan-aturan yang digunakan untuk menghubungkan dan mengirimkan dokumendokumen hypertext seperti web. : Tanda atau penunjuk ke dokumen lain web Hyperlink sinonim dengan hotlink, anchortext, atau link. : Hypertext adalah teks yang bisa di-klik.

Javascript

J : Bahasa pemrograman sisi-client.

Hyperlink

Login

Logout Link

Password

L : Otorisasi yang dilakukan oleh seorang user untuk masuk ke halaman pribadi dengan memasukkan username dan password di dalam sebuah jaringan komputer (termasuk internet). : Keluar dari otorisasi (login). : Koneksi hypertext antar halaman-halaman web. Sinonim dengan hotlink atau hyperlink. P : Kode rahasia yang digunakan oleh pengguna untuk dapat mengotorisasikan username yang dia miliki untuk dapat memasuki sebuah halaman pribadi di jaringan komputer (termasuk internet)

PHP Server

:

Server-side

:

Sistem Autentikasi Site

: :

Script

:

170

Bahasa pemrograman sisi-server S Sebuah komputer yang bertugas melayani pembagian serta pengolahan informasi yang diperlukan oleh Client. Server biasanya di kendalikan oleh seorang admin. Operasi/kegiatan yang dilakukan di server dalam konteks hubungan server-client. Sebagai contoh saat mengakses sebuah halaman web di komputer menggunakan browser, browser adalah client yang mengirim permintaan kepada server. Kemudian server merespon permintaan client. Sebelum merespon permintaan client lebih dulu terjadi kegiatan di server, seperti menerjemahkan permintaan client, memproses, memilih data dan sebagainya. Memiliki makna yang sama dengan system login. Sinonim dengan halaman web atau website. Dalam bahasa Indonesia, kita sering menyebutnya situs atau situs web. Adalah kumpulan perintah yang disusun dalam

bahasa komputer tertentu (Java, VisualBasic, CGI/Perl) untuk melakukan sebuah program interaktif atau animasi dalam sebuah webpage.

URL

Upload User

Website

Website Dinamis Web Programmer

Web Desainer Web Developer Web Master

Web Statis WWW

Web Client

Web server

U : Uniform Resource Locator, yaitu alamat dokumen atau sumber-sumber lain di internet. URL menyajikan informasi tentang bagaimana sebuah server serta alamat-alamat file lainnya diakses. : Kegiatan mentransfer atau mengirim suatu file ke komputer lain. : Pemakai atau pengguna dalam komputer (termasuk internet). W : Sekumpulan halaman-halaman web (web page), gambar, video atau aset-aset digital lainnya yang disimpan pada satu atau lebih web server, biasanya dapat diakses melalui internet. : Website yang dapat dirubah-ubah konponen maupun kontennya dan terkoneksi dengan database. : Seseorang yang perkerjaannya membuat website, akan tetapi terfokus pada membuat alur program website tersebut. : Seseorang yang pekerjaannya membuat website, akan terfokus pada tampilan atau desain. : Seseorang yang pekerjaannya membua website. : Seseorang yang melakukan kegiatan manajeman website untuk memastikan bahwa website tersebut dapat berfungsi dengan baik. : Website yang tidak dapat dirubah komponen maupun kontennya. : World Wide Web, Layanan internet berbasis hiperteks yang digunakan untuk menelusuri sumbersumber di internet. : Biasa disebut dengan browser atau perambaan adalan perangkat lunak yang digunakan untuk mengakses web server dengan mengirimkan pesan permintaan (request) HTTP dan mengolah response HTTP yang dihasilkan : Merupakan perangkat lunak dalam server yang berfungsi menerima permintaan (request) melalui HTTP dari client yaitu browser dan mengirimkan kembali response HTTP yang pada umumnya akan berbentuk dokumen HTML atau file.

171

HTTP (HyperText Transfer Protocol) adalah standart protokol komunikasi, protokol jaringan lapisan aplikasi yang digunakan untuk sistem informasi terdistribusi, kolaboratif, dan menggunakan hipermedia. URL (Uniform/Universal Resource Locator) merupakan suatu alamat yang digunakan untuk mengakses resource (file) yang berada pada jaringan intranet maupun internet. HTML (Hyper Text Markup Language) adalah Sebuah bahasa markup yang terdiri dari seperangkat kode-kode (tag markup) yang digunakan untuk mendeskripsikan dokumen web (halaman web). CSS (Cascading Style Sheets), CSS mendefinisikan bagaimana elemen HTML yang akan ditampilkan. CSS Bekerja dengan mengaitkan aturan denga elemen HTML, aturan-aturan ini yang nantinya mengatur bagaimana elemen ditampilkan. Client-Side Programming Languageadalah merupakan salah satu tipe bahasa pemograman yang pemrosesannya dilakukan oleh client (user, pengguna). Aplikasi client yang dimaksud merujuk kepada web browser seperti Google Chromedan Mozilla Firefox. Salah satu contoh Bahasa permograman jenis ini adalah Java script. Server-side Programming Languageadalah merupakan salah satu tipe Bahasa permograman yang hasil programnya (script program) berjalan di sisi server. Salah satu contoh Bahasa permograman ini adalah PHP. Dokumen PHP akan diparsing didalam web server oleh interpreter dan diterjemehkan dalam bentuk HTML dan akhirnya akan ditampilkan oleh browser yang dibuka oleh user. Front-End Web adalah bagian utama dari sebuah web site yang berinteraksi langsung dengan pengguna atau pengunjung situs. Segala sesuatu yang dilihat ketika melakukan navigasi dalam sebuah halaman web, baik dari font, warna, menu, dan segala yang menyangkut aspek desain yang nantinya menjadi user interface dari aplikasi web adalah hasil penggabungan dari fungsi HTML, CSS, dan JavaScript dikontrol oleh browser pada komputer. PHP adalah basaha bahasa pemrograman komputer Server-side scripting yang diciptakan khusus untuk menciptakan konten web dinamis Identifier adalah sebuah pegenal, dalam PHP identifier digunakan untuk memberi nama sebuah variabel, fungsi, konstanta atau class. Bootstrap adalah sebuah framework HTML, CSS dan Java Script yang menyediakan kumpulan komponen-komponen antarmuka dasar pada web yang telah dirancang sedemikian rupa untuk digunakan bersamasama. Selain komponen antarmuka, Bootstrap juga menyediakan sarana untuk membangun layout halaman dengan mudah dan rapi, serta modifikasi pada tampilan dasar HTML untuk membuat seluruh 172

halaman web yang dikembangkan senada dengan komponenkomponen lainnya. Autentikasi adalah proses dalam rangka validasi user pada saat memasuki sistem, nama dan password dari user di cek melalui proses yang mengecek langsung ke daftar mereka yang diberikan hak untuk memasuki sistem tersebut. SQL (Structure query language) adalah sebuah bahasa yang digunakan untuk me-request informasi dari basisdata. Bahasa ini dikembangkan oleh DBSM. Konstruksi SQL berbentuk atas kombinasi relational-algebra dan relational-calculus.SQL terdiri dari beberapa komponan, dua diantaranya yang sangat fundamental adalah DDL (Data Definition Language) dan DML (Data Manipulation Language).

173