PowerPoint Slides (PPT)
Upcoming SlideShare
Loading in...5

PowerPoint Slides (PPT)






Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

PowerPoint Slides (PPT) PowerPoint Slides (PPT) Presentation Transcript

  • slick r : A Capstone Web Development Project Using Databases, ASP.NET, Web Services, and AJAX Mark Frydenberg Computer Information Systems Dept. Bentley College, Waltham, MA [email_address]
    • “ The teaching of this important technology, web services, has received little attention in the common IS pedagogy journals.”
      • Alan Peslak, ISECON 2006
  • CS 380 – Multi-Tier Application Development
    • Overview
    • ASP.NET / C#
    • Visual Studio 2005
    • SQL Server Database
    • Client / Server Programming
    • Web Services
    • Course goal is to develop individual competency in creating web-based applications using a contemporary integrated, object-oriented development environment.
    • Prerequisites
      • CS 150 [Prog. with Java]
      • CS 180 [Data Reporting and Retrieval]
  • slick r Alpha
    • Create albums and upload photos into specific albums
    • Associate a description and one or more user-specified tags with each photo
    • Search albums for photos with specific tags, and display matching photos
    • Edit and delete album or tag names, and photo descriptions
  • Database Design
  • slick r Alpha Demo
  • slick r Alpha Goals and Observations
    • Goals
    • Observations
    • Gain experience with both Drag n’ Drop database controls as well as writing code to access databases
    • Design queries so that they can be reused later
    • Understand relationships between object model (class diagram) and database model (database diagram)
    • Most students hadn’t seen stored procedures before
    • Some confusion between object modeling and database representation
    • General: Where does it go?
  • slick r Web Services Enhancements
    • Create a web service with methods to expose photos
    • Rewrite search and display pages to invoke web methods
    • Search and display photos from a classmate’s project by invoking the classmate’s web service methods
  • slick r Alpha and Web Services Demo
  • slick r Web Services Goals and Observations
    • Goals
    • Observations
    • Students act as both web service producers and consumers
    • Understand the need for standard APIs.
    • Realize the important role that web services play in making data available for sharing between applications, and the role of XML as a standard for representing that data.
    • Repackage and Reuse: that’s why design is important!
  • Why AJAX?
    • Improved efficiency by increased browser processing
    • Familiar UI elements such as progress indicators, tooltips, and pop-up windows.
    • Partial-page updates
    • Integration with ASP.NET application services for forms authentication and user profiles.
    • Integration of data through calls to Web services.
    • Simple customization of server controls to include client capabilities
    • Supported by many common browsers
  • Using ASP.NET AJAX
    • ScriptManager
      • manages all of the basic ASP.NET AJAX components on the page.
    • UpdatePanel
      • contains content to updated without refreshing the entire page
    • Many AJAX controls receive updated data from Web Services
    • Rich User Experience
    • Extenders add AJAX functionality to basic ASP.NET controls
  • slick r AJAX Enhancements
    • Slide Show
    • Ratings control
    • ResizableControlExtender
    • CascadingDropDown for drill down queries from albums to pictures
    • Tag Cloud
    • Other ideas?
  • slick r Slide Show
    • < asp : ScriptManager id =&quot;ScriptManager1&quot; runat =&quot;server&quot; EnablePartialRendering =&quot;true&quot;>
    • </ asp : ScriptManager >
    • < asp : UpdatePanel id =&quot;UpdatePanel1&quot; runat =&quot;server&quot;>
    • < ContentTemplate >
    • < asp : Image id =&quot;Image1&quot; runat =&quot;server&quot;
    • ImageUrl =&quot;~/data/logo.jpg“ />
    • < br />
    • < asp : Button id =&quot;Button1&quot; onclick =&quot;Button1_Click“
    • runat =&quot;server&quot; Text =&quot;Start“ />
    • < asp : Timer id =&quot;Timer1&quot; runat =&quot;server“ Interval =&quot;2000“
    • OnTick =&quot;Timer1_Tick“ enabled =&quot;false“ />
    • </ ContentTemplate >
    • </ asp : UpdatePanel >
  • slick r Slide Show
    • public partial class Slideshow : System.Web.UI.Page
    • {
    • public SlickrWS.SlickrWebService ws = new SlickrWS.SlickrWebService();
    • public SlickrWS.SlickrPhoto[] photos;
    • protected void Page_Load(object sender, EventArgs e)
    • {
    • photos = ws.GetPictures();
    • Image1.ImageUrl = GetRandomPicture ();
    • }
    • protected void Timer1_Tick(object sender, EventArgs e)
    • {
    • Image1.ImageUrl = GetPhoto();
    • }
    • protected void Button1_Click(object sender, EventArgs e)
    • {
    • if(Timer1.Enabled)
    • {
    • Timer1.Enabled = false;
    • Button1.Text = &quot;Start&quot;;
    • }
    • else
    • {
    • Timer1.Enabled = true;
    • Button1.Text = &quot;Stop&quot;;
    • }
    • }
    • private string GetRandomPicture()
    • {
    • Random r = new Random();
    • int n = r.Next(0,photos.Length - 1);
    • return photos[n].Url;
    • }
    • }
  • slick r AJAX Demo
  • slick r AJAX Goals and Observations
    • Goals
    • Observations
    • Introduce asynchronous architecture found in many current web applications
    • Create web applications with more involved user interfaces
    • Program against AJAX object model/framework
    • Use at least one AJAX control not demo’d in class
    • New Motivation for Teaching Web Services
    • ASP.NET AJAX hides the details of how dynamic behavior “works”
    • [This project] required me to think not only about the coding aspect, but the design of web applications even more. Learning which and how things work together, and performance issues were all important. When I visit a site such as Amazon.com now, I know that millions of users are connecting to their Web Services, and pulling data out of their public databases and into their own applications. Now I have a better sense of the some of the components and related issues that must be considered when building large-scale web-based business applications.
  • Conclusion
    • Teaching web services
    • Teaching AJAX
    • provides insight into reusability of software modules
    • underscores the importance of APIs and good software design
    • offers a concrete example of distributed system architectures
    • Encourages abstraction and proper object-oriented design.
    • Introduces asynchronous web architecture
    • Create “rich” web applications
    • ASP.NET AJAX provides a new outlet for web services, as several of the pre-defined controls in its toolkit accept input from web service methods .
  • Questions?
      • Mark Frydenberg
      • [email_address]