Create Navbar In React JS & Tailwind CSS | Light & Dark Mode Navigation Bar Using React JS @upcoding
125 بار بازدید -
3 ماه پیش
-
How To Make Navbar Using
How To Make Navbar Using React and Tailwind CSS With Light And Dark Mode Step by Step
Subscribe - shorturl.at/bisY3
Instagram - www.instagram.com/_upcoding/
Facebook - shorturl.at/BDX18
In this video tutorial we will make a website Navigation bar in React JS and Tailwind CSS.
In this Navbar tutorial we will add website logo, search input box, menu navigation links, and a icon to switch the website from dark mode to light mode and light mode to dark mode.
In this react JS beginners project tutorial we will also use the local storage of web browser to store the user preference of light mode and dark mode.
if your switch to dark mode and close the website, then again open the website then website will be in dark mode.
Timestamps:
00:00 Navbar Demo
00:42 Create new React JS app
01:09 Installing Tailwind CSS
03:52 Create Component Navbar
05:18 Styling Navbar Component
15:40 Applying Light & Dark Mode
25:01 Adding Local Storage for theme
28:19 Final Demo
Keywords:
upcoding
upcoding react projects for begginers
upcoding html and css projects
navigation bar in react js tailwind css
Music Credit:
Song: Sappheiros - Dawn
License: Creative Commons (CC BY 3.0) creativecommons.org/licenses/by/3.0
open.spotify.com/artist/5ZVHXQZAIn9WJXvy6qn9K0
Music powered by BreakingCopyright: breakingcopyright.com/
"Sappheiros - Dawn" is under a Creative Commons (BY 3.0) license:
creativecommons.org/licenses/...
open.spotify.com/artist/5ZVHX...
Music powered by BreakingCopyright: • 🛀 Calm Music (No Copyright) "Dawn" b...
3 ماه پیش
در تاریخ 1403/03/18 منتشر شده
است.
125
بـار بازدید شده