Scribd
Unggah
67 tayangan20 halaman

Pemrograman Web Lanjut

Diunggah oleh

Revky Pratama
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
67 tayangan20 halaman

Pemrograman Web Lanjut

Diunggah oleh

Revky Pratama
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 20

Pemrograman

Web Lanjut
Erwin Mardinata
Pertemuan 1

Pengenalan Web Development


Materi

Pendahuluan Web Development


Komponen Utama dalam Web
Development
Tools yang Dibutuhkan untuk Web
Development
Langkah-langkah Awal Membuat
Halaman Web Sederhana
01
Pendahuluan Web
Development
Web Development

Web development adalah proses


pembuatan dan pemeliharaan situs web.
Web developer mengerjakan segala aspek
situs, dari tampilan (frontend) hingga
backend yang mengolah data dan
membuat aplikasi dapat berfungsi dengan
baik.
Arsitektur Web (Client-Server)

Client: Adalah perangkat (seperti browser) yang


digunakan pengguna untuk mengakses situs
web.
Server: Adalah komputer tempat aplikasi web
di-host dan dijalankan.
Request-Response Model: Browser (client)
mengirimkan permintaan (request) ke server.
Server memproses permintaan dan mengirimkan
respons berupa halaman HTML.
02
Komponen Utama
dalam Web
Development
Ada beberapa komponen yang penting dalam membangun
sebuah situs web dinamis

1. HTML (Hypertext Markup Language)

HTML adalah bahasa markup yang digunakan untuk membuat


struktur dasar halaman web. Elemen-elemen HTML
membentuk fondasi situs web, seperti heading, paragraf,
tautan, gambar, dan tabel.
Ada beberapa komponen yang penting dalam membangun
sebuah situs web dinamis

2. PHP (Hypertext Preprocessor)

PHP adalah bahasa pemrograman server-side yang digunakan


untuk mengolah data dan menghasilkan halaman web dinamis.
PHP dapat berkomunikasi dengan database, memproses
formulir, dan menangani logika aplikasi web.
Ada beberapa komponen yang penting dalam membangun
sebuah situs web dinamis

3. MySQL (Database)

MySQL adalah sistem manajemen basis data relasional yang


digunakan untuk menyimpan data yang diperlukan oleh
aplikasi web. MySQL memungkinkan kita untuk menyimpan dan
mengelola data pengguna, konten artikel, dan informasi lain
yang dinamis.
03
Tools yang
Dibutuhkan untuk
Web Development
Code Editor

Editor teks yang digunakan untuk menulis kode


HTML, PHP, dan SQL. Beberapa pilihan populer
adalah:
VSCode (Visual Studio Code)
Sublime Text
Notepad++
XAMPP atau Laragon

Local server stack yang terdiri dari Apache


(server web), MySQL (database), dan PHP (bahasa
pemrograman). XAMPP atau Laragon
memungkinkan kita untuk menjalankan situs web di
komputer lokal tanpa memerlukan hosting online.
Web Browser

Web browser digunakan untuk melihat hasil dari


halaman web yang dibuat. Beberapa browser
populer adalah:
Google Chrome
Mozilla Firefox
Microsoft Edge
04
Langkah-langkah
Awal Membuat
Halaman Web
Sederhana
Membuat Folder Proyek

Buka code editor (misal: VSCode).


Buat folder baru bernama belajar-web di dalam folder
htdocs (untuk XAMPP) atau di direktori proyek Laragon.
Membuat Halaman HTML Pertama

Buat file baru di dalam folder belajar-web dan beri nama index.html.
Tuliskan kode HTML berikut:

Simpan file.
Menjalankan Halaman di Browser

Pastikan XAMPP atau Laragon sudah berjalan (Apache


harus aktif).
Buka browser dan ketik URL berikut:
http://localhost/belajar-web/index.html

Halaman web pertama akan tampil di browser.


Struktur Dasar Dokumen HTML
Setiap halaman HTML memiliki struktur dasar yang harus diikuti.
Berikut adalah elemen-elemen utama:
<!DOCTYPE html>: Menandakan bahwa dokumen ini
menggunakan HTML5.
<html>: Elemen utama yang membungkus semua konten
halaman.
<head>: Bagian ini berisi metadata tentang halaman (seperti
judul, pengaturan karakter, dll.) yang tidak tampil di
halaman.
<title>: Judul halaman yang tampil di tab browser.
<body>: Bagian ini berisi semua konten yang akan
ditampilkan di halaman, seperti teks, gambar, dan tautan.
Thank You

Anda mungkin juga menyukai