Module Objectives:

•Understand core features of JavaScript
•Build interactive and user-friendly frontend applications using HTML, CSS and JavaScript
•Apply OOP concepts by learning JavaScript
•Debug frontend applications using Google Chrome debugged

Overview:

This course provides you hands-on experience and exposure to develop front end application using JavaScript. Starting with introduction, this course deep dives into core features like Event handling, Form handling and Regular expressions. Specific focus is given for Document Object Model (DOM) and manipulating HTML using various DOM APIs. Along with building JavaScript
features this course builds sound foundations in Algorithms, Problem Solving And Debugging techniques which is critical for a web application developer.

Platform:

•Linux (Fedora / Mandriva / Ubuntu) or Windows Host system
•VSCode editor with Live server
•Google Chrome Debugger

Prerequisites:

•HTML and CSS
•Basic understanding of OOPS

Delivery method:
Instructor lead, hands-on exercises backed with assignments and mini project.

Algorithms and Problem solving

•Problem solving – what?
•Introduction to SDLC
•Polya’s rules
•Algorithm design methods
•Pseudo code creation
•Flowcharts

Introduction to JavaScript

•History of JavaScript
•Advantages
•Limitations
•Script element
•Creating your first JavaScript program
•Coding convention
•Setting up development environment (with VSCode)

Types and Statements

•Keywords in JavaScript
•Overview of Data types
•Primitive Data types
•Non-primitive Data types
•Conditional statements
•I/O in JavaScript
•Loops

Operators

•Introduction to operators
•Operator precedence and associativity
•Deep dive into operators
•Arithmetic
•Comparison
•Ternary
•Logical
•Language
•Bitwise

Functions – Level I

•Introduction to functions
•Function definition
•Passing values •Returning values
•Robust parameter handling
•Local and global variables
•Functions as objects
•Function constructor

Functions – Level II

•Function invocation patterns
•Recursion functions
•Generator functions
•Arrow functions
•Variadic functions
•JavaScript scopes
•Function closures

Arrays and Strings

•Introduction to Arrays
•Array declaration
•Array access methods
•Multi-dimensional arrays
•String properties
•String access methods

Regular Expressions

•Introduction to RegEx
•Regular expression usage
•Modifiers
•RegEx patterns
•RegExp methods
•String methods for RegExp
•Type conversion in JavaScript

Objects in JavaScript

•Introduction to objects
•Type of objects in JavaScript
•Creating objects
•Object methods
•Constructor function
•Prototype in JavaScript
•Inheritance using prototype chain

Event handling

•JavaScript events
•Event handler
•Event flow
•Event bubbling and capturing
•Event listeners
•Event types

Document Object Model (DOM)

•Introduction to DOM
•Types of DOM
•DOM standards and methods
•Manipulating documents using DOM
•Handling images
•Table manipulation
•Animation
•Node and Node-list handling

Browser Object Model (BOM)

•Introduction to BOM
•DOM vs BOM differences
•Window object and methods
•BOM navigator
•BOM history
•BOM location
•BOM timer
•Introduction to Cookies
•Session and persistent cookies

Form Handling

•Introduction to forms
•Form processing
•Forms object
•Accessing data from forms
•Form validation
•Additional features in forms
•Validation APIs

Debugging Techniques

•JavaScript Errors
•Error handling mechanisms
•Introduction to Google Chrome debugger
•Deep dive into debugger window
•Introduction to Breakpoints
•Changing variable values in runtime
•Avoiding mistakes