Previous
Next

Web Development Fundamentals

Web Development Fundamentals

Occupation
Over View
PROGRAM STANDARDS AND LEARNING OUTCOMES
ADMISSION REQUIREMENTS
Subject/Module Outline

WEEK 1 FUNDAMENTALS OF HTML
Introduction to HTML
Elements in HTML(Block and Inline)
Attributes in HTML
Headings in HTML
Paragraphs in HTML
Styles in HTML
Quotations in HTML
Comments in HTML
Links in HTML
Tables in HTML
List in HTML
Classes in HTML
ID in HTML
Forms in HTML
Projects: Single Page Portfolio Website

WEEK 2 Fundamentals of CSS
Introduction to CSS
CSS Syntax
CSS Selectors
Methods of inserting CSS
Comments in CSS
Colors in CSS
Backgrounds in CSS
Borders in CSS
Margins in CSS
Padding in CSS
CSS Box Model
Outline in CSS
Fonts in CSS
Icons in CSS
Links in CSS
Display Property in CSS
Max-Width property in CSS
Positioning in CSS
Overflow property in CSS
Inline-block property in CSS
Align property in CSS
Pseudo classes and Pseudo elements in CSS
Opacity property in CSS
CSS Units
Specificity in CSS
Projects : Huddle Landing Page
Crowd Funding Product Page

WEEK 3 CSS FLEXBOX AND CSS GRID
Introduction to Flexbox
Flex Container and its properties
Flex-Direction
Flex-Wrap
Flex-Flow
Justify-Content
Align-Items
Align-Content
Flex Item and its properties
The Order Property
Flex-Grow
Flex-Shrink
Flex-Basis
Flex
Align-Self
Project: Insure Landing Page

CSS GRID
Introduction to CSS Grid
Grid Container and its properties
Grid-Template-Columns
Grid-Template-Rows
Justify-Content
Align-Content
Grid Item and its properties
Grid-Column
Grid-Row
Grid-Area
Order of Items
Project: Testimonials page

WEEK 4 RESPONSIVE WEB DESIGN AND WEB ACCESSIBILITY
Introduction to Responsive Web Design
The View Port
Grid View
Media Queries
Responsive Images
Responsive Videos
Responsive Typography
Project : Dark Theme Landing page
Web Accessibility
Introduction to web accessibility
Benefits of Web accessibility
WCAG 2.1 Principles
Implementing web accessibility principles in websites

WEEK 5 BOOTSTRAP 4
Introduction to Bootstrap 4
Containers
Grid Basic
Typography
Colors
Tables
Images
Jumbotron
Alerts
Buttons
Button Groups
Badges
Spinners
Pagination
List Groups
Cards
Dropdowns
Collapse
Navs
Navbar
Forms
Inputs
Carousel
Modal
Tooltip
Popover
Utilities
Flex
Icons
Project: Easy Bank Landing Page

WEEK 6 FUNDAMENTALS OF JAVASCRIPT
Introduction to JAVASCRIPT
Variables in JavaScript
Comments in JavaScript
Operators in JavaScript
Data types in JavaScript
Functions in JavaScript
Classes and Objects in JavaScript
Strings and String Methods in JavaScript
Number and Number Methods in JavaScript
Arrays and Array Methods in JavaScript
Conditional Statements in JavaScript
Loops in JavaScript
Scope in JavaScript
JavaScript Events
Error Handling in JavaScript
JavaScript DOM
Projects: Launch Count Down Timer
Social Media Dash Board with Theme Switcher

WEEK 7 INTERMEDIATE HTML
Semantic HTML
HTML Video
HTML Audio
HTML Plug ins
Playing YouTube videos using HTML
HTML APIS: HTML Geolocation
HTML Drag and Drop
HTML Web Storage
Projects: A Simple Audio Player
A simple Video Player

WEEK 8 INTERMEDIATE CSS
Border Radius property
Gradients in CSS
Shadows
Text Effects
Web Fonts
2D and 3D Transforms
Tool tips
Image Reflection Property
Style-Images
Resize property in CSS
Object fit and object position property
Box sizing
CSS transitions
CSS Animations
Animation Libraries (Animate on Scroll library)
Project: Bookmark Landing Page

WEEK 9 INTERMEDIATE JAVASCRIPT
Introduction to ES6
Const and Let key words
Template Literals
Destructuring Objects
Object Literals
For-of Loop
Spread Operator and Rest parameter
Arrow functions
Default Parameters
Import and Export
PadStart() and PadEnd Methods
Classes
Promises
Async and Await
Fetch API
Higher Order Functions : Map, Reduce and Filter
Projects: ToDo App
Countries Page with Theme Switcher

WEEK 10 FUNDAMENTALS OF REACT
Introduction to React
Rendering HTML in React
JSX in React
React Components
CSS in React
Props
State
Events
Lifecycle methods
Conditional rendering
Fetching Data from an API with React
React Forms
Project: Weather App

BONUS COURSE:
FUNDAMENTALS OF GIT AND GITHUB
Introduction to GIT
Introduction to GITHUB
Repositories
Branches
Commits
Pull Requests

Quick Contact

Useful Links