Course Curriculum
Preparation
Available in
days
days
after you enroll
Overview of web
Available in
days
days
after you enroll
HTML
Available in
days
days
after you enroll
- Create a HTML boilerplate (5:23)
- Create a HTML boilerplate - exercise (3:11)
- HTML tag & attributes (6:06)
- Indentation (2:30)
- Text (5:45)
- Text - exercise (1:11)
- Image (5:52)
- Image - exercise (2:03)
- Hyperlink (2:49)
- Hyperlink - exercise (1:24)
- Table (5:23)
- Table - exercise (1:49)
- List (1:39)
- List - exercise (0:46)
- Layout elements (4:17)
- Element ID & class (2:01)
- Element ID & class - exercise (1:11)
- Overview of form elements (0:42)
- Form - text box (2:21)
- Form - label (1:29)
- Form - radio button (4:03)
- Form - checkbox (2:01)
- Form - file (1:39)
- Form - password (0:29)
- Form - other inputs (1:14)
- Form - textarea (1:46)
- Form - selection box (1:33)
- Form - button (1:04)
- Form (2:31)
- Form - exercise (5:37)
- Block & inline elements (3:06)
- Block & inline elements - exercise (3:05)
- Practice - simple personal website (11:36)
CSS
Available in
days
days
after you enroll
- What is css (1:37)
- CSS syntax (1:06)
- Overview of CSS selector (1:40)
- CSS selector - simple selector (3:02)
- CSS selector - combinator selector (2:58)
- CSS selector - pseudo-class selector (1:04)
- CSS selector - exercise (2:44)
- Internal, external, inline CSS (1:33)
- Specificity hierarchy (4:29)
- Useful properties - text (5:03)
- Useful properties - background (6:26)
- Useful properties - size (1:14)
- Useful properties - font (1:29)
- Useful properties - position (5:54)
- Useful properties - display (3:04)
- Useful properties - flexbox (10:35)
- Useful properties - overflow (1:32)
- CSS inheritance (2:24)
- Useful properties - exercise (10:02)
- Units (6:14)
- Units - exercise (0:51)
- Box model (5:43)
- Box model - exercise (2:44)
- CSS tips & tricks (2:20)
- Responsive web design (8:34)
- Responsive web design - exercise (6:38)
- Practice - flexbox trial (11:04)
- Practice - avatar (6:52)
- Practice - website layout (16:34)
- Practice - responsive website layout (11:21)
- Practice - Login page (14:08)
- Practice - web app layout (8:57)
- Practice - responsive web app layout (2:41)
- Practice - responsive menu (15:38)
Assessment - HTML & CSS
Available in
days
days
after you enroll
JavaScript basics
Available in
days
days
after you enroll
- Prepare your coding environment (1:54)
- What is programming (3:09)
- Declaring variables (6:04)
- Difference between var, let & const (4:25)
- Variable naming convention (5:06)
- Variable - exercise (1:40)
- Data type - string (4:38)
- Data type - number (2:22)
- Data type - boolean, undefined, null (2:44)
- Data type - exercise (2:47)
- Comment on your code (2:35)
- Practice - swapping variables (2:14)
- What is operator (0:56)
- Arithmetic operators (9:58)
- Arithmetic operators - exercise (5:15)
- Assignment operators (3:41)
- Assignment operators - exercise (1:58)
- String operators (4:17)
- Comparison operators (6:49)
- Comparison operators - exercise (1:21)
- Logical operators (3:19)
- Logical operators - exercise (4:57)
- Logical operators with comparison (1:25)
- Practice - seconds to time (8:12)
JavaScript conditional handling
Available in
days
days
after you enroll
- if statement (3:38)
- Indentation of JavaScript (4:04)
- if-else statement (2:49)
- else-if statement (4:18)
- Multiple conditions handling (1:34)
- if-else - exercise (4:44)
- switch statement (4:52)
- switch & break statement (5:10)
- switch - exercise (2:21)
- Practice - determine a pikachu (3:21)
- Practice - vowel (1:47)
- Practice - grading (3:03)
- Practice - finding largest number (2:26)
- Practice - simple calculator (3:00)
JavaScript looping
Available in
days
days
after you enroll
- What is looping (2:57)
- while loop (6:36)
- do-while loop (4:04)
- while loop - exercise & debugger (12:37)
- for loop (10:12)
- Infinite loop (2:11)
- for loop - exercise (7:33)
- Nested loop (9:20)
- Nested loop - exercise (5:07)
- Can I break or skip the loop? (1:52)
- Practice - code reading (0:24)
- Practice - prime number (7:08)
- Practice - factorial (3:28)
- Practice - sum of multiples (3:38)
JavaScript function
Available in
days
days
after you enroll
- What is function (4:20)
- Function with parmeter (5:49)
- Function can be stored (1:27)
- Function override (1:01)
- Function inside a function (0:21)
- Reminder for using parameter (0:44)
- Function - exercise (3:55)
- Function with return - part 1 (5:45)
- Function with return - part 2 (3:31)
- Reminder for using return (1:13)
- Function with return - exercise (3:33)
- Function expression (5:11)
- Self invoking function (1:47)
- Function declaration vs function expression (2:48)
- Function expression - exercise (1:57)
- Practice - factorial (2:47)
- Practice - factorial v2 (2:43)
- Practice - finding largest (1:54)
- Practice - finding largest v2 (2:13)
- Practice - function expression (1:11)
- Practice - return (1:55)
- Practice - returning a function (2:38)
JavaScript scope
Available in
days
days
after you enroll
JavaScript basic object oriented programming
Available in
days
days
after you enroll
- What is object (4:05)
- Accessing object properties (5:20)
- Modifying object properties (2:17)
- Deleting object properties (0:45)
- Calling method (1:08)
- Nested object structure (2:38)
- Using object as a dictionary (0:41)
- Absence of any object value (0:23)
- Object - exercise (4:31)
- Object reference (4:34)
- Passing an object into the function - part 1 (4:43)
- Passing an object into the function - part 2 (3:26)
- Object reference - exercise (9:27)
- Object with this (5:44)
- Value of this depends on context (3:01)
- Object with this - exercise (3:17)
- Practice - calculator (1:59)
- Practice - properties access (2:00)
- Practice - properties access 2 (1:35)
- Practice - repeated word (3:51)
- Practice - nested object (2:19)
- Practice - translator (3:25)
JavaScript Classes
Available in
days
days
after you enroll
- How to create object effectively (1:21)
- Using function to create object (3:35)
- Overview of class (2:20)
- Constructor & instantiation (4:14)
- Method in class (3:04)
- How to check the class of an object belonging to (1:23)
- class - exercise (3:47)
- Encapsulation (6:18)
- Getter & setter (6:17)
- Encapsulation - exercise (4:07)
- Static properties (4:30)
- Static properties - exercise (3:36)
- Practice - calculator (2:17)
- Practice - weapon (5:16)
- Practice - soldier (9:42)
JavaScript number & string
Available in
days
days
after you enroll
- Numeric data type conversion (4:47)
- Overview of string methods (1:12)
- Methods for searching string (2:57)
- Methods for extracting string (2:43)
- Methods for modifying string (5:08)
- Number & string - exercise (7:20)
- String comparison (3:56)
- String comparison - exercise (0:20)
- Practice - palindrome (5:23)
- Practice - counting space (1:41)
- Practice - finding domain (1:35)
Assessment - JavaScript programming
Available in
days
days
after you enroll
JavaScript array
Available in
days
days
after you enroll
- What is array (2:41)
- Array is also an object (1:37)
- Initializing an array (1:16)
- Accessing / modifying the array items (1:32)
- Adding items to an array (0:38)
- Inserting / removing items of an array (1:29)
- Looping an array (1:12)
- 2D array (3:47)
- Array - exercise (3:08)
- Methods for searching item in array (1:18)
- Methods for modifying array (2:56)
- Methods for array iteration (2:29)
- Mapping a new array (4:00)
- Filtering an array (3:54)
- Array - exercise (5:11)
- Converting string to array (2:17)
- Converting string to array - exercise (1:29)
- Practice - sum of odd numbers (2:25)
- Practice - code reading (1:49)
- Practice - finding max & min (3:17)
- Practice - array of arrays (2:34)
- Practice - joining an array (3:10)
- Practice - array and object (1:49)
More about JavaScript function
Available in
days
days
after you enroll
- What is recursion (6:35)
- Recursion - exercise (4:55)
- What is callback (5:46)
- Using setTimeout() to delay function call (6:31)
- Callback - exercise (3:22)
- What is closure (5:34)
- Closure - exercise (3:47)
- Practice - palindrome (3:50)
- Practice - callback delay (2:14)
- Practice - foreach & map (2:37)
- Practice - bank (2:24)
JavaScript error handling
Available in
days
days
after you enroll
Web application
Available in
days
days
after you enroll
DOM manipulation
Available in
days
days
after you enroll
- Concept of document object model (2:00)
- JavaScript in the HTML (2:38)
- Getting DOM element (4:34)
- Getting DOM element - exercise (1:43)
- Overview of updating DOM element (0:53)
- Updating DOM element text (1:32)
- Updating DOM element style (1:31)
- Updating HTML inside DOM element (2:18)
- Updating DOM element classes (2:07)
- Accessing DOM element attribute (2:43)
- Accessing input box value (2:30)
- Updating DOM element - exercise (5:07)
- Creating DOM element by method (4:11)
- Creating DOM element by HTML (2:12)
- Creating DOM element - exercise (2:49)
- Deleting DOM element (1:13)
- Deleting DOM element - exercise (1:37)
- Practice - Facebook post (10:44)
DOM event
Available in
days
days
after you enroll
- What is event (2:29)
- What is event listener (2:04)
- Using HTML attribute to add event listeners (5:15)
- Using JavaScript to add event listeners (3:35)
- Information in event object (6:25)
- Event - exercise (5:41)
- Event bubbling (2:18)
- Practice - calculator (4:28)
- Practice - input validator (3:48)
- Practice - side navigation bar (9:59)
- Practice - todo list (7:29)
- Practice - photo gallery (16:06)
Data storage for web app
Available in
days
days
after you enroll
The connection between web app and server
Available in
days
days
after you enroll
- How to communicate with the server (5:33)
- Preparing a HTTP request (3:19)
- HTTP methods (0:58)
- API endpoint (1:18)
- Data types that the server accepts (2:13)
- Examples of HTTP request (3:50)
- Receiving a HTTP response (3:27)
- Request & response - exercise (3:09)
- Fetching data from server (5:44)
- Installation of Nodejs - Windows (1:00)
- Installation of Nodejs - Mac (0:52)
- Installation of API server (2:04)
- Explanation of using the API server (5:18)
- Fetching data from server - exercise (13:33)
- Practice - todo list (16:36)
- Practice - stock price - part 1 (10:41)
- Practice - stock price - part 2 (12:08)
- The problem of using fetch() (3:07)
- Fetching with async/await (7:56)
- Returning data from async function (4:23)
- Error handling with async/await (2:33)
- Practice - todo list with async/await (6:33)
- Practice - login/register - part 1 (7:13)
- Practice - login/register - part2 (5:58)
- Practice - login/register - part 3 (2:30)
- Practice - login/register - part 4 (5:25)
- Practice - fetching private data (6:20)
Assessment - web application
Available in
days
days
after you enroll
Version control - Git
Available in
days
days
after you enroll
- Why do we need version control (1:48)
- Installation of git - Windows (1:27)
- Installation of git - Mac (0:46)
- Command-line interface (7:14)
- Preparation before using git (3:29)
- Commit & log (10:23)
- Branching (8:24)
- Uploading git repo to github (4:58)
- Cloning git repo from github to your computer (1:48)
- Updating local git repo from github (1:03)
- Ignoring the unwanted files (3:06)
Overview of React
Available in
days
days
after you enroll
React JSX
Available in
days
days
after you enroll
React component
Available in
days
days
after you enroll
- Overview of component & properties (6:31)
- Defining & using component (6:21)
- Using properties with component (6:56)
- Handling component logic (1:36)
- Component - exercise (3:37)
- Exporting & importing component - part 1 (5:46)
- Exporting & importing component - part 2 (4:05)
- Exporting & importing component - exercise (2:11)
- Inline css (3:04)
- CSS module (7:24)
- Using CSS - exercise (2:15)
- Adding image (3:06)
- Practice - face (4:22)
- Practice - watch (4:39)
- Practice - CSS class name (1:55)
- Practice - component design (4:39)
React list rendering
Available in
days
days
after you enroll
React event
Available in
days
days
after you enroll
React state
Available in
days
days
after you enroll
- State in component (5:04)
- Adding view logic based on state (3:56)
- State - exercise (2:24)
- Updating state (4:27)
- Mutable & immutable (3:33)
- More on immutable (7:04)
- Mutable & immutable - exercise (3:17)
- Immutable state (1:40)
- How does react render (5:43)
- Parent and child re-rendering (4:47)
- How does react render - exercise (1:22)
- More about useState() (7:52)
- More about useState() - exercise (2:13)
- State sharing (3:26)
- State sharing - exercise (4:38)
- Changing state of ancestor (5:10)
- Changing state of ancestor - exercise (8:55)
- Practice - click counter (3:13)
- Practice - mouse coordinate (4:15)
- Practice - immutable (2:58)
- Practice - ATM - part 1 (2:51)
- Practice - ATM - part 2 (6:56)
React form & DOM handling
Available in
days
days
after you enroll
React side effect
Available in
days
days
after you enroll
- What is side effect (2:33)
- Adding side effect (2:43)
- Adding dependencies of side effect (6:44)
- Running side effect on mount (3:20)
- Clean up function for side effect (5:07)
- Clean up function for side effect with dependencies (8:15)
- Side effect - exercise (10:23)
- Custom hook (5:27)
- Custom hook - exercise (5:21)
- Practice - clock (4:00)
- Practice - countdown (5:07)
- Practice - deferred value (5:25)
- Please start the API server (0:28)
- Installation of API server (2:04)
- Setting vite proxy server (8:02)
- Practice - todo list (12:08)
- Practice - stock price (11:57)
Redux
Available in
days
days
after you enroll
- State management (3:08)
- Why redux (3:23)
- What is action (2:55)
- What is reducer (3:30)
- What is store (1:46)
- Overview of redux implementation (3:57)
- Implementation of action (1:38)
- Implementation of reducer (2:51)
- Configuring store (3:05)
- React with redux (7:23)
- Redux implementation - exercise (5:33)
- Redux toolkit (5:47)
- Redux toolkit - exercise (4:45)
- Asynchronous handling (6:53)
- Asynchronous handling - exercise (4:32)
- Practice - todo list - part 1 (9:56)
- Practice - todo list - part 2 (7:35)
- Practice - multi-language app (14:07)
React router
Available in
days
days
after you enroll
- Problem of single page app (3:14)
- Setting routes (6:19)
- Setting routes - exercise (2:39)
- Getting parameter from URL (7:33)
- Getting parameter from URL - exercise (3:16)
- Nesting routes (5:36)
- Link (3:31)
- Nesting routes - exercise (6:28)
- Handling route not found (1:44)
- Protecting your routes - part 1 (3:42)
- Protecting your routes - part 2 (4:58)
- Code splitting (8:05)
- Practice - simple login logout - part 1 (6:14)
- Practice - simple login logout - part 2 (3:07)
- Practice - simple login logout - part 3 (6:21)
- Practice - simple login logout - part 4 (3:04)
- Practice - simple login logout - part 5 (2:20)
- Practice - simple login logout - part 6 (2:05)
Assessment - react
Available in
days
days
after you enroll
