CS202 : Fundamentals of Front End Development

Course Overview

Course Synopsis

This course starts with describing front end development on web. Build foundations on Html, CSS and JavaScript, and cover advance topics based on current trends, of Html5, CSS3, Responsive Design and some of its frameworks like Bootstrap. Focus is to learn while solving different problems and doing many real life case studies.

Course Learning Outcomes

Learning Outcomes:

  • Enable Course attendant to gain Web Front End Development knowledge and experience with real life case studies.
  • Understanding Web Development process
  • Able to develop Web site front end using HTML/5, CSS/3 and JavaScript.
  • Understanding of Advance topics, and current trends in Web Front end development.


Course Calendar

1 Introduction to Front-End Development
2 URL Uniform Resource Locator
3 HTTP Basics
4 Webserver, Services and Agents
5 Domain Hosting, FTP
6 Fundamentals of HTML
7 HTML Basics
8 HTML Elements and Attributes
9 HTML Elements and Attributes_2
10 Heading and Paragraph
11 HTML Styling
12 HTML Quotations

13 HTML Computer Code
14 HTML Comments
15 HTML Links
16 HTML Images
17 HTML Table
18 HTML Tables Handling
19 HTML List
20 HTML Blocks
21 HTML Layout
22 HTML Iframe
23 HTML Forms
24 HTML Colors

25 HTML Head
26 HTML Entities and Symbol
27 HTML Encoding(Character Sets)
28 HTML URL Encoding
29 HTML and XHTML
30 Introduction to CSS
31 CSS Syntax
32 CSS Selectors
33 CSS Insertion
Assignment 01
34 CSS Background
35 CSS Text and Fonts
36 CSS - Text and Fonts
37 CSS Links

38 CSS - Lists
39 CSS-Tables
40 CSS Box Model
41 CSS Border and Outline
42 CSS Margin and Padding
43 CSS - Dimension
44 CSS - Display
45 CSS Positioning & Floats
46 CSS - Positioning & Floats

47 CSS Align
48 CSS Combinators
49 CSS Pseudo-Class
50 CSS - Pseudo Element
51 CSS Class
52 CSS Navigation Menu
53 CSS Image Opacity
54 CSS Image Sprites
55 CSS Media Types
56 CSS - Attribute Selector
57 Fundamental of JavaScript
58 JavaScript - Syntax
59 JavaScript Statements
60 JavaScript - Comments
GDB

61 JavaScript Variables & Operators
62 JavaScript Variables and Operators
63 JavaScript - Functions
64 JavaScript Objects
65 JavaScript Scope
66 JavaScript Events
67 JavaScript Strings
68 JavaScript Numbers
69 Javascript Number Methods
70 JavaScript Math
71 JavaScript Date - a
72 JavaScript Date - b
73 JavaScript Arrays
Quiz 1

74 JavaScript Arrays(Cont..)
75 Array Methods
76 JavaScript Array Methods
77 JavaScript Comparisons
78 JavaScript Conditions
79 Switch Statements in JavaScript
80 JavaScript For Loop
81 JavaScript While Loop
82 JavaScript Break & Continue
83 JavaScript Data Type
84 JavaScript Type Conversion
85 JavaScript RegExp
86 JavaScript Hoisting
87 JavaScript Error Handling
88 JavaScript Debugging

89 JavaScript Best Practices - a
90 JavaScript Best Practices - b
91 JavaScript Common Mistakes
92 JavaScript Common Mistakes(Con..)
93 JavaScript Performance
94 JavaScript Reserved Words
95 JavaScript Global Func.& Prop.
96 JavaScript Window Object
97 JavaScript and Forms
98 JavaScript Case Study
99 AJAX Introduction
100 AJAX Sending Request-a
101 Sending Request-b
102 AJAX Receiving Response-a
Quiz 2

103 AJAX Receiving Response-b
104 AJAX Case Study
105 JQuery Introduction
106 JQuery Syntax
107 JQuery Selectors
108 JQuery Traversing
109 JQuery Events-a
110 JQuery Events-b
111 JQuery Effects-a
112 JQuery Effects-b
113 JQuery Effects-c
114 JQuery Effects-d

115 JQuery Animate
116 XML Element
117 JQuery Chaining
118 JQuery HTML- a
119 JQuery HTML - b
120 JQuery CSS - a
121 JQuery CSS - b
122 JQuery Dimensions
123 JQuery Traversing - a
124 JQuery Traversing - b
125 JQuery Traversing - c
126 JQuery AJAX - a

127 JQuery AJAX - b
128 JQuery noConflict
129 JQuery CaseStudy
130 XML Introduction
131 XML Usage
132 XML Tree
133 XML Syntax
134 HTML5 Canvas Gradients
135 XML Attributes
136 XML NameSpaces
137 XML DTD
138 XML Schema
Assignment 02

139 XSLT (eXtensible Style sheet Language Transformation)
140 HTML5 - audio
141 XPath
142 XLink & XPointer
143 JSON Introduction
144 JSON Syntax
145 JSON Case Study
146 HTML5 Introduction
147 HTML5 Elements
148 HTML5 Semantics - a
149 HTML5 Semantics - b
150 HTML4 to HTML5 Migration
Quiz 3

151 HTML5 Coding Conventions - a
152 HTML5 Coding Conventions - b
153 HTML5 Canvas
154 HTML5 Canvas Coordinates
155 HTML5 Canvas Text
156 HTML 5 Canvas Images
157 HTML5 SVG and Canvas
158 HTML5 Multimedia
159 HTML5 Video
160 CSS3 Multi-Column Layout
161 HTML5 Plug-ins
162 HTML5 Geo Location
Quiz 4

163 HTML5 Drag/Drop
164 HTML5 Local Storage
165 HTML5 App Cache
166 HTML5 Web Workers
167 HTML5 SSE
168 HTML5 Case Study
169 CSS3 Introduction
170 CSS3 Round Corners
171 CSS3 Border Image
172 CSS3 Backgrounds - a
173 CSS3 Backgrounds - b
174 CSS3 Colors

175 CSS3 Gradients - a
176 CSS3 Gradients - b
177 CSS3 Shadow Effects
178 CSS3 Text Effects and Fonts
179 CSS3 Transforms
180 CSS3 Transitions
181 CSS3 Animations
182 CSS3-Responsive Design Testing
183 CSS3-Parallax Background Implementation
184 Responsive Web Design (RWD) Introduction
185 Responsive Web Design (RWD) - The Viewport
186 Responsive Web Design (RWD) Grid-View

187 Responsive Web Design (RWD) Media Queries
188 Responsive Web Design (RWD) Images
189 Responsive Web Design (RWD) Videos