Download - Pertemuan 2 Istilah dalam Aplikasi Web.ppt
![Page 1: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/1.jpg)
Aplikasi web
Pengantar Aplikasi Web
![Page 2: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/2.jpg)
Aplikasi web
• Web Application or Webapp
• Sebuah aplikasi yang diakses melalui web melalui
sebuah jaringan internet atau intranet.
• Webapp merupakan software aplikasi komputer• Webapp merupakan software aplikasi komputer
yang dihasilkan dari kode/bahasa pemrograman
yang disupport oleh browser,seperti HTML, ASP,
PHP, JSP, dll.
• Untuk menjalankan aplikas web diperlukan
sebuah browser.
![Page 3: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/3.jpg)
Web
• World Wide Web = WWW = web
• Web adalah sebuah sistem interlinked
hpertext document yang diakses melalui
internet.internet.
• WWW dibuat oleh Sir Tim Berners- Lee tahun
1989 yang juga membuat standar pembuatan
web seperti Mark Up Languange (seperti :
HTML)
![Page 4: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/4.jpg)
Web Browser
• Sebuah aplikasi perangkat lunak yang memungkinkan seorang user untukmenampilkan dan berinteraksi melalui teks, gambar, audio, video dan informasi lainnyapada sebuah halaman web (web page) padapada sebuah halaman web (web page) padasebuah website melalui WWW atau Local Area Network (LAN).
• Contohnya : Internet Explorer, Mozilla Firefox, Opera.
![Page 5: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/5.jpg)
Bagaimana proses mengakses sebuah
halaman web
![Page 6: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/6.jpg)
1 - Address
• http ://www.example.com
• HTTP : Hypertext Transfer Protocol
• HTTP : Adalah sebuah protokol komunikasi untukpertukaran informasi pada intranet maupuninternet.internet.
• Tujuan awalnya adalah untuk menyediakan caramem-publish dan mendapatkan hypertext pagesmelalui internet
• www.example.com adalah sebuah DNS (Domain Name System)
![Page 7: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/7.jpg)
1 - DNS
• DNS berfungsi sebagai ‘phone book’ bagi
internet
• Contoh : www.example.com adalah sebuah
domain untuk IP 208.77.188.166domain untuk IP 208.77.188.166
![Page 8: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/8.jpg)
2 - request
![Page 9: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/9.jpg)
3- Web Server
• Web Server
– Software : Sebuah program komputer yang
bertanggung jawab untuk menerima HTTP
request dari client, kemudian memberikan HTTP request dari client, kemudian memberikan HTTP
response yang berupa halaman web
– Hardware : komputer yang menjalankan fungsi
diatas.
• Contoh : Apache untuk PHP, Tomcat untuk JSP.
• Versi Apache terbaru : 2.x.x
• Sebuah pc yang terinstall Apache sudah dapat
dikatakan sebagai web server.
![Page 10: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/10.jpg)
3 - PHP
• PHP : Preprocessor Hypertext , sebuah
scripting language untuk membuat web
dinamis.
• Versi terbaru : 5.x.x• Versi terbaru : 5.x.x
![Page 11: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/11.jpg)
4,5 - MySQL
![Page 12: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/12.jpg)
4,5 - MySQL
• MySQL adalah sebuah Software Database.
• Software database lainnya : Ms. Access,
Oracle, Ms. SQL Server.
• Versi terbaru : 5.x.x• Versi terbaru : 5.x.x
![Page 13: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/13.jpg)
6,7 - response
![Page 14: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/14.jpg)
8 – web pages
• Response dari server adalah berupa HTML
yang diterjemahkan oleh browser.
• Selain HTML : CSS, JavaScript
• CSS : Cascading Style Sheets yaitu scripting• CSS : Cascading Style Sheets yaitu scripting
yang digunakan untuk mengatur tampilan
halaman web
• JavaScript : Bahasa scripting yang digunakan di
dalam web browser untuk menghasilkan
sebuah aplikasi web yang lebih responsif
![Page 15: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/15.jpg)
aplikasi web VS aplikasi desktop
• Aplikasi web tidak memerlukan instalasi di
Client, aplikasi desktop harus diinstall di client
• Aplikasi web memerlukan web server, aplikasi
desktop tidak memerlukan (ingat : web server desktop tidak memerlukan (ingat : web server
tidak harus komputer khusus,hal ini
tergantung pada seberapa besar resource
yang dibutuhkan oleh aplikasi)
• Performa aplikasi web bergantung pada
kecepatan akses pada jaringan dan performa
web server, aplikasi desktop bergantung pada
pc dimana aplikasi diinstall.
![Page 16: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/16.jpg)
Arsitektur aplikasi (web/dekstop)
• Single tier/One tier
• Two Tier
• Three Tier
![Page 17: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/17.jpg)
One tier
• Sebuah arsitektur yang menggabungkan
presentation, business logic dan persistence/data
dalam satu tier.
• Presentation adalah user interface, dimana user • Presentation adalah user interface, dimana user
berinteraksi dengan aplikasi,
• Business logic adalah aturan dari aplikasi yang
dijalankan
• Persistence/data adalah informasi yang disimpan
secara permanen. Contohnya dalam bentuk file
atau database.
• Contoh dari aplikasi One Tier adalah aplikasi
![Page 18: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/18.jpg)
Two tier
• Pada aplikas Two tier, persentation terpisah
dengan business dan persistence.
• Contohnya adalah aplikasi web (komputer
praktikan mengakses komputer dosen) ataupraktikan mengakses komputer dosen) atau
aplikasi desktop client servaer (aplikasi SIAKAD
Amik Master Komputer)
• Coba akses web server pada komputer dosen
![Page 19: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/19.jpg)
Three Tier
• Pada aplikas Three tier, antara presentation,
business dan persistence terpisah.
![Page 20: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/20.jpg)
Pembagian tugas dalam web
application
• Web Designer
– User Interface Designer
– Graphic designer
• Web Programmer• Web Programmer
– Programmer (PHP,ASP,JSP)
• Database Architect
![Page 21: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/21.jpg)
Siapkan kertas 1 lembar ☺
![Page 22: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/22.jpg)
Pertanyaan (4 menit)
• Tuliskan tag pembuka dan penutup script php,
• Tampilkan ‘hello world ’ menggunakan fungsi
php,
• Tuliskan simbol yang digunakan untuk• Tuliskan simbol yang digunakan untuk
mendeklarasikan variabel dalam php, berikan
contohnya,
• Sebutkan software yang diperlukan untuk
membangun sebuah aplikasi web
menggunakan php
![Page 23: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/23.jpg)
Pertanyaan (6 menit)
• Apa yang akan ditampilkan dari script berikut:if(1 < 0){
echo “a”;
}else{
echo “b”;echo “b”;
}
• Apa yang akan ditampilkan dari script berikut:for($i=0;$i<10;$i++){
echo $i;
}
• Sebutkan fungsi-fungsi php untuk mengakses
database MySQL
![Page 24: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/24.jpg)
Studi Kasus
• Tugas akhir/skripsi : membuat aplikasi web
– 1 buah pc pentium III dengan RAM 256 sudahcukup ☺ (sebagai web server)
– 1 atau 2 buah pc sebagai client
– OS : Windows XP atau windows 2000
– Sotfware : Apache, PHP, MySQL diinstall di pc yang akan digunakan untuk server. Jika tidak akanmenginstall manual install saja WAMP atauXAMPP, dan lupakan PHPTriad ☺
– Software : Macromedia dreamweaver dan Adobe photoshop sudah cukup memadai ☺
– Arsitektur : Two tier
![Page 25: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/25.jpg)
Pembagian tim kerja
• 1 tim terdiri dari 5/6 orang
• 1 tim memiliki 1 leader
• Kumpulkan daftar nama
![Page 26: Pertemuan 2 Istilah dalam Aplikasi Web.ppt](https://reader036.vdokumen.com/reader036/viewer/2022070222/613d6e86736caf36b75d41c3/html5/thumbnails/26.jpg)
Next
• Membuat web statis : HTML
• Membuat web statis : HTML + JavaScript