YouTube Tools
Support

CodeWithHarry Sigma Web Development Course: study plan and how long it takes

The CodeWithHarry playlist is 139 videos and 56.5 hours long. Here's how long it takes at different paces, a week-by-week schedule built from the real videos, and a planner that turns it into your own daily plan.

139 videos · 56.5 hours · CodeWithHarry

The Sigma Web Development Course is CodeWithHarry's complete full-stack course in Hindi: how websites work, HTML, CSS with media queries and animations, JavaScript with async/await and the Fetch API, Node.js and Express, MongoDB, React and Next.js, with exercises throughout and projects like a Spotify clone and a URL shortener.

At over 130 videos it's a multi-month commitment, and planning it in phases helps a lot.

Who it's for: Beginners who want a single, complete web development course in Hindi from HTML to Next.js.

How long does it take?

The full playlist is 56.5 hours across 139 videos. Here's roughly how many days that is at different daily watch times and speeds, counting video time only:

Days to finish the playlist by daily watch time and playback speed
Daily timeAt 1xAt 1.5xAt 2x
30 min a day114 days76 days57 days
1 h a day57 days38 days29 days
2 h a day29 days19 days15 days

Make your own schedule

The playlist link is already filled in. Press Plan, set how much time you have each day and your speed, and you'll get a day-by-day schedule with a finish date and a calendar file. It reads the live playlist, so new videos are included.

Open on YouTube Track watched videos

Week-by-week schedule

A sample plan at 2 hours a day and normal speed, using whole videos so none is split across days. That's 5 weeks in total. For a different pace, start date or speed, use the planner above.

Week 1Videos 1–51 · 12h 20m

  1. Day 1 · 1h 49m

    • 1Installing VS Code & How Websites Work | Sigma Web Development Course - Tutorial #131m
    • 2Your First HTML Website | Sigma Web Development Course - Tutorial #229m
    • 3Basic Structure of an HTML Website | Sigma Web Development Course - Tutorial #311m
    • 4Heading, Paragraphs and Links | Sigma Web Development Course - Tutorial #420m
    • 5Image, Lists, and Tables in HTML | Sigma Web Development Course - Tutorial #518m

  2. Day 2 · 1h 56m

    • 6SEO and Core Web Vitals in HTML | Sigma Web Development Course - Tutorial #613m
    • 7Forms and input tags in HTML | Sigma Web Development Course - Tutorial #715m
    • 8Inline & Block Elements in HTML | Sigma Web Development Course - Tutorial #811m
    • 9Id & Classes in HTML | Sigma Web Development Course - Tutorial #911m
    • 10Video, Audio & Media in HTML | Sigma Web Development Course - Tutorial #1015m
    • 11Semantic Tags in HTML | Sigma Web Development Course - Tutorial #1111m
    • 12Exercise 1 - Pure HTML Media Player | Sigma Web Development Course - Tutorial #124m
    • 13Entities, Code tag and more on HTML | Sigma Web Development Course - Tutorial #139m
    • 14Introduction to CSS | Sigma Web Development Course - Tutorial #149m
    • 15Inline, Internal & External CSS | Sigma Web Development Course - Tutorial #1511m
    • 16Exercise 1 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #167m

  3. Day 3 · 1h 55m

    • 17CSS Selectors MasterClass | Sigma Web Development Course - Tutorial #1714m
    • 18CSS Box Model - Margin, Padding & Borders | Sigma Web Development Course - Tutorial #1818m
    • 19CSS Fonts, Text & Color Properties | Sigma Web Development Course - Tutorial #1932m
    • 20Exercise 2 - CSS Challenge | Sigma Web Development Course - Tutorial #204m
    • 21CSS Specificity & Cascade | Sigma Web Development Course - Tutorial #2120m
    • 22CSS Sizing Units - px, rem, em, vh, vw, % & more | Sigma Web Development Course - Tutorial #2226m

  4. Day 4 · 1h 49m

    • 23CSS Display Property | Sigma Web Development Course - Tutorial #2312m
    • 24CSS Shadows and Outlines | Sigma Web Development Course - Tutorial #2413m
    • 25Styling Lists using CSS | Sigma Web Development Course - Tutorial #2510m
    • 26CSS Overflow Property | Sigma Web Development Course - Tutorial #268m
    • 27Exercise 2 - Solutions and Shoutouts | Sigma Web Development Course - Tutorial #2710m
    • 28CSS Position Property | Sigma Web Development Course - Tutorial #2824m
    • 29Exercise 3 - Design this Card | Sigma Web Development Course - Tutorial #296m
    • 30CSS Variables | Sigma Web Development Course - Tutorial #3013m
    • 31CSS Media Queries | Sigma Web Development Course - Tutorial #3112m

  5. Day 5 · 1h 35m

    • 32Exercise 3 - Solution | Sigma Web Development Course - Tutorial #3220m
    • 33Exercise 4 - Multi Color Website | Sigma Web Development Course - Tutorial #333m
    • 34CSS Float & Clear | Sigma Web Development Course - Tutorial #3411m
    • 35More on CSS Selectors | Sigma Web Development Course - Tutorial #3513m
    • 36Exercise 4 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #3614m
    • 37CSS Exercise 5 - Design this Layout | Sigma Web Development Course - Tutorial #377m
    • 38CSS Flexbox - Ultimate MasterClass | Sigma Web Development Course - Tutorial #3828m

  6. Day 6 · 1h 42m

    • 39CSS Grid - Ultimate MasterClass | Sigma Web Development Course - Tutorial #3932m
    • 40Exercise 5 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #4016m
    • 41Exercise 6 - Navbar using Flexbox | Sigma Web Development Course - Tutorial #413m
    • 42CSS Transforms MasterClass | Sigma Web Development Course - Tutorial #4211m
    • 43Exercise 6 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #4320m
    • 44Exercise 7 - Design the Grid | Sigma Web Development Course - Tutorial #446m
    • 45CSS Transition Property | Sigma Web Development Course - Tutorial #4514m

  7. Day 7 · 1h 33m

    • 46CSS Animations | Sigma Web Development Course - Tutorial #4618m
    • 47Exercise 7 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #4739m
    • 48Exercise 8 - Bounce Animation | Sigma Web Development Course - Tutorial #485m
    • 49CSS Object-fit and Object-cover | Sigma Web Development Course - Tutorial #4915m
    • 50CSS Filters | Sigma Web Development Course - Tutorial #509m
    • 51Exercise 8: Solution & Shoutouts | Sigma Web Development Course - Tutorial #517m
Week 2Videos 52–83 · 10h 35m

  1. Day 8 · 27m

    • 52Figma Basics in One Video | Sigma Web Development Course - Tutorial #5227m

  2. Day 9 · 1h 57m

    • 53Netflix Clone Using HTML & CSS | Sigma Web Development Course - Tutorial #531h 57m

  3. Day 10 · 1h 57m

    • 54Introduction to JavaScript & Installing Node.js | Sigma Web Development Course - Tutorial #5420m
    • 55JavaScript Variables, Data Types & Objects | Sigma Web Development Course - Tutorial #5520m
    • 56JavaScript Conditionals: if, else if, else ladder | Sigma Web Development Course - Tutorial #5624m
    • 57JavaScript Loops | Sigma Web Development Course - Tutorial #5716m
    • 58JavaScript Functions | Sigma Web Development Course - Tutorial #5812m
    • 59Exercise 9 - Faulty Calculator | Sigma Web Development Course - Tutorial #596m
    • 60JavaScript Strings | Sigma Web Development Course - Tutorial #6018m

  4. Day 11 · 1h 58m

    • 61JavaScript Exercise 9 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #6111m
    • 62JavaScript Exercise 10 - Business Name Generator | Sigma Web Development Course - Tutorial #624m
    • 63JavaScript Arrays | Sigma Web Development Course - Tutorial #6331m
    • 64JavaScript Exercise 10 - Solution | Sigma Web Development Course - Tutorial #6411m
    • 65JavaScript Exercise 11 - Calculate the Factorial | Sigma Web Development Course - Tutorial #653m
    • 66Document Object Model in JavaScript | Sigma Web Development Course - Tutorial #669m
    • 67JavaScript DOM - Children, Parent & Sibling Nodes | Sigma Web Development Course - Tutorial #6719m
    • 68JavaScript - Selecting by Ids, Classes, and More | Sigma Web Development Course - Tutorial #6818m
    • 69JavaScript Exercise 11 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #6912m

  5. Day 12 · 1h 52m

    • 70JavaScript Exercise 12 - Color the Boxes | Sigma Web Development Course - Tutorial #704m
    • 71Inserting and Removing Elements using JavaScript | Sigma Web Development Course - Tutorial #7124m
    • 72JavaScript Exercise 12 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #7217m
    • 73JavaScript Exercise 13 - Dynamic Website Builder | Sigma Web Development Course - Tutorial #736m
    • 74Events, Event Bubbling, setInterval & setTimeout | Sigma Web Development Course - Tutorial #7428m
    • 75JavaScript Callbacks & Promises | Sigma Web Development Course - Tutorial #7532m

  6. Day 13 · 1h 47m

    • 76Async/Await & Fetch API in JavaScript with Examples | Sigma Web Development Course - Tutorial #7624m
    • 77JavaScript Exercise 13 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #7724m
    • 78JavaScript Exercise 14 - Hacker's Terminal | Sigma Web Development Course - Tutorial #784m
    • 79JavaScript try catch & Error Handling | Sigma Web Development Course - Tutorial #7916m
    • 80Classes & Objects - Object Oriented Programming in Js | Sigma Web Development Course - Tutorial #8021m
    • 81JavaScript Exercise 14 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #8119m

  7. Day 14 · 36m

    • 82Advanced JavaScript | Sigma Web Development Course - Tutorial #8214m
    • 83JavaScript Interview Questions | Sigma Web Development Course - Tutorial #8321m
Week 3Videos 84–111 · 16h 38m

  1. Day 15 · 5h 36m

    • 84Spotify Clone using HTML, CSS & JavaScript | Sigma Web Development Course - Tutorial #845h 36m

  2. Day 16 · 1h 41m

    • 85Backend, Node.js & npm | Sigma Web Development Course - Tutorial #8517m
    • 86CommonJs Vs EcmaScript Modules | Sigma Web Development Course - Tutorial #8618m
    • 87Working with Files: fs and path Modules | Sigma Web Development Course - Tutorial #8718m
    • 88Introduction to Express Js | Sigma Web Development Course - Tutorial #8821m
    • 89Response, Request and Routers in Express | Sigma Web Development Course - Tutorial #8928m

  3. Day 17 · 1h 45m

    • 90Middlewares in Express Js | Sigma Web Development Course - Tutorial #9019m
    • 91Exercise 15 - Clear the Clutter | Sigma Web Development Course - Tutorial #915m
    • 92ejs Template Engine in Express | Sigma Web Development Course - Tutorial #9221m
    • 93Exercise 15 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #9318m
    • 94Installing MongoDB & MongoDB Compass | Sigma Web Development Course - Tutorial #9425m
    • 95CRUD Operations in MongoDB | Sigma Web Development Course - Tutorial #9517m

  4. Day 18 · 1h 29m

    • 96Installing Mongoose & Using it with Express | Sigma Web Development Course - Tutorial #9623m
    • 97Exercise 16 - Dummy Data Generator | Sigma Web Development Course - Tutorial #976m
    • 98Tailwind CSS in one Video | Sigma Web Development Course - Tutorial #9834m
    • 99Exercise 16 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #9923m
    • 100Exercise 17 - Design This Layout | Sigma Web Development Course - Tutorial #1003m

  5. Day 19 · 2h 28m

    • 101X.com (Twitter) Clone using Tailwind CSS | Sigma Web Development Course - Tutorial #1012h 28m

  6. Day 20 · 1h 55m

    • 102Exercise 17 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #10212m
    • 103What is Hosting? Where to Host? Which Hosting? | Sigma Web Development Course - Tutorial #10338m
    • 104Hosting an Express App on Ubuntu VPS using Hostinger | Sigma Web Development Course - Tutorial #10424m
    • 105Introduction to React & Why use React? | Sigma Web Development Course - Tutorial #10541m

  7. Day 21 · 1h 44m

    • 106Components, Props and JSX in React | Sigma Web Development Course - Tutorial #10627m
    • 107Hooks & State in React | Sigma Web Development Course - Tutorial #10711m
    • 108The useEffect Hook in React | Sigma Web Development Course - Tutorial #10826m
    • 109The useRef Hook in React | Sigma Web Development Course - Tutorial #10915m
    • 110Conditional Rendering & Rendering Lists in React | Sigma Web Development Course - Tutorial #11019m
    • 111Exercise 18 - Display the Cards | Sigma Web Development Course - Tutorial #1116m
Week 4Videos 112–137 · 16h 31m

  1. Day 22 · 1h 52m

    • 112Handling Events in React | Sigma Web Development Course - Tutorial #11217m
    • 113Exercise 18 - Solution & Shoutouts | Sigma Web Development Course - Tutorial #11313m
    • 114TodoList App using React, Tailwind & React Icons | Sigma Web Development Course - Tutorial #1141h 22m

  2. Day 23 · 1h 53m

    • 115React Router: Routing in React | Sigma Web Development Course - Tutorial #11517m
    • 116The useContext hook in React | Sigma Web Development Course - Tutorial #11616m
    • 117The useMemo hook in React | Sigma Web Development Course - Tutorial #11715m
    • 118The useCallback hook in React | Sigma Web Development Course - Tutorial #11814m
    • 119Handling Forms + Connecting React to Express Backend | Sigma Web Development Course - Tutorial #11931m
    • 120Learn Redux in One video | Sigma Web Development Course - Tutorial #12020m

  3. Day 24 · 1h 52m

    • 121Introduction to Next.js & File based routing | Sigma Web Development Course - Tutorial #12112m
    • 122Server Components in Next.js | Sigma Web Development Course - Tutorial #12211m
    • 123Script, Link & Image components in Next.js | Sigma Web Development Course - Tutorial #12321m
    • 124Creating APIs in Next.js | Sigma Web Development Course - Tutorial #1248m
    • 125Server Actions in Next.js | Sigma Web Development Course - Tutorial #12513m
    • 126Middleware in Next.js | Sigma Web Development Course - Tutorial #12610m
    • 127Auth.js - Authentication in Next.js | Sigma Web Development Course - Tutorial #12714m
    • 128Dynamic Routes in Next.js | Sigma Web Development Course - Tutorial #12810m
    • 129Layouts in Next.js | Sigma Web Development Course - Tutorial #12913m

  4. Day 25 · 2h 28m

    • 130React Project: Password Manager using React, Tailwind, MongoDB & Express | Sigma WebD Tutorial #1302h 28m

  5. Day 26 · 4h 49m

    • 131Project GetMeAChai - Patreon Clone in Next.js | Sigma Web Development Course - Tutorial #1314h 49m

  6. Day 27 · 1h 43m

    • 132Understanding next/navigation module in Next.js | Sigma Web Development Course - Tutorial #13213m
    • 133SSR, SSG & ISR in Next.js | Sigma Web Development Course - Tutorial #13314m
    • 134Environment Variables in Next.js | Sigma Web Development Course - Tutorial #13411m
    • 135Styled JSX and other ways to Style in Next.js | Sigma Web Development Course - Tutorial #1359m
    • 136[Project] Let's Build a Url Shortener in Next.js 15 | Sigma Web Development Course - Tutorial #13656m

  7. Day 28 · 1h 54m

    • 137[Project] Let's Build a LinkTree Clone in Next.js 15 | Sigma Web Development Course - Tutorial #1371h 54m
Week 5Videos 138–139 · 27m

  1. Day 29 · 27m

    • 138Deploying our Next.js App to Vercel | Sigma Web Development Course - Tutorial #13819m
    • 139Concluding the Sigma Web Dev Course | Sigma Web Development Course - Tutorial #1398m

Tips for finishing

  • The Spotify clone (video 84) is a single video of over five hours. The planner gives it its own day, so plan to split it across sessions.
  • Do the numbered exercises before their solution videos; that's where the course turns into real skill.

Frequently asked questions

How long does it take to finish CodeWithHarry Sigma Web Development Course?

The playlist has 139 videos and 56.5 hours of content. At 1 hour a day that's about 57 days at normal speed, or 38 days at 1.5x. At 2 hours a day it's about 29 days.

More study plans

See all 166 study plans

Tools for any playlist