Download Lecture 1 PowerPoint

• Sit in front of a computer
• Log in, go to course web page at
http://faculty.cascadia.edu/cduckett/bit285
• Introduce yourself to folks around you
• Buckle up and prepare for Mr. Toad's wild ride!
BIT 285:
(Web) Application Programming
Instructor: Craig Duckett
Lecture 01: Tuesday, January 6, 2015
BIT285 Course Orientation and
Introduction to Web Applications and ASP.NET
BIT285: (Web) Application Programming
Official Web Site: http://faculty.cascadia.edu/cduckett/bit285
Classroom: CC1-210
Class Times: Tuesday/Thursday 1:15pm-3:20pm
StudentTracker: BIT 285 (for Submissions and Grade Tracking)
Instructor: Craig Duckett
Instructor Email: [email protected]
Instructor Office: CC1-203 (in alcove to right of second floor elevator)
Instructor Office Hours: Monday/Wednesday 9:30-11:00am; by appointment
Course Textbook (1)
Murach's ASP.NET 4.5 Web Programming with C# 2012
REQUIRED
by Mary Delamater and Anne Boehm
24 Chapters, 822 Pages, 358 Illustrations
Published August 2013
ISBN: 978-1-890774-75-2
File Downloads: https://www.murach.com/downloads/acs5.htm
Course Textbook (2)
Learn ASP.NET 4.5, C# and Visual Studio 2012 Essential
Skills with The Smart Method REQUIRED
by Simon Smart
24 Chapters, 822 Pages, 358 Illustrations
Published August 2013
ISBN: 978-1-890774-75-2
Companion Site: http://aspnetcentral.com/
Lynda.com Training Videos
We will be using five specified courses from the Lynda.com web training videos, as
one of the course requirements. Please register at Lynda.com by following the
instructions and the link that you received in an email invite. If you did not receive
an email invitation from Lynda.com, please email me at [email protected]
and I'll add you to the student list on the Lynda.com site. The cost is $20, and you
pay directly with a credit card.
•
•
•
•
•
ASP.NET Essential Training
C# Essential Training
JavaScript and JSON
Up and Running with Azure
Visual Studio 2012 Essential Training
I HAVE NOT PULLED THE SWITCH ON THESE YET. THESE MAY PROVE HELPFUL BUT ARE NOT REQUIRED.
Syllabus and Grading
Syllabus: BIT285 Winter 2015 Syllabus
Grading: 1000 Points Total for Quarter
Assessments
Percentage
Individual Points
Total Points
(15) In-Class Exercises
30%
20
(x15)
300
(3) Programming Assignments
45%
150
(x3)
450
(1) Mid-Term Exam
12.5%
125
(x1)
125
(1) Final Exam
12.5%
125
(x1)
125
100%
1000 Points
Required Software/Tools
•
•
•
•
•
•
•
Dreamspark https://www.dreamspark.com/
On the Hub: http://onthehub.com/download/free-software/
Windows (7 or 8)
Visual Studio 2010/2012 (Professional/Premium/Ultimate)
Microsoft SQL Server (for ICEs)
Cascadia VMWare Views (for remote access)
Microsoft Azure (6-Month Student account through invite)
A Look at the BIT 285 Website
http://faculty.cascadia.edu/cduckett/bit285/
BIT285 Class Survey










How many have successfully completed BIT112?
How many have successfully completed BIT 142?
How many have successfully completed BIT 275?
What other web dev classes have you successfully completed?
How is everybody working with Visual Studio?
How is everybody working with C#?
Does anybody in the class already have some ASP.NET experience?
Does anybody in the class already have some JavaScript/jQuery experience?
Does anybody in the class already have some JSON experience?
Does anybody in the class already have any experience with MS Azure?
BIT 285 Online Survey: http://goo.gl/forms/xG4gzgVdDS
Instructor Note (1)*
The Psychology Of A One-Hit Wonder
Teaching BIT285 is a one-shot deal for me this quarter. I'm only teaching because Dr. Brian
Bansenauer, who normally teaches this class, is gone Winter Quarter on a limited sabbatical and
then will be spending half-a-quarter teaching in China. As such, as I have never taught this class
before and likely will never teach it again, I have not been as "emotionally invested" in building
out the course as I otherwise would have been if it was going to be a long-term and repeat
assignment (much like my BIT112, BIT115, or BIT116 classes). This does not mean that I'm going
to be giving you a shoddy product—I've already put in over 200 hours of unpaid time building out
this gargantuan class—only that since I've had to construct this course from scratch knowing I'll
never to teach it again, I will be counting on each of you more than usual to help me take up the
stretches of slack or outright gaps. This means that we're all in the same boat together, and we
are all expected to help each other out. So: we must all work together, or risk falling together.
Capisce?
*The Fine Print
Instructor Note (2)
The Topics Covered Are Massive, Ponderous, Weighty, and Sometimes Unwieldy MONSTERS
…and so is Visual Studio (But That's a Good Thing!)
We will be tackling five (5) heady topics in the course of this class: Visual Studio, ASP.NET, C#, Azure, and REST.
Any one of these is complicated enough not only to deserve its own class, but its own series of classes! It's
own year! Since we will be addressing all five of these in the course of one class over one quarter, we cannot—
I repeat, cannot!—touch on any of the topics broached very deeply, since we simply don't have the required
time. You will likely find yourself doing things in Visual Studio or with code you don't understand completely, or
even half way, and that's to be expected. The time for deeper understanding will come later, with months and
months—or years!—of hands-on experience.
So, to wrap your head's around what this class is about, perhaps it is best you consider it a broad overview of
web application programming, a survey of sorts, so you might see the potential that is ahead of you when/if
you are ready to go further, drill deeper, or brave with machete in hand the tangled jungle of code and
application features that await you.
Instructor Note (3)
Unlike some of my other classes—bit115, for example—you
will not be able to get by in this class simply through osmosis
trickling in from the lectures alone. No way, Jose! Won't
happen! Why? Because there's just so much additional content
that needs to be uncovered. The lectures are just the tip of the
iceberg. And it's a BIG iceberg!
So, here's a "Word to the Wise": If you want to do well in this
class, then you will have to put in a lot of outside work to stay
ahead of the game—reading, researching, opening and
experimenting with example code, writing new code, watching
videos, etc., and then starting over and doing it again. And
again. And again. So, please, remember to…
Wash — Rinse — Repeat
Any Questions So Far?
What is a Web Application ?
NOTE: For the first few lectures I'll be sticking pretty closely with the Murach
book, and then it will be used primarily for reference and self-learning. I'll
also reference the Essential Skills material throughout the quarter.
What is a Web Application?
A web application consists of a set of web pages that are
generated in response to user requests. The Internet has many
different types of web applications, such as search engines,
online stores, auctions, news sites, social sites, financial sites,
sports sites, and games.
What is a Web Application? CONTINUED
Web applications consist of clients and a web server. The clients are the
computers, tablets, and mobile devices that use the web applications. They
access the web pages through web browsers. The web server holds the files that
make up the pages of a web application.
A network is a system that allows clients and server to communicate. The
Internet is a large network that consists of many smaller networks. The "cloud"
represents the network or Internet that connects the clients and servers.
The Components of a Web Application
What is a Web Application? CONTINUED
Networks can be categorized by size. A Local Area Network (LAN) is a small
network of computers that are near each other and can communicate with each
other over short distances.
Computers in a LAN are typically in the same building or adjacent buildings. This
type of network is called an intranet and it can run web applications that are
used throughout a company or institution.
What is a Web Application? CONTINUED
In contrast, a Wide Area Network (WAN) consists of multiple LANs that have
been connected. To pass information from one client to another, a router
determines which network is closest to the destination and sends the
information over the network. A WAN can be privately owned by one company
or it can be shared by multiple companies.
An Internet Service Provider (ISP) is a company that owns a WAN that is
connected to the Internet. An ISP leases access to the network to companies that
need to be connected to the Internet. When you develop production web
applications, you will often implement them through an ISP.
Business or School
Home
What is a Web Application? CONTINUED
To access a web page from a browser, you can type a Uniform Resource Locator
(URL) into the browser's address bar. The URL starts the protocol, which is
usually HTTP (Hypertext Transfer Protocol). It is followed by the domain name
and the folder or directory path to the file that is requested.
If the file name is omitted in the URL, the web server looks for a default file in
the specified directory. The default files usually include index.html or
default.html.
The Components of an HTML URL
What is a Web Application? CONTINUED
A static web page is a web page that does not change each time it is requested.
This type of web page is sent directly from the web server to the web browser
when the browser requests it. You can spot static pages in a browser by looking
at the extension in the address bar. If the extension is .html (or .htm) the page is
a static web page.
Fun Fact: Technically today there is no functional difference whether you use the
.html or .htm extension when creating your web pages. Whichever convention
you use, you should follow it and stick to it throughout your entire web site. The
use of .htm was a product of the older "8.3 naming convention" which was the
only naming convention supported by MS-DOS and pre-Windows 95 (Windows
3.1 or earlier) machines.
What is a Web Application? CONTINUED
When a URL is typed into a browser's address bar or a link is clicked, the browser
sends an HTTP request (Hypertext Transfer Protocol) to the web server. When
the web server receives the request, it retrieves the requested file from the
server drive. This file contains the HTML (Hypertext Markup Language) for the
requested page, then the web server sends the HTML back to the client browser
as part of an HTTP response.
When the browser receives the HTTP response, it renders (translates) the HTML
into a web page that is displayed in the browser which the user can view. If the
user requests another page, the whole process begins again.
How a Web Server Processes a Static Web Page
What is a Web Application? CONTINUED
A dynamic web page is a page that is created by a program on an application
server. This program uses the data that is sent with the HTTP request to
generate the HTML that is returned to the web server which will then later push
it out to the client browser. Request, Response. Request, Response.
When the web server receives an HTTP request it examines the file extension of
the requested page to identify the application server that should process the
request, and then forwards that request to the application server.
What is a Web Application? CONTINUED
Next, the application server retrieves the appropriate program, and also loads
any form data that the user submitted, then executes the program. As the
program executes, it generates the HTML for the web page and, if necessary,
also requests data from a database server or other media file server and uses
that data as part of the web page it is generating.
When the program is finished, the application server sends the dynamically
generated HTML back to the web server, and then the web server sends the
HTML back to the browser in an HTTP response.
What is a Web Application? CONTINUED
When the web browser receives the HTTP response, it renders the HTML and
displays the web page, however at this point the web browser has no way to tell
whether the HTML in the HTTP response was for a static page or a dynamic page.
It just renders the HTML.
When the page is displayed, the user can view the content. If the user requests
another page, the whole process begins again.
This process of request-and-response is called a "round trip".
How a Web Server Processes a Dynamic Web Page
What is a Web Application? CONTINUED
There are different makes, models, and types of application servers used by web
sites today that support and work with different protocols, including Java
application servers, PHP application servers, and .NET application servers.
In this course, when we build web applications, we will be using Microsoft Visual
Studio with ASP and C# as the programming environment, Internet Information
Services (IIS) is used for the web browser, and ASP.NET is used for the
application server. You'll also be using a variant of Microsoft's SQL Server for the
DBMS (Database Management System) and Microsoft Azure as a cloud
computing application and storage infrastructure.
What is ASP.NET ?
What is ASP.NET?
ASP.NET is one of the primary technologies for developing web applications
today. Together with Microsoft's Visual Studio, it provides a host of
productivity features that you let you quickly build professional ecommerce applications.
Because this class assumes that you already know the basics of C#, it gets
you off to a fast start with ASP.NET. In fact, by the end of the quarter, you'll
know how to use ASP.NET and Visual Studio to develop and test dynamic
multi-page and database applications in the "Cloud" using Microsoft Azure.
Five Ways to Develop ASP.NET Applications
• ASP.NET Web Forms - Web Forms is the oldest and most established technology. It provides for RAD
(Rapid Application Development) by letting developers build web pages by working with controls on a
design surface.
• ASP.NET MVC (Model View Controller) - Relatively new to the .NET family. It addresses perceived
weaknesses in Web Forms, such as inadequate separation of concerns and the difficulty of unit testing.
• ASP.NET Web Pages with Razor - A version of Web Forms that uses the Razor template engine for in-line
data binding without having to use the MVC design pattern. It is used in simple scenarios.
• ASP.NET Dynamic Data Entities - A version of Web Forms that uses Entity Framework and Routing to
dynamically generate data-driven web sites. It is used in simple scenarios.
• ASP.NET Reports Web Site - A Web Forms site that includes a report.
NOTE: Because 70% or more of ASP.NET web development is done with Web Forms, that's what we will
focus upon in this class. Because most of the other 30% of ASP.NET web development is done with MVC, it
will be introduced in the BIT286 class, and the last chapter in the Murach book introduces it as well.
ASP.NET Versions
The Four Editions of Visual Studio 2012
 Visual Studio Express 2012 for Web
 Visual Studio Professional 2012
 Visual Studio Premium 2012
 Visual Studio Ultimate 2012
The Free Edition of Visual Studio for Web Apps
 Visual Studio 2012 Express for Web
What the Free Edition Includes
 IIS Express
 SQL Server Express LocalDB
NOTE: At the time of this writing the college
PCs had Visual Studio 2010 installed on them,
but may have upgraded to Visual Studio 2013.
Now the Murach book and Lynda.com videos
are geared to Visual Studio 2012 so it is
recommended that you use this on your
personal computers, although if you are using
Visual Studio 2010 or Visual Studio 2013 that is
also okay—you will just have to transpose
some of the instructions/screen caps to 'fit' the
look and feel of the older or newer versions.
Three Environments for ASP.NET Development
• Standalone Environment - In a standalone environment, a single computer
serves as both the client and the server.
• Intranet Environment - In an intranet environment, the clients are connected
to the server over an intranet.
• Internet Environment - In an Internet environment, the clients are connected
to the server over an Internet.
Standalone Environment
What You Need on Your PC
 Windows 7 or later
 .NET Framework 4.5
 Visual Studio 2012
 IIS Express
 SQL Server Express LocalDB
Intranet Environment
What You Need on Your PC
 Windows 7 or later
 .NET Framework 4.5
 Visual Studio 2012
Internet Environment
What You Need on Your PC
 Windows 7 or later
 .NET Framework 4.5
 Visual Studio 2012
The Components of the .NET Framework
The .NET framework is divided into two main components, the .NET Framework Class Library and the
Common Language Runtime (or CLR) and these components provide a common set of services for
applications written in .NET languages like Visual Basic or C#.
The .NET Framework Class Library consists of classes that provide many of the functions that you need
for developing .NET applications. For instance, the ASP.NET classes are used for developing ASP.NET
web applications, and the Windows Forms classes are used for developing standard Windows
applications.
The other .NET classes let you work with databases, manage security, access files, and perform many
other functions. The CLR provides the services that are needed for executing any application that's
developed with one of the .NET languages. This is possible because all of the .NET languages compile
to a common Intermediate Language (or IL), which is stored in an assembly. The CLR also provides the
Common Type System that defines the data types that are used by all the .NET languages. That way,
you can use the same data types no matter which .NET language you 're using to develop your
applications.
NOTE: If you peruse the Interwebs
looking for ASP.NET code, some of
the code you find will be C# code
and some will be Visual Basic code.
When
used
correctly
in
programming with Visual Studio,
both will accomplish the exact same
thing! Whatever you can do in C#
you can do in Visual Basic, and visaversa, because of the Common
Language Runtime (CLR), although
this was not always the case. For the
purposes of this class, we will be
developing using C#.
Something of Interest: http://www.tutorialspoint.com/codingground.htm
and https://ideone.com/
The .NET Framework
.NET Applications
Visual Basic
Visual C#
Visual C++
Visual F#
.NET Framework
.NET Framework Class Library
Windows Forms classes
ASP.NET classes
Other classes
Common Language Runtime
Managed applications
Common Type System
Intermediate Language
Operating System and Hardware
Windows 7
Windows 8
Other Operating Systems
Web Applications and State
A web application ends after it generates a web page. That means that any data maintained by
the application, such as variables or control properties, is lost because HTTP doesn't maintain the
state of the application. After the server processes the request and returns the page to the
browser, it drops the connection. Then, if the browser makes additional requests, the server has
no way to associate the browser with its previous requests. Because of that, HTTP is known as a
stateless protocol.
Client
Browser
Browser
Browser
Server
First HTTP request:
The browser requests a page.
First HTTP response:
The server returns the
requested page and the
application ends.
Next HTTP request:
The browser requests another
page. The server has no way
to associate the browser with
its previous request.
Web server
Web server
Web server
Please Note: The following slides represent a fast-and-furious
overview of working with an ASP.NET web form, are meant for
summary purposes only, and are not representative of the structure
of the class. We will be going through ASP.NET web forms following
a structured step-by-step pace starting with Lecture 2.
How State is Handled with ASP.NET Applications
Although HTTP doesn't maintain state, ASP.NET provides several ways to do that, as summarized
in the table on upcoming Slide 41.
First, you can use view state to maintain the values of server control properties. For example,
you can use view state to preserve the values of the items in a drop-down list. Because ASP.NET
implements view state by default, you don't need to write any special code to use it.
Second, you can use session state to maintain data between executions of an application. To
make this work, ASP.NET creates a session state object that is kept on the server whenever a user
starts a new session. This session object contains a unique session ID, and this ID is sent back
and forth between the server and the browser each time the user requests a page. Then, when
the server receives a new request from a user, it can retrieve the right session object for that
user. In the code for your web forms, you can add data items to the session object so their
previous values are available each time a web form is executed.
How State is Handled with ASP.NET CONTINUED
Third, you can use an application state object to save application state data, which applies to all
of the users of an application. For example, you can use application state to maintain global
counters or to maintain a list of the users who are currently logged on to an application.
Fourth, you can use server-side caching to save data. This is similar to application state in that
the data saved in the cache applies to all users of an application. However, caching is more
flexible than application state because you have control over how long the data is retained.
Last, you can use the profile feature to keep track of user data. Although a profile is similar to a
session state object, it persists between user sessions because it is stored in a database.
NOTE: We will use view, session, and application states as this class progresses. Because profiles
are used infrequently, they aren't presented in this class.
State as Discussed in the Murach's Book
A Look at an ASP.NET Default Form
The Future Value Calculator application after user clicks Calculate button
A Look at an ASP.NET Default Form
The Future Value Calculator application with error message displayed
The Future Value Calculator in Design View of Visual Studio 2012
The files in the Future Value Calculator application.
Folder
File
(root)
Default.aspx
(root)
Default.aspx.cs
(root)
Styles.css
(root)
Web.config
Images
WinkusLogo.jpg
The .aspx file for the Default form (Default.aspx)
page directive:
• Language
• AutoEventWireup
• CodeFile
• Inherit
DOCTYPE
Runat="server"
REQUIRED FOR ALL ASP.NET FORMS
onclick event
aspx code
The code-behind the Default form (Default.aspx.cs)
Page_Load
IsPostBack / !IsPostBack
IsValid
Code-behind code (C# code)
Lecture 01 Example: Lecture01_Example.zip
Suggested Links of Interest
• Getting Started with ASP.NET (Microsoft)
• ASP.NET Tutorials (W3Schools)
• ASP.NET Tutorial (TutorialsPoint)
• The Complete ASP.NET Tutorial
• ASP.NET Tutorial (DotNetTricks)
https://www.udemy.com
Lecture 01: In-Class Exercise
From the menu bar, select Lectures and go to the Lectures 01 bar and select Lecture 01 ICE to begin
working on today's in-class exercises.