Upload presentasi
Presentasi sedang didownload. Silahkan tunggu
1
PENGENALAN ASP.NET Pertemuan ke 13 Tentang ASP Pengenalan ASP
HTML Intermediate Formatting with Tables, Frames Collecting information from the user using Forms
2
ASP dapat dikombinasikan dengan :
Apa itu ASP ? Microsoft® Active Server Pages (ASP) merupakan server-side scripting yang digunakan untuk membuat situs yang dinamis dan aplikasi web yang interaktif. Sesuai prinsip server-side scripting, ASP juga merupakan halaman HTML yang diisikan script-script yang diproses oleh web server sebelum dikirim ke web browser. ASP dapat dikombinasikan dengan : Extensible Markup Language (XML) Component Object Model (COM) Hyper Text Markup Language (HTML)
3
Perbandingan PHP dan ASP
Dengan persamaan sebagai server-side scripting, ASP dapat dibandingkan dengan PHP dalam beberapa hal berikut ini (secara umum) : ASP PHP Sistem Operasi Microsoft Windows Unix, Linux Web Server Personal Web Server (PWS) Internet Information Server (IIS) Apache Web Server Database Microsoft Access Microsoft SQL Server MySQL, Postgres, Oracle, dll Basic sintaks Visual Basic (VB) C / C++ Ekstensi file .asp .php Sebelum membahas ASP.Net, kita kenalkan ke mahasiswa tentang ASP. Di slide ini diperlihatkan perbandingan ASP dan PHP. Dengan mengetahui perbedaan antara kedua-nya, diharapkan mahasiswa dapat menempatkan kedua server side scripting ini dengan tepat. Dalam perkembangannya, ASP digantikan oleh ASP.NET
4
Contoh script ASP - 1 VBScript adalah bahasa scripting standar untuk membuat halaman ASP. Pada contoh-contoh script berikut digunakan VBScript: Contoh 1 : Langkah pembuatan : Masukkan text ‘Hello World’ pada variabel FirstVar Buat tag awal HTML Gunakan <%FirstVar%> untuk menampilkan isi variabel FirstVar Akhiri tag HTML Script lengkap : Language=VBScript %> <html> <head> <title>Example 1</title> </head> <body> <% FirstVar = "Hello world!" %> <%=FirstVar%> </body> </html> Sedikit dibahas mengenai sintaks ASP, perbandingan dengan PHP semakin jelas. Pengenalan sintaks ini juga nantinya mempermudah pemahaman mahasiswa terhadap ASP.NET Contoh 1 hanya menampilkan text ‘Hello World’ pada browser
5
Contoh script ASP - 2 Contoh 2 : Contoh 3 :
Language=VBScript %> <html> <head> <title>Example 2</title> </head> <body> <% FirstVar = "Hello world!" %> <%FOR i=1 TO 10%> <%=FirstVar%> <%NEXT%> </body> </html> Contoh 3 : <html> <head> <title>Example 4</title> </head> <body> <%IF Hour(time)>18 OR Hour(time)<4 THEN%> Good Night Everyone. <%ELSE%> Good Morning Everyone. <%END IF%> Contoh 2 : This example incorporates a FOR loop in the ASP page. The FOR loop is a statement that prints "Hello World" 10 times. To create Example 2, use the file from Example 1 and add the FOR loop code as shown in the following code sample. Save the file as Example2.asp. View it in your browser. Contoh 3 : This example displays the message "Good Morning Everyone" if the hour is between 4:00 A.M. and 6:00 P.M. It displays the message "Good Night Everyone" if the hour is between 6:00 P.M. and 4:00 A.M. Add the IF THEN statement in the code shown below to Example3.asp and save it as Example4.asp.
6
Perkembangan ASP Saat ASP ver 3.0 diluncurkan, programmer menemukan banyak hal yang mempermudah proses pembuatan program. Ini dikarenakan ASP telah diperkaya berbagai fungsi. Namun programmer masih menemukan masalah umum dalam penggunaan ASP, yaitu ASP bersifat ‘code-oriented’. Yang artinya segala hal yang ingin ‘dibuat’ haruslah ditulis dengan kode-kode script. Microsoft mengeluarkan framework .NET pada Juli, 2000. Dengan adanya framework ini, programmer dapat membuat program lebih ringkas dan cepat. Hal ini dikarenakan penggunaan framework yang dapat mengurangi jumlah script yang dibuat oleh progammer.
7
Perkembangan ASP Beberapa keunggulan framework .NET :
Menggunakan model programming deklaratif Server kontrol hirarki dengan events. Class library yang cukup banyak. Support terhadap development tools, dari yang sederhana (notepad) hingga Visual Studio .NET ASP.NET mulai diperkenalkan kepada programmer sebagai pengganti penggunaan ASP klasik. ASP.NET versi 1.0 dan 1.1 diluncurkan untuk pertama kali dan berharap saran dari pengguna untuk penyempurnaan ASP.NET versi berikutnya.
8
Generasi Pertama .NET Client Logic Servers Data, Hosts Biz Logic
Browsers Biz Logic OPTIONAL SLIDE, USE IF AUDIENCE HAD NO PREVIOUS EXPOSURE TO .NET KEY MESSAGE: The first generation of Web application was about delivering non-interactive content. SLIDE BUILDS: None SLIDE SCRIPT: We can think of the first generation of Web-enabled applications as being primarily about publishing non-interactive HTML pages. For example, many applications simply operated in client/server mode and rendered HTML pages to send across the Internet to browsers. SLIDE TRANSISTION: It wasn’t too long before we advanced to the second generation… ADDITIONAL INFORMATION FOR PRESENTER: At the end of this presentation there are two alternate slides for the next three slides. Aplikasi web berjalan sesuai prinsip server-client. Pihak industri membuat perangkat pembantu seperti database SQL Server™. OS Services Penggunaan HTML oleh programmer untuk membuat user interface aplikasi web. Microsoft menyediakan COM, IIS, Internet Explorer
9
Generasi Kedua .NET Biz Servers Tier Logic Rich Data, Hosts
OS Services Biz Tier Logic Servers Data, Hosts Rich Client Logic OPTIONAL SLIDE, USE IF AUDIENCE HAD NO PREVIOUS EXPOSURE TO .NET KEY MESSAGE: The second-generation Web application was about a more scalable back-end and a richer UI. SLIDE BUILDS: None SLIDE SCRIPT: As the Web became a more popular application platform, we began to use n-tier architectures and services such as COM+ to increase the scalability of the back end. At the same time, technologies such as DHTML and Microsoft® ActiveX® allowed us to build more interactive user interfaces. SLIDE TRANSISTION: At Microsoft, we think it’s time to move to the third generation… ADDITIONAL INFORMATION FOR PRESENTER: COM+ Services ditingkatkan. Internet Explorer menyediakan DHTML untuk interaktif web “Stateful” Browsers Pemisahan data dan bisnis proses mempercepat proses pembacaan aplikasi “Stateless” & “Geo-Scalable”
10
Your Internal Services
Platform .NET Visual Studio® .NET Internet Protocols SOAP “blue book” HTTP, SMTP, XML Your Internal Services Your Application and Web Service .NET Framework Windows® CE, 2000, XP, .NET Operations Orchestration OPTIONAL SLIDE, USE IF AUDIENCE HAD NO PREVIOUS EXPOSURE TO .NET KEY MESSAGE: The .NET Platform is Microsoft’s vision of the future platform for Web services. SLIDE BUILDS: None SLIDE SCRIPT: Microsoft’s vision of a platform for Web services is the .NET Platform. .NET builds on top of existing platforms such as Microsoft® Windows® 2000, Microsoft® Windows® XP and Microsoft® Windows® CE, and leverages technologies such as COM+ services, but extends them into a more Internet-based paradigm. The .NET Enterprise Servers are the first in a series of product releases that will make it possible to use XML as a means of integrating applications over the Web. The .NET Framework will provide a common language runtime that will allow unprecedented integration between programming languages, as well as a host of runtime services. Microsoft® Visual Studio® .NET will consist of a rich set of tools for developing applications that use the .NET Framework services. Orchestration will make it simpler to design, build and integrate business processes. Foundation services will provide encapsulated services that can be accessed via XML and HTTP, like Passport and Storage .NET in the future. Windows® .NET will be the underlying operating system that will support the .NET platform. SLIDE TRANSISTION: So now that we know what .NET is about, let’s look at some ways to start experimenting with this future platform… ADDITIONAL INFORMATION FOR PRESENTER: .NET Enterprise Servers Applications Using Your Service .NET Foundation Services End-User Clients 3rd Party Web Services
11
Common Language Specification Common Language Runtime
Framework .NET Visual Basic® C++ C# JScript® … Visual Studio .NET Common Language Specification OPTIONAL SLIDE, USE IF AUDIENCE HAD NO PREVIOUS EXPOSURE TO .NET KEY MESSAGE: The .NET Framework is a complete set of technologies that makes it easy to create the next generation of applications. And Visual Studio .NET is the set of tools that takes advantage of this infrastructure. SLIDE BUILDS: None SLIDE SCRIPT: The .NET Framework exposes numerous classes to the developer. These classes allow the development of rich client applications and Web-based applications alike. In the above slide these classes have been divided into 4 areas. ASP.NET provides the core Web infrastructure such as Web Forms for UI based development and Web services for programmatic interface development, User interface development on the Windows platform can be done using Windows Forms. ADO.NET and XML provide the functionality for data access. Finally, the core base classes provide infrastructure services such as security, and transaction management. SLIDE TRANSITION: ADDITIONAL INFORMATION FOR PRESENTER: ASP.NET: Web Services and Web Forms Windows Forms ADO.NET: Data and XML Base Class Library Common Language Runtime
12
ASP.NET dan Visual Studio
ASP.NET dan Visual Studio® .NET didesain untuk pembuatan web aplikasi Perancangan untuk web aplikasi dan XMLWeb services Drag and drop untuk penggunaan tag HTML Penggunaan bahasa pemrograman yang terintegrasi
13
Introduction ASP.NET Membangun class programming dari framework .NET
Pengontrolan dan pembangunan infrastruktur pengembangan web apliksi Contoh web aplikasi :
14
ASP Klasik Penggunaan model programming prosedural yang sederhana.
Mengakses ke COM Objects : ADO File system object Tanpa proses compile, hanya save (simpan). Mendukung penggunaan berbagai bahasa scripting. Gabungan antara HTML dan kode-kode script. VBscript – leverage Visual Basic skills Kendala : Code readability Coding overhead PostBack complexity Reuse Performance DLL locking Deployment Sessions Caching KEY MESSAGE: The strengths of Classic ASP. SLIDE BUILDS: None SLIDE SCRIPT: For its time, ASP was a revolution. Server-side processing was in its infancy. Server-side processing was complex. ASP was easy, and, with COM, powerful. It allowed dynamic generation of HTML, and used VBScript to reduce the learning curve. SLIDE TRANSISTION: But ASP had some limitations. ADDITIONAL INFORMATION FOR PRESENTER:
15
Arsitektur ASP.NET .ASPX .ASPX Compiled Compiled
KEY MESSAGE: 1 line overview of what the slide is about SLIDE SCRIPT: BUILD If a change is made to the ASPX… BUILD Then, on the next request, this change is detected, and the page is recompiled. BUILD and the result is returned to the browser. SLIDE TRANSISTION: Common language runtime ADDITIONAL INFORMATION FOR PRESENTER: Compiled Compiled .ASPX .ASPX
16
Kehandalan ASP.NET ASPX, ASP – side by side
Simplified programming model Simplified deployment Better performance Caching Security Powerful controls Simplified browser support Simplified form validation Code behind pages More powerful data access Web services Better session management No DLL locking No DLL registration Simplified configuration Pagelets KEY MESSAGE: Key features of ASP.NET SLIDE SCRIPT: ASP.NET isn’t backward -compatible with ASP. However, you can migrate pages to ASP.NET one at a time. ASP and ASP.NET can coexist in the same site. The programming model for ASP.NET is similar to Visual Basic. You don’t have to be so concerned with sending data down and posting it back to the server. Deployment consists of simply copying the files. Because the pages are compiled, and since you can cache page output, you can easily get better performance out of ASP.NET with little if any work. ASP.NET supports caching of page output, and caching of data. ASP.NET supports a number of authentication mechanisms. Regardless of the method used, you use the same code to determine permissions for the user. Things that used to be hard are now simplified. Things like data-driven tables, data in columns, and calendars. SLIDE TRANSISTION: More features.. ADDITIONAL INFORMATION FOR PRESENTER:
17
Page Development Separation of Code from Content ASP ASP.NET code
Pemisahan kode-kode script terhadap konten sehingga designer dan programmer dapat bekerja lebih independen ASP ASP.NET Single file Separate files code <tags> <tags> code Form1.asp WebForm1.aspx WebForm1.aspx.vb
18
Code- behind class file
Page Development Parse ASPX Engine Code- behind class file Gen’d Page Class File Generate Dynamic Compilation ASPX File Request ASPX File Instantiate Request Page Class Instantiate, process and render Response Response
19
Demonstration 1 ASP vs. ASP. NET Data-Driven ASP Data-Driven ASP
Demonstration 1 ASP vs. ASP.NET Data-Driven ASP Data-Driven ASP.NET Comparison KEY MESSAGE: Demonstration 1 SLIDE BUILDS: SLIDE SCRIPT: In this demonstration, you will see ASP and ASP.NET, side-by-side. SLIDE TRANSITION: Agenda ADDITIONAL INFORMATION FOR PRESENTER:
22
Server Controls Simplify Common Tasks
Forms Tables Data display Calendar Ad rotator Server-side programming model Automatic browser compatibility Less code, less complexity Extensible KEY MESSAGE: The goal of “Server Control” is to simplify common tasks. SLIDE BUILDS: None SLIDE SCRIPT: In the past, data driven Web sites have required a lot of coding. Often, this code is repetitive, but difficult to “genericise”. Forms front-ends to databases, tables of data, and other layouts for data were replicated from page to page with a lot of cut-and-paste. Server controls provide a generic, flexible, and browser-independent mechanise for these common tasks. Forms for data driven Web sites are simplified through a server-side scripting model. Tables can be easily generated using controls like the “DataGrid”. For more control over the display of the data, we can user the “Repeater” and “DataList”. If you want to output a calendar, there’s a server-side control for that. If you want to rotate through a series of images or adds, you can use a Ad Rotator. This control loops through a list of images specified by an XML file. Your code can all be written like a VB form, with little, if any concern for the client-side aspects. ASP.NET generates the right code for the currently connected browser. The goal is to write less code to do the same things, and that code should be easier to maintain. SLIDE TRANSISTION: Server controls used for forms ADDITIONAL INFORMATION FOR PRESENTER:
23
Server Controls HTML and Server Controls
<div id="MyDiv" runat="server"/> <asp:TextBox id="txtUserName" runat="Server"/> <asp:button type="submit" OnClick="SubmitBtn_Click" runat="server"/> ID – uniquely identifies control Runat – enables server-side processing OnClick – identifies server-side event handler KEY MESSAGE: How server controls work. SLIDE BUILDS: None SLIDE SCRIPT: HTML controls (like the DIV control) behave exactly like traditional HTML controls except that you can write serve- side code that manipulates them. For example in a server-side script, you could say: MyDiv.InnerText = “Hello There” Server controls are in the ASP namespace. The ID specifies how the control will be accessed programmatically, like the name property in Visual Basic. RunAt=Server informs ASP.NET that this control should process on the server side. If this is not set, the control is passed to the client as-is. OnClick: Because RunAt is set to server, this identifies an event procedure in the ASP.NET page. This is a server-side event, a new concept for Active Server Pages. SLIDE TRANSISTION: Let’s look at an event procedure ADDITIONAL INFORMATION FOR PRESENTER:
24
Server Controls Forms <script language="C#" runat=server>
void SubmitBtn_Click(Object sender, EventArgs e) { Response.Write (“Hello” + txtUserName.Text); } </script> PostBack Server-side object automatically populated from client-side controls KEY MESSAGE: Server side events SLIDE BUILDS: None SLIDE SCRIPT: This is a server-side event. When the user clicks on the submit button in the client-side form, the page will post to the server, and this event procedure will automatically execute. The event procedure can access properties of other controls that also posted their value back to the server. SLIDE TRANSISTION: Browser Support ADDITIONAL INFORMATION FOR PRESENTER:
25
Server Controls Browser Support
Targets client on the fly <asp:textbox ForeColor=“red”/> Style Font Validation Client-side Server-side KEY MESSAGE: Examples of browser support SLIDE BUILDS: None SLIDE SCRIPT: ASP.NET automatically writes the correct HTML and JavaScript for the target browser. For example, if you set the ForeColor property of a textbox to red, if the client supports CSS tags, it will render this with a style attribute. Otherwise, the browser will wrap the textbox in a <FONT> tag. When it comes to validating form fields, the framework will generate client-side script if it knows the browser supports it. Otherwise, the form will be validated using only server-side script. SLIDE TRANSISTION: Let’s take a look at these server controls in action. ADDITIONAL INFORMATION FOR PRESENTER:
26
Demonstration 2 Server Controls Walk-Through Programming Model Syntax
KEY MESSAGE: Server Side Programming Model SLIDE BUILDS: None SLIDE SCRIPT: Show how the programming model is very similar to Visual Basic. There’s no code to determine if this is a postback, and access Request.Form(“…”) Server side objects are created to hold the properties of the form fields. SLIDE TRANSISTION: Another common ASP/DHTML task is validating form fields… ADDITIONAL INFORMATION FOR PRESENTER:
27
Server Controls Validation
Without code Required field Within range Two fields equal (password) Regular expressions Validation error messages With code, but simplified Custom validation KEY MESSAGE: Complex validation can be accomplished without any coding. SLIDE BUILDS: None SLIDE SCRIPT: Validation used to be a labor-intensive task. If you were using client-side validation, it required a lot of compatibility testing, and you still had to perform server-side validation because (a) some clients didn’t support client-side script, and (b) someone could maliciously bypass the client-side validation. In ASP.NET, without any coding you can make sure required fields are filled out. You can verify that the value of a field falls within a certain range. You can ensure that the value for two fields are equal. This is often used for “Password”, “Confirm-Password” fields. You can compare the value of a field against a regular expression (does the field look like a properly formatted address?). And, you can customize the error messages that are displayed if the validation rules are broken. For most forms, this is sufficient. However, if you cannot accomplish your task with these tools, you can create custom validation. Even in this case, the programming is simplified over ASP. Client side script will be generated to perform the validation. In addition, validation will also be performed on the server side. SLIDE TRANSISTION: Let’s look at validation in action. ADDITIONAL INFORMATION FOR PRESENTER:
28
Demonstration 3 Validation Required Field Validation Summary
KEY MESSAGE: Show the mechanics of setting up form validation SLIDE BUILDS: None SLIDE SCRIPT: In this demo we will look at a form that requires certain fields to be filled out. We’ll also look at how we can customize the message that gets displayed if the validation rules are violated. SLIDE TRANSISTION: Data controls ADDITIONAL INFORMATION FOR PRESENTER: There are a number of additional form validation controls that come built-in to the Web Form framework.
29
Data Controls Bind to many data sources Collections Array HashTable
ADO.NET DataReader DataSet XML KEY MESSAGE: Data controls make it easy to display data on a Web page SLIDE BUILDS: None SLIDE SCRIPT: By DataBinding, we mean that a control will automatically populate itself with data from some source. In the past, DataBinding assumed that your data was coming from a recordset. Also, only certain properties of a control could be bound to a data source. With .NET, you can bind controls to a number of built-in container types. .NET also incorporates a new set of objects for accessing data called ADO.NET. You can bind to these objects as well. Finally, you can use XML as the source of data for your controls. SLIDE TRANSISTION: ADO.NET Objects in Detail ADDITIONAL INFORMATION FOR PRESENTER:
30
Data Controls ADO.NET Connection Command DataReader DataSet
DataAdapter DataView KEY MESSAGE: The objects that make up ADO.NET SLIDE BUILDS: None SLIDE SCRIPT: Connection: Allows you to communicate with a database. Command: Lets you send a command to a database, such as insert, update, select, or delete. DataReader: Like an ADO fire hose cursor. Forward only. DataSet: Hold a static view of data from one or more tables. Knows how data from the tables are related. Essentially, an in-memory database. DataAdapter: Provides synchronization between the DataSet and the Database. Holds a given command for a set of data. DataView: Used to filter and sort data in a DataSet. Also, when you bind controls, you bind to the data view. SLIDE TRANSISTION: ADO.NET Visuals ADDITIONAL INFORMATION FOR PRESENTER:
31
Data Controls ADO.NET DataSet Database Connection DataAdapter Authors
KEY MESSAGE: Connection and Data Set Command SLIDE SCRIPT: A DataSet holds a snapshot of data from the database. SLIDE BUILD: The connection object lets you converse with a database. SLIDE BUILD: A DataAdapter contains the instructions to retrieve data from the database, or update the database. SLIDE BUILD: After this command executes, the DataSet contains a snapshot of the data. SLIDE TRANSISTION: Data controls ADDITIONAL INFORMATION FOR PRESENTER: Authors Connection DataAdapter Select … from Authors
32
Select … from Publishers
Data Controls ADO.NET DataSet Publishers Database KEY MESSAGE: DataSet holds data from more than one table. SLIDE SCRIPT: SLIDE BUILD: A data set can store information from more than one table. For example, the publishers table. SLIDE BUILD: The dataset maintains a static view of each set of data. SLIDE BUILD: With an additional line of code, we can tell the DataSet about the relationship between the tables. This will allow us to easily get the publisher for an author, or all the authors for a publisher. SLIDE TRANSISTION: DataView ADDITIONAL INFORMATION FOR PRESENTER: Authors Connection DataAdapter Publishers Select … from Publishers
33
Data Controls ADO.NET DataSet DataGrid Repeater DataList DataView
KEY MESSAGE: DataView allows data binding SLIDE SCRIPT: SLIDE BUILD: A data view provides sorting and filtering capabilities for a dataset. SLIDE BUILD: A data view also provides the functionality needed for data binding. SLIDE TRANSISTION: DataGrid ADDITIONAL INFORMATION FOR PRESENTER: Authors Repeater Publishers DataList
34
Data Controls DataGrid
Displays data as a table Control over Alternate item Header Footer Colors, font, borders, etc. Paging Updateable Item as row KEY MESSAGE: Features of the DataGrid SLIDE BUILDS: None SLIDE SCRIPT: Describe the functionality provided by the DataGrid control. Outputs an HTML table: Header Row Item 1 Item 2 Item 3 Footer SLIDE TRANSISTION: The repeater provides different functionality ADDITIONAL INFORMATION FOR PRESENTER:
35
Data Controls Repeater
List format No default output More control More complexity Item as row Not updateable KEY MESSAGE: Features of the Repeater SLIDE BUILDS: None SLIDE SCRIPT: The key difference between the repeater and the grid is that the repeater has no default output. You have to provide a template that describes exactly what the header, footer, and each item will look like. Outputs HTML that you describe. Doesn’t have to be a table. Could be a list. Header Item1 Item2 Item3 Footer SLIDE TRANSISTION: ADDITIONAL INFORMATION FOR PRESENTER:
36
Data Controls DataList
Directional rendering Good for columns Item as cell Alternate item Updateable KEY MESSAGE: Features of the data list SLIDE BUILDS: None SLIDE SCRIPT: Key difference is that here a row from the database is a cell, not a row. The DataList makes it easy to output data in columns. For example: Item1 Item2 Item3 Item4 or Item1 Item3 Item2 Item4 SLIDE TRANSISTION: The Web Application ADDITIONAL INFORMATION FOR PRESENTER:
Presentasi serupa
