This Front-End Development course is designed to take participants from foundational web development concepts to advanced front-end frameworks and state management. Starting with HTML, CSS, JavaScript, and TypeScript, the course covers responsive design, asynchronous programming, and modern libraries like Bootstrap, JQuery, and SASS. Participants will then master React and Angular, including component design, routing, forms, HTTP requests, and state management with Redux. Practical projects such as a mini app and a full E-Commerce website reinforce learning and help participants build a professional portfolio ready for employment in the tech industry.
Course Overview
Course Syllabus
01 Module 1: Front-End Fundamentals
- HTML
- HTML5
- CSS
- CSS3
- Flexbox
- Grid
- JavaScript
- ES Next
- Asynchronous Programming
- JS Modules
- DOM & BOM
- TypeScript
- Regex
- Functional Programming
- AJAX
- JSON
- Bootstrap 5
- JQuery
- JQuery Plugins
- NPM
- SASS
- SEO Optimization
- Performance Optimization
- Hosting & Domains
- Figma
02 Module 2: React Path
- Introduction to React & SPA
- JSX & Virtual DOM
- Components & Props
- State & Lifecycle
- Event Handling
- Lists & Conditional Rendering
- Forms Handling
- HTTP Requests (Axios/Fetch)
- Routing (React Router)
- Styling in React (CSS Modules
- Inline Styles)
- React Projects: Mini App (To-do / Blog)
- Final Project: E-Commerce Website
03 Module 3: Angular Path + TypeScript
- Angular Overview: CLI Setup
- Architecture & Modules
- Components & Data Binding
- Directives & Pipes
- TypeScript Basics
- TypeScript OOP
- Angular Features: Forms
- HTTP Client
- Component Lifecycle
- Event Handling
- Lists & Conditional Rendering
- Routing & SPA
- Styling Angular Apps
04 Module 4: Redux
- What is Redux & Why
- Core Concepts: Store
- Actions
- Reducers
- Redux with React
- Redux Thunk & Async Actions
- Redux Toolkit Basics
- Redux – State Management
05 Module 5: Projects Summary
- Project 1: Portfolio or Blog
- Semi Project: React or Angular App
- Final Project: Full E-Commerce Website (Product listing
- Cart
- Filters
- API integration
- Routing)