MINGGU Ke Enam Web Teknologi 2 HAK CIPTA DILINDUNGI UNDANG-UNDANG DILARANG KERAS MEMPERBANYAK / MENGCOPY TANPA SEIZIN COPY CENTRE IBII MINGGU Ke Enam Web Teknologi 2 Pokok Bahasan: Master Pages Tujuan Instruksional Khusus: Mahasiswa akan dapat menjelaskan dan mengaplikasikan master pages dalam ASP.NET Referensi: ASP.NET 2.0 dengan VB 2005, Bab 3 Web Teknologi 2 Institut Bisnis dan Informatika Indonesia

Agenda Pengenalan master pages Bekerja dengan master pages Dasar-dasar master pages Master pages bersarang Web Teknologi 2

Pengenalan master pages sebuah template atau layout tampilan sebuah web site yang akan digunakan oleh semua halaman .aspx sehingga tampilan utama dari web tersebut akan sama. Tampilan yang biasanya sama di semua halaman yang akan ditampilkan adalah gambar background, menu item, footer dan link-link lain yang ada dalam web. Yang berubah adalah content dari halaman tersebut. sebuah template yang digunakan untuk mendesain tampilan yang akan digunakan di seluruh halaman web, ketika user melakukan navigasi, secara otomatis halaman-halaman akan tampil menyatu dengan master page tersebut sehingga content akan berubah. Master page akan dibuat satu kali dan content akan tampil sesuai halaman yang dibuka. Web Teknologi 2

Bekerja dengan master pages Inheritance/pewarisan visual yang ditambahkan ke ASP.NET 2.0 merupakan perbaikan besar di halaman web karena anda dapat membuat halaman template tunggal yang dapat digunakan sebagai fondasi untuk halaman isi di aplikasi anda. Template ini disebut sebagai master pages yang akan menambah produktivitas anda karena mempermudah pembuatan dan mengelola aplikasi. Web Teknologi 2

Dasar-dasar master pages Master pages adalah halaman tunggal yang menangani struktur dari situs web anda. Master pages memiliki dua fitur khusus yang berbeda dengan halaman lainnya. Pertama berisi tag khusus yang mengidentifikasi sebagai master pages ke server web seperti contoh berikut: <%@ Master Language=”VB” CodeFile=”MasterPage.Master.VB” Inherits=”Masterpage” %> Web Teknologi 2

Dasar-dasar master pages (continued …) HAK CIPTA DILINDUNGI UNDANG-UNDANG DILARANG KERAS MEMPERBANYAK / MENGCOPY TANPA SEIZIN COPY CENTRE IBII Dasar-dasar master pages (continued …) Tag directive (tag khusus yang dipahami server dan tidak dikirim ke client) tersebut memiliki empat fitur yaitu: Kata master membedakan halaman ini dengan halaman standar.aspx yang menggunakan kata page. Atribut language memberitahu anda bahwa halaman meggunakan Visual Basic untuk pengkodean. Atribut CodeFile memberitahu anda bahwa master pages menggunakan code-behind dan kode terletak pada file. Atribut Inherits memberitahu anda bahwa class default untuk halaman ini adalah MasterPage, bukan class lainnya. Basic authentication Ini adalah metode otentiaksi yang kompatibel dengan kebanyakan browser, tetapi password-nya dikirim dalam bentuk teks biasa. Gunakan metode ini hanya apabila anda dapat melindungi komunkasi dengan enkripsi SSL Digest authentication Metode ini diperkenalkan sebagai fitur http 1.1, jadi mungkin tidak didukung oleh semua browser. Metode ini mengirimkan nilai hash ketimbang password dalam teks biasa, menjadikannya lebih aman daripada basic authentication. Metode ini membutuhkan windows 2000 domain controller. Anda harus menyimoan versi teks biasa dari password dalam domain controller yang Dipakai untuk validasi password, dan domain controller harus terlindung dari penyelusup jaringan maupun fisik. Jika tidak ada windows 2000 doamin controller, maka pilihan ini tidak akan ada. Integrated Windows (NTLM) Authentication Metode ini hanya jalan pada IE. Ini adalah metode paling aman karena tidak pernah mengirimkan username maupun password lewat jaringan. Menggunakan metode ini anda mengharuskan client memakai IE untuk mengakses aplikasi. Integrated Windows Authentication tidak akan jalan pada koneksi proxy HTTP, yang membuatnya tidak mungkin bagi client pada jaringan perusahaan memakai proxy untuk login ke aplikasi lewat internet .metode ini juga mengharuskan setiap orang yang login ke situs anda Memiliki akun NT baik pada server web maupun pada pengontrol domain yang dipercaya oleh server web. Apabila kotak cek untuk tipe otentikasi dipilih lebih dari satu, otentikasi digest dan Integrated akan lebih dahulu dipakai daripada basic-authentication. Setelah IIS melakukan otentikasi pengguna, identitas otentikasi diteruskan ke ASP.NET, yang kemudian dapat memakai informasi tersebut Untuk mengizinkan atau menolak akses ke sumberdaya dalam aplikasi. Web Teknologi 2 Institut Bisnis dan Informatika Indonesia

Dasar-dasar master pages (continued …) Kedua, suatu master pages berisi kontrol ContentPlaceHolder yang memberitahu seseorang menggunakan master page ketika menambah informasi unik ke halaman web. <asp:contentplaceholder id=”contentplaceholder1” runat=”server”> </asp:contentplaceholder> Web Teknologi 2

Dasar-dasar master pages (continued …) Kode akan membuat daerah dalam template yang akan diisi dengan bahan dari halaman isi yang dibuat oleh pengembang. Ketika berkeja dengan master pages, anda akan membuat file master yang merupakan template untuk referensi bagi subpage atau halaman isi/content page. Master pages menggunakan ekstensi file .master, sedangkan halaman isi menggunakan ekstensi file .aspx. Letakkan semua yang anda inginkan sebagai template dalam file .master. termasuk seksi header, footer, dan navigasi yang akan digunakan sepanjang aplikasi web. Halaman isi berisi semua isi halaman kecuali elemen master pages. Pada saat aplikasi berjalan, engine ASP.NET akan mengkombinasikan elemen-elemen tersebut ke dalam satu halaman tunggal untuk pengguna akhir. Web Teknologi 2

Demo Master Pages Web Teknologi 2

Master pages bersarang Master page bersarang??? Kebanyakan perusahaan dan organisasi memiliki grup atau divisi dalam organisasinya dan dalam pembuatan situs web baik intranet maupun internet, struktur situs yang dibuat mencerminkan struktur organisasi. Di sini diperlukan master page di dalam master page atau disebut master page bersarang/nested. Sebagai contoh misalnya toko Stationary Alamo yang berpusat diJakarta membuka toko cabang di Yogya dan Bogor. Akan dibuat situs web dimana toko stationery Alamo sebagai master dasar dan masing-masing kantor cabang menggunakan template master dasar dari kantor pusat tetapi masing-masing kantor cabang juga membuat master page yang unik sendiri. Web Teknologi 2

Master pages bersarang (continued …) Kerangka kerja dari master page bersarang sebagai berikut. Buat master page dasar. Lalu buat halaman isi yang menggunakan master page dasar. Kemudian buat master page lainnya yang mengacu pada master page dasar. Terakhir buat halaman isi yang memerlukan isi dari master page dasar yang direferensikan oleh master page kedua. Dalam file .master dari master page dasar: Tambahkan kode HTML umum untuk halaman aplikasi web. Tambahkan kontrol asp:ContentPlaceHolder untuk tiap-tiap bagian halaman yang memerlukan isi spesifik halaman. Atur atribut ID dengan pengenal/identifier unik. Web Teknologi 2

Master pages bersarang (continued …) Dalam file .aspx dari halaman yang akan menggunakan master page dasar: Set atribut MasterPageFile dari directive @Page dengan nama file .master dari master page dasar. Tambahkan control asp:content untuk tiap-tiap control asp:ContentPlaceHolder dalam file .master dari master page dasar. Set atribut ContentPlaceHolderID dari asp:content dengan ID yang berhubungan dengan asp:ContentPlaceHolder dalam master page dasar. Tambahkan isi spesifik halaman dalam control asp:content Web Teknologi 2

Master pages bersarang (continued …) Dalam file .master dari master page kedua: Set atribut MasterPageFile dari directive @Master dengan nama file .master dari master page dasar. Tambahkan kode HTML umum untuk halaman aplikasi web. Tambahkan control asp:ContentPlaceHolder untuk tiap-tiap bagian dalam halaman yang memiliki isi spesifik halaman. Atur atribut ID dengan pengenal/identifier yang unik. Web Teknologi 2

Master pages bersarang (continued …) Dalam file .aspx dari halaman yang akan menggunakan master page kedua: Set atribut MasterPageFile dari directive @page dengan nama file .master dari master page kedua. Tambahkan control asp:content untuk tiap control asp:ContentPlaceHolder dalam file.master. Set atribut ContentPlaceHolderID dari asp:content dengan ID yang berhubungan dengan asp:ContentPlaceHolder dalam master page kedua. Tambahkan isi spesifik halaman dalam control asp:content. Web Teknologi 2

Demo Master Pages Bersarang Web Teknologi 2

Questions & Answers Web Teknologi 2

Thank You Web Teknologi 2