লাইফটাইম অ্যাক্সেস, Mentor Support Included!

Complete Modern Front-end Development Course

Master HTML, CSS, JS, Tailwind, React.js & Next.js by Building Real-World Projects and Unlock Job-Ready Skills with This Course.

Duration (Hours) 54+

Lectures 232

Projects 11+

Why This Front-End Web Development Course?

Web-development strong foundation

Complete ecommerce project

Live support session

Certficate of completion

Front-end Course Complete Curriculum

Module 1: Welcome & Environment Setup

Module 2: HTML5 Fundamentals

Lecture 4: HTML List: list tags (ol, ul, li), line break, button and inline vs block

Lecture 5: HTML Link: Creating Links with the Anchor Tag and Display Online Image, Local Image

Lecture 6: HTML Form: Input Types, Buttons, Select, Option, Login Form

Lecture 7: HTML Table Table, tr, th, td, caption, colspan, thead, tbody, tfoot

Lecture 8: HTML Structure: Doctype, Html, Head, Meta, Title, Body

Lecture 9: HTML5 vs HTML, Audio, Video, YouTube Video, Embed Iframe

Module 3: CSS3 Fundamentals

Lecture 2: CSS Selectors (basic): Id, Class, Universal, Tags, Grouping, Attribute, Id vs Class

Lecture 3: CSS Box Model Border, Font Size, Background Color, Text Color, Border-Radius, Margin, Padding

Lecture 4: CSS External Setup, Display None, Hidden, Inline, Block, Inline-Block, Box-Shadow

Lecture 5: CSS Background Color, Image, Repeat, Position, Size, Relative Image Path

Lecture 6: CSS Basic Flex Properties

Lecture 7: CSS Basic Grid Properties

Lecture 8: CSS Position Static Relative Absolute Fixed Sticky

Lecture 9: Start HTML CSS Portfolio Project Setup Image File and Introduction Font Awesome

Lecture 10: Project Navbar Design and Added Font from Google Font

Lecture 11: Project Banner Section Start, CSS Nested Class and Add Banner Image from Folder

Lecture 12: Project Banner Section Completed properly and Introduce Media to Responsive the Website

Lecture 13: Project Navbar, Banner responsive for Mobile Device and Start with About Section

Lecture 14: Project About Section Completed and Start Skill Section

Lecture 15: Project Skill Section Complete and Responsive Mobile Device

Lecture 16: Project Footer Section Start and Design Input, Text Area

Lecture 17: Finished Project Footer Section Complete and Share Idea How Practice New Design

Module 4: Modern JavaScript Fundamentals (ES6+)

Lecture 3: JavaScript String, Array, Object

Lecture 4: JavaScript Funcation, Arrow Funcation and Template Literals

Lecture 5: JavaScript Conditional Statements if, else if, else, Switch, Ternary Operator

Lecture 6: JavaScript for loop, while loop, do while loop, for in loop, for of loop

Lecture 7: JavaScript Array Method Map, Filter, Reduce, Sort

Lecture 8: JavaScript Destructuring, Rest and Spread Operators

Lecture 9: JavaScript Basic String and Array Problems

Lecture 10: Introduce JavaScript Document Object ModelDOM

Lecture 11: JavaScript Synchronous and Asynchronous Promise, async await Concept

Module 5: HTML, CSS, JavaScript API Project

Lecture 1: JavaScript Project BETTER TUB setup and navbar all category fetch from API

Lecture 2: JavaScript Project Navbar Design and Fetch All Video Info

Lecture 3: JavaScript Project Manually Design a Card

Lecture 4: JavaScript Project All Video Card Design and Show as a Grid Layout

Lecture 5: JavaScript Project Start based on Category data

Lecture 6: JavaScript Project Explain Again based on Category Data Show

Lecture 7: JavaScript Project Responsive for Mobile Screen and Develop in Netlify

Lecture 8: JavaScript Project Introduce Tailwind DaisyUI Navbar Components and Design Professional Navbar

Module 6: React Basics – Components, Props & JSX

Lecture 3: Exploring the Official React Documentation

Lecture 4: Setting up Development server Options

Lecture 5: Installations & Project Setup

Lecture 6: Introduction to React App Structure (my-react-app)

Lecture 7: Creating a New Component (Part 1)

Lecture 8: Creating a New Component (Part 2)

Lecture 9: Creating a New Component (Part 3)

Lecture 10: Understanding Component Structure (Part 1)

Lecture 11: Understanding Component Structure (Part 2)

Lecture 12: Working with Props (Part 1)

Lecture 13: Working with Props (Part 2)

Lecture 14: Conditional Rendering in React (Part 1)

Lecture 15: Conditional Rendering in React (Part 2)

Lecture 16: Rendering Lists and Arrays

Lecture 17: Rendering Arrays of Objects (Part 1)

Lecture 18: Rendering Arrays of Objects (Part 2)

Module 7: React Fundamentals – Interactivity, State & Events

Lecture 1: Module Overview

Lecture 2: Create React App Setup

Lecture 3: Building Interactive Components (Part 1)

Lecture 4: Building Interactive Components (Part 2)

Lecture 5: Handling Events in React

Lecture 6: What is State in React?