PERTEMUAN 1
TUJUAN PEMBELAJARAN
• Tujuan pembelajaran matakuliah praktikum
Web Programming 1 adalah mahasiswa
diharapkan dapat memahami dan mengerti
konsep dasar dalam pembuatan web dan
mampu membuat sebuah Web Informasi
Kontrak Perkuliahan
• Di pertemuan 1 mahasiswa diminta untuk
membuat kelompok untuk tugas pembuatan web
informasi.
• Setiap kelompok dapat beranggotakan 4 – 6
anggota.
• Setiap kelompok diharuskan untuk membuat
sebuah web informasi sederhana.
• Setiap kelompok akan diminta untuk
mempresentasikan tugas yang sudah dibuat di
pertemuan 14 dan pertemuan 15
Pertemuan
ke-
Pokok Bahasan Keterangan
1 Konsep Dasar Web, Pengenalan HTML, & PHP
2 Dasar-Dasar PHP
3 Operator
4 Pengenalan Form dan Pengenalan Adobe
Dreamweaver
5 Form Lanjutan
6 Percabangan
7 Review Materi & Quis
8 UTS (Ujian Tengah Semester)
9 Pembuatan Database MYSQL
10 Pengolahan Halaman Buku Tamu (Studi Kasus I)
11 Pengolahan Halaman Buku Tamu (Studi Kasus I
Lanjutan )
12 Pengolahan Halaman Artikel (Studi Kasus II)
13 Pengolahan Halaman Index Pengunjung (Studi
Kasus III)
14 Presentasi Tugas Kelompok
15 Presentasi Tugas Kelompok
16 UAS (Ujian Akhir Semester)
Silabus
Tema Web
• Web Informasi Sekolah
• Web Informasi Toko Kue
• Web Informasi Toko Baju
• Web Informasi Universitas
• Web Informasi Perpustakaan
• Web Informasi Toko Bunga
• Web Informasi Komunitas
Konsep Dasar Web
• Internet
Internet merupakan “kependekan dari kata
“internetwork”, yang berarti rangkaian komputer
yang terhubung menjadi beberapa rangkaian
jaringan”. Sistem komputer terhubung secara global
dan menggunakan TCP/IP sebagai protocol. Secara
umum internet dapat diartikan sebagai pertukaran
informasi dan komunikasi. Semua informasi bisa
didapatkan dengan mudah dan bebas di internet
tanpa ada batasan.
Ada beberapa istilah yang sering digunakan apabila
anda bekerja dengan internet diantaranya yaitu:
• World Wide Web (WWW)
• Website
• Web Pages (Halaman Web)
• Home Page (Halaman Muka)
• Browser
• URL (Universal Resource Locator)
• HTTP (Hypertext Transfer Protocol)
Lanjutan…
• DNS (Domain Name System)
• TCP/IP (Transmission Control Protocol /
Internet Protocol)
• IP (Internet Protocol)
• Hyperlink
• Web Browser
Perangkat Lunak Web Server
• Web Server adalah sebuah perangkat lunak
server yang berfungsi menerima permintaan
HTTP atau HTTPS dari Client yang dikenal
dengan web browser dan mengirimkan
kembali hasilnya dalam bentuk halaman-
halaman web yang umumnya berbentuk
dokumen HTML. Server web yang terkenal
diantaranya adalah:
Lanjutan…
• Apache, web server antar platform
XAMPP
PHPTriad; discontinued
Apache2Triad
• Internet Information Service (IIS), hanya dapat
berjalan di sistem operasi MS Windows
Struktur Navigasi
• Struktur Navigasi adalah “Susunan menu atau
hirarki dari suatu situs yang menggambarkan
isi dari setiap halaman dan link atau navigasi
tiap halaman pada suatu situs web”.
• Ada 4 macam bentuk dasar dari peta navigasi
yang biasa digunakan dalam proses
pembuatan aplikasi multimedia, yaitu:
Ada 4 macam bentuk dasar dari peta navigasi
yang biasa digunakan dalam proses pembuatan
aplikasi multimedia, yaitu:
• Struktur Navigasi Linier
• Struktur Navigasi Hirarki
• Struktur Navigasi Non-Linier
• Struktur Navigasi Campuran
PENGENALAN HTML
• Hypertext Markup Language (HTML) adalah
sebuah bahasa untuk menampilkan konten di
web. HTML sendiri adalah bahasa
pemrograman yang bebas, artinya tidak
dimiliki oleh siapapun, pengembangannya
dilakukan oleh banyak orang di banyak Negara
dan bias dikatakan sebagai sebuah bahasa
yang dikembangkan bersama-sama secara
global.
Struktur Dasar HTML
Contoh penggunaan script HTML
• Contoh01.php
Judul Web
Perintah dibuat di antara
<body> dan <body>
Lanjutan…
• simpan file di atas di dalam folder
c:XAMPPhtdocs buat folder baru untuk
menyimpan file di dalam folder htdocs.
Simpan file dengan nama contoh01.php.
• Untuk melihat hasil dari file di atas dapat
menggunakan browser Mozilla, google
chrome, internet explorer atau jenis browser
lain. Ketikkan pada address bar
“LocalhostNama Folder Penyimpanan”,
kemudian pilih file contoh01.php
Hasil Contoh 01
• Hasilnya :
Contoh script penggunaan Tag
HTML
• Contoh02.php
Hasil Contoh 02
• Hasilnya :
Pembuatan Tabel Menggunakan
HTML
• Contoh03.php
Hasil Contoh 03
Latihan
• Latihan :
• Buat script HTML untuk bentuk tampilan di
bawah ini :
PENGENALAN PHP
• Pengertian PHP (PHP Hypertext Preprocessor)
PHP atau PHP Hypertext Prepocessor adalah
sebuah bahasa pemrograman web berbasis
server (server-side) yang mampu mem-parsing
kode php dari kode web dengan ekstensi .php,
sehingga menghasilkan tampilan website yang
dinamis di sisi client (browser).
Kode PHP
• Memasukkan Kode PHP
Hasil akhir pengolahan kode PHP akan dikembalikan
lagi dalam bentuk kode HTML untuk ditampilkan di
browser. Ada 4 jenis tag yang bisa digunakan untuk
memasukkan kode PHP.
Jenis Tag Tag Pembuka Tag Penutup
Tag Standar <? php ?>
Tag Pendek <? ?>
Tag ASP <% %>
Tag Script <script language =
“php”>
</script>
Contoh Script PHP

More Related Content

PPT
P9 desain-web-statis-dinamis
PPTX
Tugas 2 0317 individu
PPTX
Konsep Teknologi Web
DOCX
Konsep teknologi web
PDF
Asas cakephp-mvc
PDF
Modul dasar pemrograman web
PDF
Buku pemrograman web html-css-javascript
DOC
Bab 4 tools-pemrograman-web-dan-database
P9 desain-web-statis-dinamis
Tugas 2 0317 individu
Konsep Teknologi Web
Konsep teknologi web
Asas cakephp-mvc
Modul dasar pemrograman web
Buku pemrograman web html-css-javascript
Bab 4 tools-pemrograman-web-dan-database

What's hot (10)

DOC
Tutorial
PPTX
PPTX
Installasi moodle
PPT
1989249
PDF
Modul pemrograman web
PDF
PDF
Kursus PHP Profesional
PPTX
Part 1 - pengenalan website
PDF
Belajar PHP
PDF
Pemrograman Web - Protokol HTTP
Tutorial
Installasi moodle
1989249
Modul pemrograman web
Kursus PHP Profesional
Part 1 - pengenalan website
Belajar PHP
Pemrograman Web - Protokol HTTP
Ad

Similar to 726 p01 (20)

PPTX
Pertemuan ke 1
PPTX
Pengenalan web minggu pertama
PPT
pertemuan 1 pemrograman web dasar pada PPLG.ppt
PDF
Materi-1-Pemrograman Web.pdf
PDF
Pbw week 01 basics
PPT
Materi-1 Dasar dasar Web-dan-HTML-php.ppt
PDF
Webprograming
PDF
Web programming
PDF
W E B P R O G R A M M I N G
PPTX
Pemrograman Web 1 - Pengenalan Web Dasar
PPT
Pengenalan_Pemrograman_Web_Berbasis_HTML.ppt
PPT
Pemrograman-Berbasis-Web-Pertemuan-1.ppt
PPT
Pemrograman-Berbasis-Web-Pertemuan-1.ppt
PPT
pertemuan_pertama_teori.ppt
PPT
pertemuan_pertama_teori.ppt
PPT
pemrogaman web part 1 untuk pembelajaran .ppt
PPTX
Kelompok iv
DOCX
Modul dasar web
PPT
Materi Pertemuan teori pemograman Web. teori
PPTX
Pertemuan_1_-_Pendahuluan0912423443.pptx
Pertemuan ke 1
Pengenalan web minggu pertama
pertemuan 1 pemrograman web dasar pada PPLG.ppt
Materi-1-Pemrograman Web.pdf
Pbw week 01 basics
Materi-1 Dasar dasar Web-dan-HTML-php.ppt
Webprograming
Web programming
W E B P R O G R A M M I N G
Pemrograman Web 1 - Pengenalan Web Dasar
Pengenalan_Pemrograman_Web_Berbasis_HTML.ppt
Pemrograman-Berbasis-Web-Pertemuan-1.ppt
Pemrograman-Berbasis-Web-Pertemuan-1.ppt
pertemuan_pertama_teori.ppt
pertemuan_pertama_teori.ppt
pemrogaman web part 1 untuk pembelajaran .ppt
Kelompok iv
Modul dasar web
Materi Pertemuan teori pemograman Web. teori
Pertemuan_1_-_Pendahuluan0912423443.pptx
Ad

726 p01

  • 2. TUJUAN PEMBELAJARAN • Tujuan pembelajaran matakuliah praktikum Web Programming 1 adalah mahasiswa diharapkan dapat memahami dan mengerti konsep dasar dalam pembuatan web dan mampu membuat sebuah Web Informasi
  • 3. Kontrak Perkuliahan • Di pertemuan 1 mahasiswa diminta untuk membuat kelompok untuk tugas pembuatan web informasi. • Setiap kelompok dapat beranggotakan 4 – 6 anggota. • Setiap kelompok diharuskan untuk membuat sebuah web informasi sederhana. • Setiap kelompok akan diminta untuk mempresentasikan tugas yang sudah dibuat di pertemuan 14 dan pertemuan 15
  • 4. Pertemuan ke- Pokok Bahasan Keterangan 1 Konsep Dasar Web, Pengenalan HTML, & PHP 2 Dasar-Dasar PHP 3 Operator 4 Pengenalan Form dan Pengenalan Adobe Dreamweaver 5 Form Lanjutan 6 Percabangan 7 Review Materi & Quis 8 UTS (Ujian Tengah Semester) 9 Pembuatan Database MYSQL 10 Pengolahan Halaman Buku Tamu (Studi Kasus I) 11 Pengolahan Halaman Buku Tamu (Studi Kasus I Lanjutan ) 12 Pengolahan Halaman Artikel (Studi Kasus II) 13 Pengolahan Halaman Index Pengunjung (Studi Kasus III) 14 Presentasi Tugas Kelompok 15 Presentasi Tugas Kelompok 16 UAS (Ujian Akhir Semester) Silabus
  • 5. Tema Web • Web Informasi Sekolah • Web Informasi Toko Kue • Web Informasi Toko Baju • Web Informasi Universitas • Web Informasi Perpustakaan • Web Informasi Toko Bunga • Web Informasi Komunitas
  • 6. Konsep Dasar Web • Internet Internet merupakan “kependekan dari kata “internetwork”, yang berarti rangkaian komputer yang terhubung menjadi beberapa rangkaian jaringan”. Sistem komputer terhubung secara global dan menggunakan TCP/IP sebagai protocol. Secara umum internet dapat diartikan sebagai pertukaran informasi dan komunikasi. Semua informasi bisa didapatkan dengan mudah dan bebas di internet tanpa ada batasan.
  • 7. Ada beberapa istilah yang sering digunakan apabila anda bekerja dengan internet diantaranya yaitu: • World Wide Web (WWW) • Website • Web Pages (Halaman Web) • Home Page (Halaman Muka) • Browser • URL (Universal Resource Locator) • HTTP (Hypertext Transfer Protocol)
  • 8. Lanjutan… • DNS (Domain Name System) • TCP/IP (Transmission Control Protocol / Internet Protocol) • IP (Internet Protocol) • Hyperlink • Web Browser
  • 9. Perangkat Lunak Web Server • Web Server adalah sebuah perangkat lunak server yang berfungsi menerima permintaan HTTP atau HTTPS dari Client yang dikenal dengan web browser dan mengirimkan kembali hasilnya dalam bentuk halaman- halaman web yang umumnya berbentuk dokumen HTML. Server web yang terkenal diantaranya adalah:
  • 10. Lanjutan… • Apache, web server antar platform XAMPP PHPTriad; discontinued Apache2Triad • Internet Information Service (IIS), hanya dapat berjalan di sistem operasi MS Windows
  • 11. Struktur Navigasi • Struktur Navigasi adalah “Susunan menu atau hirarki dari suatu situs yang menggambarkan isi dari setiap halaman dan link atau navigasi tiap halaman pada suatu situs web”. • Ada 4 macam bentuk dasar dari peta navigasi yang biasa digunakan dalam proses pembuatan aplikasi multimedia, yaitu:
  • 12. Ada 4 macam bentuk dasar dari peta navigasi yang biasa digunakan dalam proses pembuatan aplikasi multimedia, yaitu: • Struktur Navigasi Linier • Struktur Navigasi Hirarki • Struktur Navigasi Non-Linier • Struktur Navigasi Campuran
  • 13. PENGENALAN HTML • Hypertext Markup Language (HTML) adalah sebuah bahasa untuk menampilkan konten di web. HTML sendiri adalah bahasa pemrograman yang bebas, artinya tidak dimiliki oleh siapapun, pengembangannya dilakukan oleh banyak orang di banyak Negara dan bias dikatakan sebagai sebuah bahasa yang dikembangkan bersama-sama secara global.
  • 15. Contoh penggunaan script HTML • Contoh01.php Judul Web Perintah dibuat di antara <body> dan <body>
  • 16. Lanjutan… • simpan file di atas di dalam folder c:XAMPPhtdocs buat folder baru untuk menyimpan file di dalam folder htdocs. Simpan file dengan nama contoh01.php. • Untuk melihat hasil dari file di atas dapat menggunakan browser Mozilla, google chrome, internet explorer atau jenis browser lain. Ketikkan pada address bar “LocalhostNama Folder Penyimpanan”, kemudian pilih file contoh01.php
  • 17. Hasil Contoh 01 • Hasilnya :
  • 18. Contoh script penggunaan Tag HTML • Contoh02.php
  • 19. Hasil Contoh 02 • Hasilnya :
  • 22. Latihan • Latihan : • Buat script HTML untuk bentuk tampilan di bawah ini :
  • 23. PENGENALAN PHP • Pengertian PHP (PHP Hypertext Preprocessor) PHP atau PHP Hypertext Prepocessor adalah sebuah bahasa pemrograman web berbasis server (server-side) yang mampu mem-parsing kode php dari kode web dengan ekstensi .php, sehingga menghasilkan tampilan website yang dinamis di sisi client (browser).
  • 24. Kode PHP • Memasukkan Kode PHP Hasil akhir pengolahan kode PHP akan dikembalikan lagi dalam bentuk kode HTML untuk ditampilkan di browser. Ada 4 jenis tag yang bisa digunakan untuk memasukkan kode PHP. Jenis Tag Tag Pembuka Tag Penutup Tag Standar <? php ?> Tag Pendek <? ?> Tag ASP <% %> Tag Script <script language = “php”> </script>