Dark Mode in Next.js and Tailwind CSS

Published: 12 April 2022
on channel: Cand Dev
11,555
252

Adding dark mode toggle in next.js and tailwind css with next-themes package.

👨‍💻Code:
https://github.com/candraKriswinarto/...

🔗Link:
Next js: https://nextjs.org/docs/getting-started
TailwindCSS: https://tailwindcss.com/docs/guides/n...
Next-Themes: https://github.com/pacocoursey/next-t...
HeroIcons: https://heroicons.com/

🌎Live:
https://next-tailwind-theme.vercel.app/

Timestamps:
0:00 - Intro
00:10 - Demo
02:21 - Setup Next Js
02:48 - Install & Setup tailwind css
04:26 - Sections folder
05:14 - Layout Component
09:19 - Header Component
14:23 - Hero Component
16:23 - Button Component
18:46 - Footer Component
20:27 - Toggle button
21:46 - Install next-themes package
31:44 - About page
32:44 - 404 page
32:29 - Done

👋🏻Contact Me:
https://canddev.vercel.app/

🌎 Find Me Here:
Instagram :   / candra_kriswinarto  
GitHub: https://github.com/candraKriswinarto/
Linkedin:   / candra-kriswinarto  

#darkMode #next.js #tailwind #enjoyCoding


Watch video Dark Mode in Next.js and Tailwind CSS online without registration, duration hours minute second in high quality. This video was added by user Cand Dev 12 April 2022, don't forget to share it with your friends and acquaintances, it has been viewed on our site 11,555 once and liked it 252 people.