How to use Tailwind CSS in React with Vite | Install TailwindCSS in React with ViteJS for Beginners

In this video, I will show you how to install Tailwind CSS in a React with Vite project. This is a step-by-step tutorial for beginners.
★★★ More Related Videos★★★
How to create a React project with Vite - • Create React Project w...
★★★ Follow Me ★★★
Facebook Fanpage: / devtamin
KZbin: / devtamin
Medium: / devtamin
My website: www.devtamin.com/

[@_isosa_]

Useful and straight to the point!! Thanks a lot, subscribed!

[@Devtamin]

Thx

[@BosseM-er5wf]

Just the video i was looking for. Great job

[@Devtamin]

Awesome, thank you!

[@wailazzo4909]

THANK U BRO GOOD LUCK IN UR LIFE

[@lukasknap1679]

Thanks for this video! Very useful.

[@2brosmemes449]

Thanks i got your video helpful! 😊

[@anime_gen875]

thank you for making it so simple bro it helped a lot

[@okkaraung9512]

appreciate it. short to teh point explanation. keep up the good work brother.

[@Devtamin]

Thank you for a comment

[@varunupadhyay2488]

very useful..straight to the point

[@Devtamin]

Thank you for a comment

[@deepakchhantyal7569]

thank you , very useful

[@aakashsaini7352]

Thanks. Really helpful.

[@Devtamin]

Glad it was helpful!

[@sandyrose77]

Thank you man❤️✨

[@tinanguyen1072]

This helped a lot thank you!

[@Devtamin]

Glad to hear!

[@sivasankarmutyala1077]

Very Useful, thanks a lot🤗🤗

[@Devtamin]

You're welcome 😊

[@mareq_111]

Thanks for helpful video 🔥

[@Devtamin]

No problem 👍

[@patrickm5656]

Thanks for the help!

[@Devtamin]

Happy to help!

[@muhammadtayyab6077]

Nice Bro! very helpful video

[@Devtamin]

Glad you liked it

[@marislaradev]

Thanks! It helps me a lot ❤

[@Devtamin]

I'm glad!

[@tishycs8187]

Thank you so much for this video

[@Devtamin]

Most welcome 😊

[@truuta9168]

it worked, thank you!

[@Devtamin]

You're welcome!

[@quvomiddinkamalov3292]

Thank you!

[@Devtamin]

Welcome!

[@ingridoliveira1065]

very good, thanks : )

[@Devtamin]

Glad you liked it!

[@shankargurung1335]

really awesome thanks a lot bro

[@Devtamin]

Always welcome

[@nipunjayasinghe1880]

Thanks bro!

[@Devtamin]

No problem!

[@Awakened_Pot]

Thanks mate!

[@Devtamin]

Glad it helped

[@Gilbert-hk8ho]

i have tried but the styles doesn't reflect on my vite app

[@vohncena]

What is your vs code theme i really want this one

[@mctribals]

Gracias buen video...

[@Devtamin]

You're welcome

[@shinthantkaung]

Thanks bud!

[@Devtamin]

No problem!

[@melissachavana1222]

thank you!

[@Devtamin]

Welcome!

[@giorgikiladze1151]

thank you

[@Devtamin]

You're welcome

[@user-fl5yo6yx5v]

ty

[@azonsongdigital]

What I want to know is after run it for the first time usin' ```npm run div``` how can it again once I close my terminal... Because of i use nom run dive again the page comes out blank, the server runs but all my work just disappears... Any help? Anyone?

[@franogugic654]

THANKKKK YOUUUU MANNNNNNNNNNNNNNNNNNN

[@Devtamin]

you're welcome

[@pebblesmoker565]

for some reason am only getting tailwindcss.config.js and not getting postcss.config file can someone say why???

[@simohamedlaarmani6789]

You end up with a lot of css properties. Hoq can you sort them sfter in a react app using prettier-plugin ?

[@arnab_d9]

thanks ❤

[@Devtamin]

You're welcome 😊

[@Judd2000]

Thank you, I was not following the Vite specific framework guide.

[@Devtamin]

Glad it was helpful!

[@omomaighawosa570]

Please what tailwind vscode extension are you using ? Great video btw

[@rishabh2k01]

tailwind intelligents

[@Devtamin]

thank you for a comment

[@ryostyles9904]

Thanks, so the postcssconfig file was missing and that's the reason it wasn't working. I had installed only tailwindcss. Thanks for the help.

[@Devtamin]

Glad I could help

[@Saske443]

Thanks Champ

[@Devtamin]

You're welcome

[@aryanmaskey9147]

i already have extension installed but i need to hit ctrl+space for suggestions. isnt there a solution for this?

[@stellaeneh8357]

Co-ask

[@ahmadbasyouni9173]

what theme do u use on vscode?

[@Devtamin]

Material Icon Theme

[@diwakardayal954]

thanks

[@Devtamin]

You're welcome!

[@7days280]

thankyoiu

[@Devtamin]

You’re welcome

[@raffph]

why my tailwind cant show the recommend style example when i type text-green-100 the 100 cant show the option

[@LOLUMAAAD]

Was wondering this myself but found the solution and was to download extension in VSC called "Tailwind CSS IntelliSense"

[@Devtamin]

Let's install this extension Tailwind CSS IntelliSense. If it doesn't show any recommends, that means tailwind has been implemented improperly

[@onlineviral7518]

My vite app is not working with tailwind css what should i do

[@Devtamin]

Which JavaScript frameworks are you using?

[@ilyamiller4131]

Spent hours at work figuring out why my tailwind keeps getting ignored in vite… I feel like such an idiot now. Thanks a lot for the helpful video!

[@Devtamin]

You're welcome

[@ablecj4481]

I have done it in the same way as you shown but my tailwind css is not applying

[@darrenhutchinson8018]

you might have missed saving the app.jsx file

[@fintech-rh8de]

same problem with me. i didn't miss any thing.my autosved enabled.

[@yousub6220]

I think, you should restart the project once, stop the localhost server and run again, just type ctrl + c and then npm run dev

[@brooklyninja]

@@yousub6220 This worked for me lmao, thank you

[@theycallmejatin]

Let's forget about tailwind for a sec , default css is showing black screen & white text in react app How to make it normal like any web page

[@Devtamin]

Sorry about that. Did you install react properly? Check this out kzbin.info/www/bejne/bqfLZpejd8aJh9k

[@theycallmejatin]

@@Devtamin i made both the default css files empty and it was enough to solve problem

[@redeemasuquo]

Hi, av been encountering this problem 'the content option in your Tailwind CSS configuration is missing or empty, configure your content sources or your generated CSS will be missing styles. Can anyone help me?

[@69_anonymous._]

Same. Have you found the solution? If so pls help me

[@redeemasuquo]

@@69_anonymous._ nope, I haven't found d solution

[@ACEmmanuel]

This is because the so-called file you copied and pasted from the Tailwind site is not present in your React project. I mean the file name

[@redeemasuquo]

@@ACEmmanuel how do I resolve d error

[@ACEmmanuel]

@@redeemasuquo are you using vite for this?

[@quotespower9911]

Not working

[@ramunasgirdziusas9636]

Need to add tailwindcss() to vite.config.js which is not shown in vite's homepage!

[@FalcoAMV]

didnt worked

[@truewisdom1123]

thank you

[@Devtamin]

You're welcome

[@abjeetsingh207]

thank you

[@Devtamin]

Not a big deal