About Course
LEARNING PATH:
Introduction to HTML and HTML Tags
l. Browsers and HTML
2. Editors Offline and Online
3. Tags, Attributes, and Elements
4. Comments
5. Paragraph
6. Heading
7. Formatting Text
Introduction to HTML and HTML Tags – Continued
1. Lists
2. Links
3. Images
4. HTML Layout Elements
5. HTML Semantic Elements
6. Tables
7. HTML F onns
8. HTML Media
9. HTML Element Reference
I 0. HTML Attribute Reference
Basic Concept of Cascading Style Sheet (CSS) – OJ
I. Introduction to CSS
2. Applying CSS to HTML
3. Selectors, Properties, and Values
4. CSS Colors
5. CSS Backgrounds
6. CSS Box Model
7. CSS Margins, Padding, Borders
8. CSS Text and Font Properties
9. CSS General Topics
Basic Concept of Cascading Style Sheet (CSS) – 02 l. CSS Navigation Bar
2. Navigation Bar I Menu Bar
3. CSS Dropdowns
4. CSS Website Layout
5. CSS Flexbox
6. CSS Media Queries
7. CSS Responsive
Learn About Version Controlling System – 01 l. Git, Source Control, GitHub
2. InstaUing Git, Create GitHub Repository
3. Git I nit, git Add, Git Commit
4. Set Origin, Git Push, Git Pull, Repo Overview
Learn About Version Controlling System – 02
I. Send Project Code to GitHub
2. Host Website in GitHub & Create the Project Live Link
3. Common GitHub Related Issues
4. Git Branch, Merge Branches
5. Git Pull, Toggle Branch, Merge Conflict
Leaming Bootstrap
1. Get Started with Bootstrap
2. Box-sizing
3. Breakpoints
4. Containers
5. Grid & Columns
6. Gutters
7. Z-index
8. Typography
9. Tables
Learning Bootstrap Forms
1. Form Control
2. Select
3. Checks & Radios
4. Input Group
5. Validation
6. Layout
7. Accordion
8. Alerts
9. Buttons
10. Button Group
11. Card
12. Carousel
13. Collapse
14. Dropdowns
15. List Group
16. Modal
17. Navbar
18. Navs & Tabs
19. Offcanvas
20. Tooltips
Learning Bootstrap Components
l. Navs & Tabs
2. Offcanvas
3. Tooltips
4. Backgrounds
5. Display
6. Flex
7. Float
8. Opacity
9. Overflow
10. Position
11. Shadows
12. Sizing
13. Spacing
14. Text
15. Vertical Align
16. Visibility
Tailwind CSS – 01
l. Introduction to Tailwind CSS
2. Tailwind Installation
3. Utility-First Approach
4. Responsive Variants – Tailwind Breakpoints
5. Hover, Focus & Other State Variants
6. Dark Mode Variant
Tailwind CSS – 02
l. Composing Utilities with @apply Directive
2. Tailwind @layer Directive – Understand Tailwind Layers
3. @responsive and @screen Directives
4. themeQ and screenQ – Tailwind Functions
5. Tailwind Configurations – Advanced Concepts
Tailwind CSS – 03
I. PostCSS Installation – Advanced Concepts
2. Just in Time – Advanced Concepts
3. Theme Configuration -Advanced Concepts
4. Extend Theme -Advanced Concepts
5. Extend Variants – Advanced Concepts
6. Tailwind CSS 3 Tutorial – Upgrade to Tailwind 3
Introduction to JavaScript
I. Getting Started with JavaScript
2. JS Variables & Constants
3. JS Console Log
4. JavaScript Data Types
5. JavaScript Operators
6. JavaScript Comments
7. JavaScript Type Conversions
8. JavaScript Control Flow
9. JavaScript Comparison and Logical Operators
10. JavaScript if-else Statement
I I . JavaScript for Loop
12. JavaScript while and do … while Loop
13. JavaScript break Statement
14. JavaScript continue Statement
15. JavaScript Switch Statement
16. JavaScript Functions
17. JavaScript Function and Function Expressions
18. JavaScript Variable Scope
19. JavaScript Objects
20. JavaScript Types
2 J . JavaScript Array
22. JavaScript String
23. JavaScript for … in Loop
24. JavaScript Exceptions & Modules
25. JavaScript throw Statement
26. JavaScript Modules
JavaScript ES6
1. JavaScript Arrow Function
2. JavaScript Default Parameters
3. JavaScript Template Literals
4. JavaScript Spread Operator
5. JavaScript Map
6. De-structuring Assignment
7. JavaScript for … of
8. JavaScript Asynchronous
9. JavaScript setTimeoutQ
10. JavaScript Cal!Back Function
11. JavaScript Promise
12. JavaScript async/await
Play with DOM
1. What is DOM
2. Analyze the DOM
3. Traversing DOM Elements
4. Traversing DOM Hierarchy
5. Manipulate the DOM
6. Listening to DOM Events
7. DOM Project
JS Miscellaneous
I. JavaScript JSON
2. JavaScript Date and Time
3. Iterators and lterables
4. JavaScript Generators
5. JavaScript Browser Debugging
React JS
1. What is React and How It Works
2. React Virtual DOM Explained – Easy Explanation
3. React ESLint, Formatting with Prettier, Editor & Project Setup
4. React Prerequisites
5. React JSX Element & Rendering Elements
6. React Components and Props Core Concept
7. React Context API
8. React State & Lifecycle in Class Component
9. React Render Props
10. What is Context API – Why Context API
11. How to Use React Context API
12. contextType & useContext Hook
13. React Hooks
14. What is React Hook – React Hook Introduction
15. React useEffect Hook
16. React useRef Hook
17. React Custom Hook
18. Styling React Components & React Router
19. Stylesheets, Inline Style & CSS Modules
20. React Styling – CSS in JS
21. React Router DOM Complete Guide
22. Router DOM v6 – Breaking Changes – React Router 6 vs 5
23. React Router v6 Private Route
24. State Management
25. React 18 New Features – What’s New in React
26. React Event Handling & Control Re-Rendering
27. React Conditional Rendering, List and Keys
28. Rendering React
29. React Form Handling – Controlled vs Uncontrolled Component
30. React Lifting State Up
31. Service Side Rendering
32. Testing React Project
33. Webpack
34. Unit Testing
35. Google Firebase
36. Fetch Data from API in React
37. React with Firebase
React Full Project – 01
1. Project Day I
React Full Project – 02
I . Project Day 2
Node.js-01
I. Node.js Introduction
2. How Node.js Works
3. Node.js Installation – VS Code Editor Setup
Node.js – 02
1. Node.js Server & Core Modules
2. A Node.js Application Analysis – Understanding Node.js
Express.js – 01
1. Expresst) Function
2. Application Object
3. Request Object
4. Response Object
Express.js – 02
1. Expressf) Function (Continued)
2. Application Object (Continued)
3. Request Object (Continued)
4. Response Object (Continued)
MongoDB -01
I. Introduction & Installation – SQL vs NoSQL
2. MongoDB Basic CRUD Commands
3. Mongoose CRUD Application with Express.js
MongoDB-02
I. Mongoose Instance Methods
2. Mongoose CRUD Application with Express.js
3. Authenticate with JSON Web Token (JWl) – Node.js Express.js
MERN Project Day – 01
l. Requirement Analysis
MERN Project Day – 02
I. Complete Project Setup
MERN Project Day – 03
l. User Management & Validation
CA-01
l. Branding, Linkedln, Remote Job Opportunity
CA-02
l. Portfolio, Payoneer
CA-03
I. Fiverr Account Creation
2. Fiverr TOS Discussion
CA -04
I. Upwork Account Creation
2. Bidding
3. Follow-Up
CA-05
I. Follow-Up
WHO WILL BENEFIT:
The course is designed to benefit a wide range of individuals seeking to thrive in the digital landscape. Potential beneficiaries include:
1. Aspiring Web Developers
2. Frontend Developers Seeking Full-Stack Skills
3. Students Pursuing Careers in Web Development
4. Professionals Looking to Expand Their Skill Set
5. Entrepreneurs Building Web-Based Startups
6. Anyone Interested in Mastering Modem Web Technologies
