Tailwind CSS Tutorial #1 - Intro & Setup

grate and helpful content, thanks my friend 👍

Anyone in 2024

For anyone struggling: Because tailwind has had major updates since this series released, some things are outdated. In order to fix this, you must install the "PostCSS Language Support" extension in your VSCode, install "Tailwind CSS IntelliSense," and remove any other CSS intellisense related extensions. Refer to tailwind-docs-editor-config for a restatement of this all. In tandem, to my beginner knowledge Tailwind no longer dynamically updates your page upon a reload of live-server *add the --watch flag (two hyphens) to the end of your build-css script, not sure if I missed that.*, and requires that you run the build-css script when you want to visualize your changes each time. You must also specify the location of HTML and JS files in the config, keeping in mind that episode 5 will give you a headache until you create the new custom config file after generating the --full config.

My @tailwind base component and utilities styles bring up problems "Unknown at rule @tailwind" anyone know why?

When I try to put the directives in my CSS, I get an this problem "Unknown at rule @tailwind css(unknonwAtRules)", however, I'm using the latest version v3.3.3, and I put those directives: @tailwind base; @tailwind components; @tailwind utilities;
When I tried to use "text-color" nothing changed to the HTML file
please can anybody help me!?. Thank you!

Please I hope this course is not outdated. I am about to learn it now

Hi, , Shaun , I am a backend person with basic CSS knowledge and javascript, can I learn Tailwind directly? should I learn bootstrap? what's the relationship between Tailwind and bootstrap? Do you have any suggestion which CSS framework I should dive into first? Which one can I master as soon as possible? maybe learn responsive design later on .Thanks a lot. I am waiting for your reply

what i hate the most about all those frameworks is that they change so much and so fast
nothing of shown works the same anymore! and there are no more good courses online
for starters it is so hard to get to know it all...

Anyone taken this course recently? Outdated or still relevant ?

Great start, will finish it in 2 weeks or so, watching it while on the way

Setup does NoT work in 2023…

npm ERR! Missing script: "build-css"
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run build-css
i am facing issue

is this tutorial still okay to watch now after three years

I didn't get what you said in the introduction. npm init what?

I didn't recommend this video for someone who's starting, this tutorial is too outdated, you should look for tutorial around 2022

Hello I want to switch from Bootstrap 4 to Tailwind CSS, will this course still be relevant or close to still being used from the latest on the website? Thank you so much!

Good day Shaun
I’m using the tailwind crash code videos and I’m stucked at the build css part. It keeps throwing this warning , “No utility classes were detected in your source files”
What do I do?

noice😁

Just awesome, thanks a lot to everybody who is involved in keeping this channel alive. Simply amazing !!!

Awesome

Wow, I must admit I have a really bad habit of jumping from course to course a lot without really high percentages of completion on a never ending search for the greatest resources, now this channel is just a true gem. The pace is perfect and the explanations are very thorough and clear. I am data scientist who recently decided its time to learn some frontend stuff so i can truly build full stack end to end applications. I had some js experience 5 years ago maybe and wanted to learn a modern stack: nextjs + typescript + react + tailwindcss. This channel has been a freakin blessing. I brushed up on the main js syntax over at freecodecamp and then jumped directly into ninjas react course, finished it over the weekend (yes its really that could and still a great primer on react although 2 years old) and now watched the whole tailwindcss in 2 days as well, already feeling super ready to tackle the first project (i recommend to take a minor detour in the middle and follow the older flexbox tutorial as well when you have no prior css knowledge like me, totally worth it!)
SO next up I guess is building the first project with react + tailwindcss and then learning about typescript (also a playlist by Ninja available <3) and converting the project from js to ts. Then last step gonna be learning about nextjs and embedding the project in it.
Thank you Ninja <3<3<3

How do i fix this? "Also define the standard property 'appearance' for compatibility. " styling doesn't seem to be reflecting on my pages too.

❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤

by far your tutorial is what i have been searching for since morning 🥰🥰

Beautiful! Explication are very good! I like you.

11.42 "Running tailwindcss without -i, please provide an input file." This error is displaying while doing this. Please help me out with a solution anyone ? Thank in advance.

Hi Ninja, thank you for this highly informative and perfect step-by-step setup tutorial. Honestly, I've watched at least 10 different setup tutorials, but none clicked until I checked yours. Precise and clear explanation. Thanks again!

Great intro to Tailwind CSS. Thanks, Shaun.

{2023-03-11}

Are you kidding me? I loved it!

Anyone in 2023?

Just subscribed

Command Prompt? Unsubscribe. Dislike.

please add animation of text

thank you ninja

Good day, i did the npm run build-css, its not creating a new css file in the public folder ???Any help!!!

maybe it's me? Falling at the first hurdle. I get an error saying "tailwindcss: command not found" maybe it's been updated?

Can I get someone to help me out?, Followed all the process

Hello, my tailwind isn't working

In the tailwind config file, can I add “build-css”: “npx tailwindcss -i .src/style.css -o public/style.css” because it’s what i learnt in the documentation and other tutorials I’ve watched

we love this ninja man

is the "Unknown rule" warning under @tailwind in the style.css a bad thing? will it affect how i carry on with the tutorial? i've restarted twice now and it's still there

I have been racking my brain trying to understand tailwinds responsive classes.
Thanks to you and your teaching style I have a better grasp with it now. I appreciate your contribution to the dev community and I'm happy you take the time to make us all better at what we do. 🙏

Great content 👍
📍But I am unable to run build-css .
It is showing warning as no utility classes were detected in your source file.and getting errors of compatibility in styles.css public file.what should I do?

Why would you theme white your tutorial, Sir? Protect our eyes!

Hey thanks for the great video. I was wondering if customizing tailwind css preset classes would be simple if I were to use CDN to install tailwindcss?

Keeps saying "The terminal process failed to launch: Starting directory (cwd)" when opening terminal. Even though I've created a folders which I'm wanting to go on in terminal.