Dark Mode in Next JS 13 App Directory with TailwindCSS (for beginners) скачать в хорошем качестве

Dark Mode in Next JS 13 App Directory with TailwindCSS (for beginners)

Learn how to add dark mode to your Next.js 13 application that uses app directory. Using different themes with Next JS 13 application can easily be done with the next-themes package. In this video we will take a deep dive on how the theming works with Next.js 13 and Tailwind. In the first example we add next-themes without Tailwind and in second example we learn how to add theming that works with Tailwind classes. Integrify Academy - study and land a job in tech! A 4-month Full Stack program for developers based in Finland: https://bit.ly/3IReH4S A 5-month Data Science and Machine Learning program for developers based in Finland, Sweden, Denmark, Germany, and the Netherlands: https://bit.ly/45HeHxS Github repos from the video Example 1: https://github.com/tumetus/next-js-th... Example 2: https://github.com/tumetus/next-js-th... Support the channel (tips): https://bit.ly/3XTXNZu My courses: React basics: https://skl.sh/2XAKn7u HTML & CSS for beginners: https://skl.sh/34wvGUH Draft.js basics: https://skl.sh/3cJ5Hw4 💻 MY GEAR MY CODIGN LAPTOP: https://amzn.to/3MI90ci MY MOUSE: https://amzn.to/3mr3no9 MY KEYBOARD: https://amzn.to/3GIoMjh MY MICROPHONE: https://amzn.to/3KCDPfv MICROPHONE BOOSTER: https://amzn.to/43trLWB MY MICROPHONE ARM: https://amzn.to/3oaf5DW MY CAMERA: https://amzn.to/3UxyvyJ MY STREAMING LIGHT: https://amzn.to/3KE0PuE Connect with me: Website: https://tuomokankaanpaa.com My newsletter: https://tuomokankaanpaa.com/newsletter Twitter:   / tumee   Skillshare: https://www.skillshare.com/r/user/tume Timestamps (generated with https://www.chaptermarkerstotimestamp...) 00:00 What this video is about 00:25 Setting up the example project 01:48 Adding next-themes library 03:18 Solving client component error 06:08 How to boost your tech skills 07:07 Adding theme changer component 08:45 Solving hydration error 11:35 Adding theme specific css 13:47 Color-scheme css property 16:02 Dark mode with Tailwind CSS 17:29 Add next-themes & theme switcher 19:31 Configure ThemeProvider for Tailwind CSS 20:11 Adding Tailwind style classes 21:48 Configuring tailwind.config.js #nextjs #nextjstutorial #darkmode