Build and Deploy Navbar Dropdown Navigation with Tailwind CSS and Next.js #reactjs #nextjs

#reactjs #nextjs #tailwindcss #typescript #nextjs13 #reactwithutkarsh #frontendmentor #frontenddeveloper #responsive #landingpage s #darkmode #props #usestate #dashboard #challange

Resource's

Other Video's

Social Details

Timestamps
0:00 - 0:47: Intro & Project Overview
1:26 - 3:57: Initial Project Setup
3:57 - 6:01: Creating Navbar & Styling
6:01 - 14:06: Building Navbar Sections
14:06 - 24:15: Dynamic Data for Navigation
26:27 - 28:04: Tailwind Debug Screens
30:00 - 33:03: Mobile Navigation Logic
39:49 - 46:17: Responsive Hero Section Design
46:17 - 48:04: Deployment to Vercel

[vijayshankarcrypto]

Bro, it's a very nice tutorial. Please publish more tutorials like this. My Friends are also following your channel. Thank you everything. One of the best youtuber's on building small projects like this with clear explanation of all the tailwind classes and how it works after applying it.

[vineetsingh]

Bhai ekdam shandar samjhaya hai jo bhi doubts or cunfusion ata hai khud se banata time wo sab next sec hi tumaa samjhaya diya.
amazing bro

[fjyspwr]

Thank you so much sir this video very helpful for me 😍😍😍😍😍😍

[gruscxs]

Amazing ! Thank you for this wonderful Tutorial, but any idea where the hydration error is coming from or how to fix it ?

[JulsL-de]

how will the links and sublinks functional?

[danamaraqa]

If I dont download Typescript and Enlist, would it affect the steps i'll follow when I download the project?

[alenamitrofanova]

hello, thanks for the video. I want to try repeat but can't open localhost terminal says npm ERR! Missing script: "dev". I went to package json is there in script: "dev": "next dev". Is it correct? Or I need to change it?

[shireenkhan]

where did you download those tiny icons of todo list, calender and all ?

[technicalrider]

I don't know next js abhi to sirf react basic sikh rhe hai😂

[mikol]

In next 14 I have errors:app-index.js:35 Warning: Expected server HTML to contain a matching <div> in <a>.
at div
at a
at LinkComponent
at div
at section
at div
at Navbar
at div
at InnerLayoutRouter
at RedirectErrorBoundary
at RedirectBoundary
at NotFoundErrorBoundary
at NotFoundBoundary
at LoadingBoundary
at ErrorBoundary
at InnerScrollAndFocusHandler
at ScrollAndFocusHandler
at RenderFromTemplateContext
at OuterLayoutRouter
at body
at html
at RedirectErrorBoundary
at RedirectBoundary
at NotFoundErrorBoundary
at NotFoundBoundary
at DevRootNotFoundBoundary
at ReactDevOverlay
at HotReload
at Router
at ErrorBoundaryHandler
at ErrorBoundary
at AppRouter
at ServerRoot
at RSCComponent
at Root
window.console.error @ app-index.js:35
Show 1 more frame
Show less
react-dom.development.js:6534 Uncaught Error: Hydration failed because the initial UI does not match what was rendered on the server.
at throwOnHydrationMismatch
at
at updateHostComponent$1
at beginWork$1
at
at
at invokeGuardedCallback
at beginWork
at performUnitOfWork
at workLoopConcurrent
at renderRootConcurrent
at performConcurrentWorkOnRoot
at workLoop
at flushWork
at
Do you knwo how I can fix it?

[JulsL-de]

how will the links and sublinks functional?