CCSW-321: Web

Development

Chapter 1
Introduction to Computers and the
Internet
 Textbook

Deitel, "Internet and World Wide Web: How to

Program", Pearson Education (Prentice Hall), 5th
Edition, ISBN-13: 978-0132151009 ISBN-10:
0132151006 ©2013
 Topics
Building Web Site By Using HTML5
Cascaded Style Sheets CSS3
Client-side Scripting by Using Java Scripts
Server-side Scripting by Using PHP
Introduction to Internet and World Wide Web (WWW)
Web Servers: Apache
Web site and Database Interactivity: MS SQL

3
 Introduction
Web programming technologies are designed to be
portable, allowing to design web pages and applications
that run across an enormous range of Internet-enabled
devices.
Client-side programming build web pages and applications
that are run on client browsers.
Server-side programming build web apps that respond to
requests from client browsers, such as searching the
Internet, checking bank-accounts , ordering a book from
Amazon, bidding on an eBay auction and ordering concert
tickets.
 HTML5
HTML (Hypertext Markup Language) is a markup language
designed to specify the content and structure of web pages
in a portable manner.
HTML5, under development, Supports Multimedia.
W3C Candidate, subsumes HTML4, XHTML & DOM.
Enables to create content that render appropriately across
any device connected to the Internet including
smartphones, tablet computers, notebooks, desktop
computers, special-purpose devices such as large-screen
displays at concert arenas and sports stadiums, and more.
 CSS3
Cascading Style Sheets (CSS) specify presentation or styling,
of elements on a web page (e.g., fonts, spacing, sizes, colors,
positioning).
Although HTML5 provides capabilities for controlling
presentation, it’s better not to mix it with content.
CSS designed to style portable web pages independently of
their content and structure.
Separating styling from page content and structure, can
easily change the look and feel of the pages on an entire
website, or a portion of a website, simply by swapping out
one style sheet for another.
CSS3 is the current version of CSS under development.
 JavaScript
Helps build dynamic web pages (i.e., pages that can be
modified “on the fly” in response to events, such as user
input, time changes, and computer apps.
Enables the client-side programming of web apps.
JavaScript is a portable scripting language. Programs written
in JavaScript can run in web browsers across many devices.
 JQuery
jQuery.org most popular of many JavaScript libraries.
Simplifies JavaScript programming by easier handling of web
page’s elements. It interacts with servers in a portable
manner across various browsers.
Provides a library of custom graphical user interface (GUI)
controls (beyond the basic GUI controls provided by HTML5)
that can be used to enhance the look and feel of your web
pages.
 PHP
PHP, Hypertext Preprocessor, is a popular server-side
scripting language for creating dynamic web pages.
PHP is open source and platform independent for UNIX,
Mac and Windows and most databases.
PHP enables responding to requests from users and
generating web pages with dynamic content.
PHP code is embedded into HTML5 documents, yet
interpreted by a server before delivered to the client.

©1992-2012 by Pearson Education, Inc. All

Rights Reserved.
 Web Basics: URIs and URLs
URIs (Uniform Resource Identifiers) identify resources on the
Internet. URIs that start with http:// are called URLs (Uniform
Resource Locators).
A URL contains information that directs a browser to the
resource that the user wishes to access.
Web servers make resources available to web clients.
Popular web servers include Apache’s HTTP Server and
Microsoft’s Internet Information Services (IIS).
 URL Example
http://www.deitel.com/books/downloads.html

http://: A Hypertext Transfer Protocol to get a resource.

www.deitel.com : Qualified hostname of the web-server
The hostname is translated into an IP (Internet Protocol)
address, a unique value that identifies the web server.
An Internet Domain Name System (DNS) server keeps a
database of hostnames and their corresponding IP addresses
and performs automatic translations.
 Example

(/books/downloads.html) specifies resource’s location

/books and name (downloads.html) on the web server.
The location could represent an actual directory on the
web server’s file system. For security reasons, though,
the location is typically a virtual directory.
The web server translates the virtual directory into a
real location on the server, thus hiding the resource’s
true location.
 HTTP get and post Requests
The HTTP request types (methods) are get and post.
A get request typically retrieves information from a
server, such as an HTML document, an image or search
results based on a user-submitted search term.
A post request typically sends data to a server (e.g.
form data or documents).
Get requests and post requests can both be used to
send data to a web server, but each request type sends
the information differently.
 HTTP get Requests
A get request appends data to the URL, e.g.,
www.google.com/search?q=deitel :
search is the name of Google server-side form handler
q is the name of a variable in Google’s search form
deitel is the search term
? separates the query string from the rest of the URL
A name/value pair is passed to the server with the name and
the value separated by an equals sign (=).
If more than one name/value pair is submitted, each pair is
separated by an ampersand (&).
The server uses data passed in a query string to retrieve and
send an appropriate resource.
 HTTP post Requests
A post request sends form data as part of the HTTP message,
not as part of the URL.
A get request typically limits the query string (i.e., all to the
right of the ?) to a specific number of characters, so it’s often
necessary to send large amounts of information using the
post method.
The post method is also sometimes preferred because it hides
the submitted data from the user by embedding it in an HTTP
message.
If a form submits several hidden input values along with user-
submitted data, the post method might generate a URL like
www.searchengine.com/search.
 Multitier Application Architecture
Web-based applications are often multitier that divide
functionality into separate tiers (i.e., logical groupings
of functionality).
 Client-Side vs. Server-Side Scripting
Client-side scripting (i.e. PHP) with JavaScript validate user
input, interact with the browser, etc.
Client-side scripting depends on browser; the browser must
support the scripting language and capabilities.
Scripts are restricted from arbitrarily accessing local
hardware and file system for security reasons.
Sensitive information as passwords or other private data,
should not be on the client.
All client-side data validation should be mirrored on the
server. Placing certain operations in JavaScript on the client
can open web apps to security issues.
 Web 2.0: Going Social
Web 2.0 embraces an Architecture of Participation: a design
that inspires user interaction and community contributions.
Open source software is available for anyone to use and
modify with few or no restrictions .
Collective intelligence, the concept that large diverse group
of people create smart ideas. Communities collaborate to
develop software that people believe is better and more
robust than proprietary software.
Rich Internet Applications (RIAs) are being developed using
technologies (such as Ajax) that have the look and feel of
desktop software, enhancing a user’s overall experience.
 Web 2: Web Services & Mashups

The textbook presents web services and introduce the

applications-development methodology of mashups,
in which you can rapidly develop exciting applications
by combining complementary web services ( Often
free) and other forms of information feeds