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