Pemrograman Berbasis Web Pertemuan I
Outline Materi Kuliah Kontrak Kuliah Materi I (Pendahuluan) Tugas ??? Konsep client-server pada pemrograman web HTML CSS Tugas ???
Materi Kuliah (2) Pert. Materi / Sub Materi IV PHP (2) Koneksi Database : oracle, sqlserver, mysql, PHP Builtin Function V PHP (3) Object Oriented Propramming : Class Graphic VI KUIS & PRAKTEK VII UTS
Materi Kuliah (1) Pert. Materi / Sub Materi I PENDAHULUAN Konsep internet Object-object pada HTML CSS II Pemrograman Java Script Variabel, cookie Control Program : Perulangan, percabangan, function Validasi form III PHP (1) Introduction PHP Variabel, array, cookie, session Control Program : Perulangan, percabangan, procedure
Materi Kuiah (2) VIII Java Server Pages (1) JSP Scripting Element : expresion, scriptlet, declaration, variable JSP Directive, including File Session Database connection : JDBC IX Java Server Pages (2) Using Javabean in JSP File Operation X Java Server Pages (3) J2EE
Materi Kuliah (3) XI PRAKTEK 1 XII PRAKTEK 2 XIII TEKNOLOGI BARU (FRAMEWORK & CMS) XIV UAS
Konsep Internet Internet merupakan jaringan global yang menghubungkan suatu network dengan network lainya di seluruh dunia, TCP/IP menjadi protocol penghubung antara jaringan-jaringan yang beragam di seluruh dunia untuk dapat berkomunikasi. World Wide Web (WWW) merupakan bagian dari internet yang paling cepat berkembang dan paling populer. WWW bekerja merdasarkan pada tiga mekanisme berikut:
Konsep Internet (2) Protocol standard aturan yang di gunakan untuk berkomunikasi pada computer networking, Hypertext Transfer Protocol (HTTP) adalah protocol untuk WWW. Address WWW memiliki aturan penamaan alamat web yaitu URL(Uniform Resource Locator) yang di gunakan sebagai standard alamat internet. HTML digunakan untuk membuat document yang bisa di akses melalui web. Analogi : jalan (protokol), alamat (url), kendaraan (html)
Pengenalan HTML Hypertext Markup Language = standard bahasa untuk menampilkan document web, yang bisa dilakukan dengan HTML yaitu: mengontrol tampilan dari web page dan contentnya. mempublikasikan document secara online sehingga bisa di akses. membuat online form untuk menangani pendaftaran/transaksi online. menambahkan object2 : image, audio, video, applet dalam HTML. VS
Browser & Editor (1) Browser Editor Browser = software yang di install di mesin client yang berfungsi untuk menterjemahkan tag-tag HTML menjadi halaman web. Browser yang sering di gunakan Internet Explorer, Netscape Navigator, Mozilla, Opera, dsb. Editor Editor = program yang digunakan untuk membuat document HTML. Beberapa editor HTML : Notepad, Ms FrontPage, Dreamweaver.
Browser & Editor (2)
Syntag HTML Command HTML biasanya disebut SYNTAG atau TAG, TAG digunakan untuk menentukan tampilan dari document HTML.
Contoh Tag HTML sederhana Elemen – elemen HTML : HTML <html> HEAD <head> BODY <body>
Elemen dasar HTML Block level element yang sering di gunakan : Heading (H1 s.d H6) Paragraf (P) List Item(LI) Unordered List (Bullet) Ordered List (Numbering) Horizontal Rules(HR) Format Page : BR, color, aligment. Hyperlink / link Tabel : TR, TD Image Dll
Pengenalan Form Kegunaan Form dalam web: Memperoleh data-data masukan dari user (nama, alamat dan data lainnya) untuk mendaftar pada service yang disediakan. Memperoleh informasi pembelian secara online. Memperoleh feedback dari user mengenai website anda.
HTML Input Element Text Button TextArea CheckBox RadioBox ComboBox / List Box (Selection)
Pengenalan Style Sheet (1) Suatu style sheet merupakan tempat dimana anda mengontrol dan memanage style-style yang ada. Style sheet mendeskripsikan bagaimana tampilan document HTML di layar. Anda juga bisa menyebutnya sebagai template dari documents HTML yang menggunakanya. Anda juga bisa membuat efek-efek spesial di web anda dengan menggunakan style sheet.
Pengenalan Style Sheet (2) Ada dua cara untuk merubah style dari web page anda yaitu dengan : Merubah inline style Menulis script untuk merubah style anda. Syntax selector { property1: value; property2:value, . . .} H1{ color:green; background-color:orange} /* isi Comments */
Contoh Penggunaan CSS mengatur karakter kode tag dokumen anda. <style type="text/css"> body { color: black; background: white; } </style> Mengatur tepi halaman (page margin) <style type="text/css"> body { margin-left: 10%; margin-right: 10%; } </style> Mengatur inden kiri dan kanan <style type="text/css"> body { margin-left: 10%; margin-right: 10%; } h1 { margin-left: -8%;} h2,h3,h4,h5,h6 { margin-left: -4%; } </style> Link ke sheet lainnya <link rel="stylesheet" href="style.css">
SELESAI …
TUGAS I Sifat tugas : INDIVIDU