Web Programming Course Outline

Web Application Development

Department of Computer Science and I.T.

2021

Morning

PROGRAM (S) TO BE EVALUATED: BSCS-V

A. Course Description

Course Code

CS-324

Course Title

Web Application Development

Credit Hours

2+1

Prerequisites by Course(s) and Topics

Problem Solving and Programming , Database

Follow Up

Assessment Instruments with Weights (Homework, quizzes, midterm, final, programming assignments, lab work, etc.)

Sessional 25%	Mid 25%	Final 50%	Total 100%
Quizzes: 15%	Mid Paper: 25	Final Paper: 50	100
Assignment: 10%
Class Participation: 5%

Course coordinator

URL (if any)

Current Catalog Description

Textbook (or Laboratory Manual for Laboratory Courses)

A. Terry A. Morris, Web Development & Design Foundations with HTML5, 8/e, Addison Wesley, 2012

B. Ben Frain, Responsive web design with HTML5 and CSS3, Packt Publishing Ltd, 2012

C. Kevin Tatroe et al., Programming PHP, 3/e, O'Reilly Media, 2013

D. JeffreyWiL., Jac,Kt3, Web Application Development with Yii and PHP, 2/e, Packt Publishing, 2012

E. Zak Ruvalsga, Murach's JavaScript and jQuery, Mike Murach & Associates, 2012

F. Papazoglon, Web Services, 2/e, Pearson Education Limited, 2012

Reference Material

https://www.w3schools.com/

Course Goals

Main objectives of the course is to develop web applications using state-of-the-art web technologies. After completing the course, the student will be able to build dynamic web applications using a web application framework.

Course Contents

Markup languages: HTML, XML; Responsive web applications (using advanced features of markup languages and style-sheets); Web based programming language (open source or proprietary); Database connectivity; Web security (SQL injection, HTML injection, cross site scripting XSS); cookies; sessions; user authentication; Model View Controller (MVC) architecture; web application framework (open source or proprietary); web application deployment; Document Object Model (DOM); JavaScript; AJAX; JavaScript frameworks; DTDs; XML Schema; XPath; XSLT style sheets

Week No.

Class Topic

Source + Help Session (Book-Chapter No., Section No., Page No.)

Introduction to the Internet and World Wide Web

Book A: Chapter 01

HTML Basics:

· Describe HTML, XHTML, and HTML5

· Identify the markup language in a web page document

· Use the html, head, body, title, and meta elements to code a template for a web page

· Configure the body of a web page with headings, paragraphs, line breaks, divs, lists, and blockquotes

Book A: Chapter 02

2.1- 2.10

HTML Basics:

· Configure special characters

· UL and OL

· new HTML5 header, nav, main, & footer elements

· Use the anchor element to link from page to page

· Create absolute, relative, and e-mail hyperlinks

· Code, save, and display a web page document

· Test a web page document for valid syntax

Book A: Chapter 02

2.11- 2.18

Configuring Color and Text with CSS:

· Describe the evolution of style sheets from print media to the Web

· List advantages of using Cascading Style Sheets

· Configure background and text color on web pages

· Create style sheets that configure common color and text properties

· Apply inline styles

Book A: Chapter 03

3.1 – 3. 4

Configuring Color and Text with CSS:

· Use embedded style sheets

· CSS Class, Id, and Descendant Selectors

· Span Element

· Use external style sheets

Book A: Chapter 03

3.5 – 3. 8

· Configuring Color and Text with CSS:

· Configure element, class, id, and descendant selectors

· Utilize the “cascade” in CSS

· Validate CSS

Book A: Chapter 03

3.9 – 3.11

Visual Elements and Graphics:

· Create and format lines and borders on web pages

· Apply the image element to add graphics to web pages

· Configure images as backgrounds on web pages

· Configure images as hyperlinks

· Configure rounded corners, box shadow, text shadow, opacity, and gradients with CSS3

· Configure RGBA color with CSS3

· Configure HSLA color with CSS3

· Use HTML5 elements to caption a figure

Book A: Chpater 04

4.1, 4.3, 4.4, 4.5

Page Layout:

· Describe and apply the CSS Box Model

· Configure margins with CSS

· Configure float with CSS

· Configure positioning with CSS

· Create two-column page layouts using CSS

· Configure navigation in unordered lists and style with CSS

Book A: Chapter 06

6.1, 6.2, 6.3, 6.4, 6.5, 6.6

Tables

· Describe the recommended use of a table on a web page

· Create a basic table with the table, table row, table header, and table cell elements

· Configure table sections with the thead, tbody, and tfoot elements

· Increase the accessibility of a table

· Style an HTML table with CSS

Book A: Chapter 08

8.1, 8.2, 8.3, 8.4, 8.5

Forms

· Describe common uses of forms on web pages

· Create forms on web pages using the form,

· input, textarea, and select elements

· Create forms that provide additional accessibility features using the accesskey and tabindex attributes

· Associate form controls and groups using the label, fieldset, and legend elements

· Create custom image buttons and use the button element

· Use CSS to style a form

· Configure the new HTML5 form controls, including the e-mail address, URL, datalist, range, spinner, calendar, and color controls

· Describe the features and common uses of server-side processing

· Invoke server-side processing to handle form data

Book A: Chapter 09

9.1 – 9.8

Web Multimedia and Interactivity

· Plug-Ins, Containers, and Codecs

· HTML5 Audio and Video Elements

Book A: Chapter 11

11.1, 11.4

A Brief Look at JavaScript and jQuery

· Overview of JavaScript

· The Development of JavaScript

· Popular Uses for JavaScript

· Adding JavaScript to a Web Page

Book A: Chapter 14

14.1-14.4

JAVASCRIPT

Introduction to JavaScript:

· Primitives & The Console

· JavaScript Numbers

· WTF is NaN

Variables and Objects

· Variables & Let

· Updating Variables

· Const & Var

· Booleans

· Variable Naming and Conventions

· Introducing Strings

· Indices & Length

· String Methods

· String Methods With Arguments

· String Template Literals -SUPER USEFUL

· Undefined & Null

· Random Numbers & The Math Object

Book E + Online Resources

JAVASCRIPT

Decision Making Statement: If, Switch

· Decision Making With Code??

· Comparison Operators

· Equality: Triple Vs. Double Equals

· Console, Alert, & Prompt

· Running JavaScript From A Script!

· If Statements

· Else-If

· getColor Conditional Exercise

· Nesting Conditionals

· Truth-y & False-y Values

· Logical AND

· Logical OR

· Logical NOT

Core JavaScript Objects

· Accessing Data Out Of Objects

· Modifying Objects

· Nesting Arrays & Objects

Book E + Online Resources

JAVASCRIPT

Arrays:

Introducing Arrays
Array Random Access
Push & Pop
Shift & Unshift
Push/Pop/Shift/Unshift Practice
Concat, indexOf, includes & reverse
Slice & Splice
Reference Types & Equality Testing
Arrays + Const
Multi-Dimensional Arrays

Loops: For, While & Do While:

Intro to For Loops
Our First For Loop Practice
The Perils Of Infinite Loops :(
Looping Over Arrays
Nested Loops
Another Loop: The While Loop
The Break Keyword
Iterating Over Objects

Book E + Online Resources

JAVASCRIPT

· Functions and Prototypes:

Intro to Functions
Arguments Intro
Functions With Multiple Arguments
The Return Keyword
Is() Function
Function Scope
Block Scope
Lexical Scope

Book E + Online Resources

JAVASCRIPT

· Functions and Prototypes:

Function Expressions
Higher Order Functions
Returning Functions
Defining Methods
The Mysterious Keyword 'this'
Using Try/Catch
The forEach Method
Intro to Arrow Functions
Arrow Function Implicit Returns

· Arrow Functions Wrapup

Book E + Online Resources

JAVASCRIPT

· Functions and Prototypes:

setTimeout and setInterval
The filter Method
Default Params
Spread in Function Calls
Spread with Array Literals
Spread with Objects
Rest Params
Destructuring Arrays
Destructuring Objects
Destructuring Params

Book E + Online Resources

Document Object Model (DOM)

Introducing the DOM
The Document Object
getElementById
getElementsByTagName & className
querySelector & querySelectorAll
innerHTML, textContent, & innerText
Attributes
Manipulating Attributes

Book E + Online Resources

Document Object Model (DOM)

· Changing Styles

· ClassList

· ClassList Practice

· Traversing Parent/Child/Sibling

· Append & AppendChild

· removeChild & remove

· Intro to Events

· Inline Events

Book E + Online Resources

Document Object Model (DOM)

· The Onclick Property

· addEventListener

· Events & The Keyword This

· Keyboard Events & Event Objects

· Form Events & PreventDefault

· Input & Change Events

· Event Bubbling

· Event Delegation

Book E + Online Resources

Responsive web applications

· What on Earth Is Flexbox?

· Flex-Direction

· Justify-Content

· Flex-Wrap

· Align-Items

· Align-Content & Align-Self

· Flex-Basis, Grow, & Shrink

· Flex Shorthand

Book B +

online resources

Responsive web applications

· Responsive Design & Media Queries Intro

· The Power of Media Queries

· Building a Responsive Nav

· WTF Is Bootstrap

· Including Bootstrap & Containers

· Bootstrap Buttons

· Bootstrap Typography & Utilities

· Badges, Alerts, & Button Groups

Book B +

Bootstrap online resources

Responsive web applications

· Bootstrap Basics Practice

· Intro to the Bootstrap Grid

· Bootstrap Grid Practice

· Responsive Bootstrap Grids

· Useful Grid Utilities

· Bootstrap & Forms

· Bootstrap Navbars, Bootstrap Icons!

Bootstrap online resources

JQuery

· Introduction

· Install & Configuration

· jQuery Syntax

· Selectors

· Events: Hide/Show, Fade, Slide, Animate, Stop, CSS

· jQuery Callback

· jQuery Chaining

Book E + Online Resources

Extensible Markup Language – XML

· What is XML?

· XML Benefits

· XML Holds Data, Nothing More

· XML Separates Structure from Formatting

· XML Promotes Data Sharing

· XML is Human-Readable

Book E + Online Resources

Document Type Definition – DTD

· Introduction

· DTD Building Blocks

· Elements & Attributes

· Entities

· Validation

Book E + Online Resources

DreamWeaver

· Interactivity

· Application Development Environment

· Collaboration & Productivity

· Site Management and Media

· Customizing & Extending

· Page Authoring, Design & Management

Book E + Online Resources

PHP HyperText PreProcessor - PHP

· Introduction

· PHP Document

· Language Fundamentals: Variables, Constants

· Decision Making Statement: If, ? & Switch

· Loops: For, For-Each While & Do While

· Statement: Break, Continue

· Operators: Airthmentic, String, Assignment, Comparison,

· Incr/Decr etc.

Book C + Online Resources

PHP HyperText PreProcessor - PHP

· PHP functions:

· Arrays: Numerically Indexed, Associative

· Array Functions: Join, Explode, Implode, In_Array,

· Array_Search.

· String Functions: Strlen, Printf, Substr, Str_Replace

· Server-Side Processing

Book C + Online Resources

PHP HyperText PreProcessor - PHP

· Processing Forms via GET/POST

· GET or POST?

· State and Persistence: Cookies/Session

· Web Application Development

· Introduction to PHP Frameworks

· Basic OOP

Book C + Online Resources

SQL & MySQL

· What is SQL & MySQL and its Versions?

· MySQL CLI:mysql/GUI:phpmyadmin

· Administration & Query Browser

· Creating Databases and Tables

· Using keys

· Table Types in MySQL

· Data Types:Varchar, Int, Char, Date and Time

· Deleting databases and tables

· Inserting, Retrieving, Updating and Deleting data

· MySQL User Accounts, Privileges and Access Control

· MySQL documentation

Book C + Online Resources

Integrating PHP and MySQL

· PHP interfacing with MySQL

· Connecting to MySQL

· Connecting to a database

· Executing SQL

· Retrieving the data set

· Refining the fetch

Book C + Online Resources

MVC

Typical workflow of a Yii application

Book D + Online Resources

Full Stack Development Project

Search This Blog

COURSE OUTLINES

Web Programming Course Outline

Comments

Post a Comment

Popular posts from this blog

Software Engineering Basics Outline

Advanced DBMS outline