React Dark Mode | Dark Mode Toggle With React and Styled Components

In this video I demonstrate how to build a dark mode toggle using react and styled components. Using the styled components theme provider we can easily pass around different css themes throughout the app and then toggle which theme we want to use rather easily.
Get 1 on 1 mentorship! ▶▶▶ www.codingwithchaim.dev/
Final code: github.com/coding-with-chaim/...

[@eugene9089]

This guy talks faster than the speed of light.

[@AbdelhameedG]

Yeah i usually put videos on 2x speed with this guy I go for 1.25 or 1.50 maximum :D

[@ajproductions7357]

Which is why he’s great at what he does

[@jonahg6564]

Waking up to your videos is even better!

[@rdrahuldhiman19]

Its first time that have to slow down a tutorial video...

[@shiffyfriedman7185]

Styled components really does make this easy! Thanks!

[@CodingWithChaim]

It really does!

[@nachmanfriedman7821]

that's a great point, styled components ftw! do you use styled components a lot in your projects?

[@ajproductions7357]

You’re a great teacher

[@matt6089]

you're so quick bro

[@rameezahsan7896]

thanks a lot man, i got this question in an interview tho

[@gaborvaszi3234]

Thank you for this one I will love you forever.

[@Fatima-ie5kj]

thankyou so much for making gr8 n useful content for us

[@CodingWithChaim]

You’re very welcome

[@Hydra-BR]

Thank you!

[@samuelvalentine7846]

If we had multiple components inside the app component, do we need to pass theme props to every child component?. Or can we reference the theme from our styled components like that?

[@lucaslkj4181]

you can use the recoil

[@ossamaelidrissi2624]

Salam , Thank you very much mr Chaim from Morroco

[@andreacappuccio58]

Would've loved taking a look @ how you'd implement theme setting presistence and avoiding of the infamous page reflesh flicker.

[@CodingWithChaim]

Very interesting question. I never tried this myself, but I do think that this is something that useLayoutEffect can solve.

[@Iallisios]

Much appreciated your videos mate 🙂. I would be grateful if you could do a few videos on recoiljs and in particular getting data from.the server and updating data with sockets, while maintaining performance and atomic isolation.of rendered components.
Thank you anyhow..

[@marinakim2929]

First! 😃👍🏼excited for this video

[@santiagoolayo25]

Thanks!!!

[@harshitv]

I had to double check if I had my RUclips playback speed set to 2x

[@tech.sharpii]

hey how can I add the SplashScreen file?

[@heggern4007]

instead of writing transition on each object can't you just write in CSS "*{transition: ease-in-out .5s}"? because, if I'm not mistaken the "*" is going to target every object if they haven't been given a specific transition? I'm still kinda new to coding so please someone respond:). BTW great video:)

[@9mza831]

Can you make this tutorial for NextJS ?

[@keytronbrown8727]

I did the exact same thing your ding and the transitioning affects of the button is not working.

[@luxgroove480]

how can i save this to local storage?

[@miguelangelchamorrofuentes9248]

and github code?? please

[@CodingWithChaim]

Will add to description today

[@CodingWithChaim]

Here is the code: github.com/coding-with-chaim/react-dark-mode

[@miguelangelchamorrofuentes9248]

@@CodingWithChaim thank you soo much !!

[@tariklancelot6748]

I wouldn't complain if you could speak a little slower for foreigners , please . In spite of this, very cool video . Thanks :)

[@mertgenc9890]

maybe u could be a better rapper than eminem

[@chombazm]

Auctioned.😂😂

[@hamidmohamadi2943]

Are you rapper ?

[@piggybank1385]

Салам модсенским

[@snowsol]

lol someone israeli in here im an israeli too