Dark Mode in Next.js and Tailwind CSS

Опубликовано: 13 Ноябрь 2024
на канале: 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