ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
Duration: 46 class room hrs + 44 lab hrs
Objective: To introduce the students the HTML, JavaScript, Joomla, PHP, XML & Ajax and it’s practical
relevance.
Prerequisites: Knowledge of Internet
Evaluation method: Theory Exam: 40% weightage.
Practical Exam: 40% weightage.
Assignments: 20% weightage.
List of books / Other training Material:
Course Material:
Reference:
1. HTML5 covers CSS3, Java script, XML, XHTML, Ajax, PHP and jQuery-Black Book, DreamTech
2. Internet & World Wide Web How to Program by Deitel, Deitel & Nieto; Pearson Education
3. XML - How to Program - Deitel and Deitel - Prentice Hall
4. Ajax In Action by Dave Crane, Eric Pascarello, Dreamtech Press
5. Web Application Security: A Beginner\'s Guide, Bryan Sullivan, TMH
6. Joomla: 24-Hour Trainer (With CD)by Jen Kramer/ Wiley India Pvt Ltd (2011)
Session 1: HTMLs
Lecture:
• Brief history of the Internet
• How the internet works
• Internet protocol; HTTP protocol; Domain names; Domain Names Service Servers
• Web servers; IIS; Apache server
o Introduction to basic HTMLAligning the Headings
o Anchor Tag
o Paragraph
o Images and Pictures
o Tables
o Framesets
• New features in HTML5
o New element
o New attribute
o Link relations
o Microdata
o ARIA accessibility
o Multimedia
o 2D and 3D drawing Support
Assignment – Lab:
• Create your bio-data in an HTML Page. Divide it into following sections – Personal information,
Family Background, Academic Qualifications, and Experience. Now divide a HTML page into
three frames as upper, left and right (main) frames. Write a Heading in the upper frame and
put the bio-data sections links in the left frame and on click the section links the respective
detail information should be displayed into the right main frame.
PG-DAC, Advanced Web Programming Page 1 of 8
ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
Session 2: HTML (Contd..)
Lecture:
• Forms
• HTML Controls
o INPUT
o Text Area
o Radio Button
o Check Box
o Dropdown
o List box
o Submit button
o Set button
o Button
• Cascading style sheet
• Linking a style to an HTML document
• In line style
• External style sheet
• Internal style sheet
• Multiple styles
• Introduction to DHTML
Assignment 1– Lab:
• Write a CSS rule that changes the color of all the elements with attribute CLASS =”Green-
Move” to green and shift them down 25 pixels and right 15 pixels.
Assignment 2– Lab:
• Create a form to submit a resume
Session 3: JavaScript
Lecture
• Introduction to JavaScript
• What is JavaScript?
• Advantages of using Java Script on client side over VB Script
• How to embed JavaScript in HTML Page?
• How it works?
• How to handle events?
• Variables in Java Script
o “Var” type
o Scope of variables
• Array in Java Script
• Using array methods (length, reverse, sort etc)
Assignment – Lab:
• Implement factorial in Java Script.
Session 4: JavaScript (Conti.)
Lecture:
PG-DAC, Advanced Web Programming Page 2 of 8
ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
• Creating Objects in Java Script
o Date
o String
o Using Object methods
• Operators
o Arithmetic
o Logical
o Bitwise
o this
o new
o delete
• Control and Looping Statements
Assignment – Lab:
• Write a program to sort input strings.
• Display a complete date with the name of the Session and name of the month
Session 5: JavaScript (Conti.)
Lecture: Functions
• Common Events
o onClick
o onLoad
o onMouseOver
o onReset
o onSubmit
• Different functions:
o alert(), prompt(), confirm().
o eval
o isFinite
o isNaN
o parseInt and parseFloat
o Number and String
o escape and unescape
• DOM
• Object hierarchy in Java Script
• Working With
o Window
o Form
o Document
o Frame
Assignment – Lab:
• Validate the above resume form using the Java Script
Session 6:
• Introducing to jQuery
PG-DAC, Advanced Web Programming Page 3 of 8
ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
• Selecting the elements
• Bringing pages to life with jQuery
Session 7:
• JQuery Events
• Energizing pages with animations and effects
• DOM with jQuery utility functions
Session 8:
• Introduction of UI Scripting Framework
Session 9: PHP
Lecture:
• Basic rule of PHP
• PHP in action
• Working with text, variable and numbers
• Making decisions and repeating yourself
• Arrays
Working with Arrays
Looping through array
Sorting arrays
• Functions
Assignment – Lab:
• Write a simple program in PHP.
• Write a program in PHP that uses the increment operator (++) and combined multiplication
(*=) operator to print out the numbers from 1 to 5 and powers of 2 from 2(2^1) to 32(2^5)
Session 10: PHP
Lecture:
• Making web forms
Form processing with functions
Validating data
Display default value
• Working with cookies and Sessions
Login and User Identification
Parsing, display date and times
Assignment – Lab:
Write a simple program to remembering user with cookies and Sessions
Session 11: PHP
Lecture:
• Storing information with databases
Connection to database
Create a table
Inserting and retrieving data from database
Inserting and retrieving form data safely
PG-DAC, Advanced Web Programming Page 4 of 8
ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
MySQl with out PEAR DB
• XML
Generating and Parsing an XML Document
Advanced XML processing
• Debugging
Fixing parsing error and database error
Assignment – Lab:
Write a program to implement various databases queries.
Session 12: PHP
Lecture:
• Working with files
File permissions
Reading and writing files
Working with CSV Files
Checking for errors
• Command line PHP
• Running Shell command
• IMAP, POP3 and NNTP
• Graphics, PDF
• Sending and receiving mails
Assignment – Lab:
Write a program to implement various file operation.
Write a program to implement Command line PHP
Write a program in PHP for Sending and receiving mails
Session 13: XML
Lecture: Introduction
• Introduction to XML.
• XML and the browser.
• Revision of HTML and Client-Server Architecture.
• XML as the mode of data transfer.
• XML Parsers.
• A basic XML Document.
• Parts of the XML Document.
• Namespaces.
• The Root Element.
• Tags and Elements
• Attributes and Values.
• CDATA and PCDATA
Assignment – Lab:
• Create some basic XML documents and check them out in the IE browser for validity.
PG-DAC, Advanced Web Programming Page 5 of 8
ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
Session 14: DTD
Lecture
• Creating Document Type Declarations.
• Creating Document Type Definition.
• Internal and External DTD’s
• Associating DTD’s with XML documents. (The XML Declaration and DOCTYPE declaration.)
• Validating documents against a DTD
• Internal and External General Entities.
• Element Type (ELEMENT) Declarations.
• Attribute (ATTLIST) Declarations.
• Using INCLUDE and IGNORE.
Assignment – Lab:
• Create a XML document and write DTD for it
• Create a XML document and validate it
Session 15: W3C DOM and DataBinding
Lecture
• Introduction to DOM
• The DOMDocument Object and its properties.
• Getting Elements by name
• Editing attributes and values.
• Handling Events on client side.
• Data Binding in Internet browser.
• Using Data Source Objects (MSHTML, TDC, XML DSO, Data Islands).
Assignment 1 – Lab:
• Create an HTM page with two frames using XML document
o The top frame should have input text boxes for search criteria. The textboxes are:
Marks greater than, Marks less than:
o The lower frame will contain a grid, which will load the results of the above query.
Assignment 2 – Lab:
• Create an HTM page representing a departmental store bill:
Header info: Name of customer
Date
Bill No.
Bill Details
Consider a purchase of the following items:
Name Qty Rate Amount
Apples 1 24
Lux Soap 4 15
Room freshner 1 200
Assignment 3 – Lab:
• Prepare a single XML representing the above data. Use databinding to display it.
Calculate the total amount thru javascript and assign it to the total amount label at bottom.
PG-DAC, Advanced Web Programming Page 6 of 8
ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
Session 16:
Lecture
• Introduction to Web Data Exchange
• Open Data Protocol
o What is oData
o Need and uses of oData
o How to create a oData
Assignment – Lab:
• Create or consume the Open Data Protocol.
Session 17: Ajax
• Introduction to Ajax
• Ajax using HTML, CSS, JavaScript and DOM
• XMLHttpRequest
• Ajax Architecture
• Introduction to the JavaScript Object Notation (JSON)
Session 18: Web Services
• Creating a windows web services
• Web services and Ajax
Session 19: Ajax Framework
• JPSpan
• DWR
Assignment – Lab:
• A Login and Registration system using Ajax
Session 20: Web security
• SQL Injection
• Cross-Site Scripting (XSS)
Session 21: Joomla
• Introduction to Joomla
• Planning Your Website.
• A Domain Name and Web Hosting.
• Installing Joomla
• Introduction to Joomla Administrator Interface.
• Section and Category Structure, editing & deleting
• Articles in Joomla
Session 22: Joomla
• Menu
o Articles Linking with Menu
o Wrappers and External Links
• Templates and Modules
PG-DAC, Advanced Web Programming Page 7 of 8
ACTS, Pune
Teaching Guidelines for Advanced Web Programming–PG-DAC August 2013
o Latest News and Newsflash
o Custom Html Module and Its Uses
o Embedding Modules in Articles.
• Components( Contacts and Web Links)
Session 23: Joomla
• Installing and Configuring Simple Image Gallery.
• Users and Permissions.
o Creating and Editing Users.
o Creating a Password-Protected Portion of Website.
Assignment – Lab:
• Create a simple website using Joomla with all above features
PG-DAC, Advanced Web Programming Page 8 of 8