Tailwind CSS Crash Course
Vložit
- čas přidán 2. 06. 2024
- Updated 2022 Crash Course - • Tailwind Crash Course ...
In this video we will look at the TailwindCSS utility framework including what it is, setup and creating custom components with utilities
Code:
codepen.io/bradtraversy/pen/J...
Sponsor: DevMountain Bootcamp
goo.gl/6q0dEa
Docs:
tailwindcss.com
Mac Install:
docs.mongodb.com/manual/tutor...
💖 Become a Patron: Show support & get perks!
/ traversymedia
Udemy Courses:
www.traversymedia.com
Follow Traversy Media:
/ traversymedia
/ traversymedia
/ traversymedia - Věda a technologie
Brad Traversy + Bucky Roberts +Gary Simons + Net ninja + Academind +Mosh Hamedani == *No need of college/universities*
Kindly mention other's channel name bro. Thanks
@haris bashir thank you bro
Bucky Roberts stopped posting new videos...Do you know why??
@@ferozahmad4988 yes because now he is full time software engineer in a reputed software house. This software house stop him to post their videos because its against their rules and regulations.But I think its not the real matter .I think some big names like udemy , coursera , edx etc stop bucky because bucky free courses are much much better than their paid courses😥
Don't forget Derek Banas also
I started learning tailwind css just today. And here it is. Thanks, Brad. I've learned a lot from you.
I swear, these last few videos you’ve been reading my mind. “I need a good crash course on this”. Hey, look, a crash course a day later! Keep it up man!
Man, I learned something new for every lesson I watch on your channel. thanks, Brad.
This Framework is amazing, I think to learn more about it.
Dude, I've been wanting to create something exactly like this in the past. I actually really needed something like tailwind. Great video, Brad!
FINALLY someone who shows how to not have 20 classes attached to the flippen div, I was about to give up on tailwind because those classes all inline looks messy to me.
Another great free video. Makes being a patron entirely worthwhile.
IT IS JUST PHENOMINAL: WHATEVER I SEARCH FOR, BRAD, BRAD, BRAD AND BRAD HAS ALWAYS GOT ME COVERED !!
I swear you have a crash course for everything. You are truly a blessing to people looking to learn web development.
Started working with Tailwind today and absolutely loved it! Although there are just too many classes; it felt overwhelming. You do a great job highlighting the important parts. Kudos!
Thank you Brad for all your great content. Working through all your courses on Udemy. You push out great regular content on CZcams, hence me searching for you on Udemy. Extremely appreciated by all your loyal fanbase.
Finally! I've been waiting forever for this tutorial~ thanks Brad
I was looking for this and you just delivered this in time. Thank you. You are the best.
Thanks a lot Brad, I learned a lot from your videos.. I am from Afghanistan and your free videos helped me a lot to learn web design and also the path way to be a developer.. Know I am learning front end development..
I needed a quick rundown of Tailwind. This was just what I needed. Thank you!
13:52 "...and never mind these errors, it's just that VSCode doesn't know what the hell's going on..." 😂😂😂😂😂love it
I've been kind of out of the loop with web dev stuff for almost a decade now. I've been wanting to get back into it, but I find it daunting how much stuff has changed and all the new stuff. After messing around with tailwind, I am actually excited to get back into this as opposed to overwhelmed. At least when it comes to the front-end stuff. Still gotta figure out what's the cool way of doing the backend.
This is a nice guide to getting going on tailwind. Thanks.
I love tailwind css. It's also great for tweaking in the browser inspection tool just throwing in different classes until your 100% satisfied. Also for production when you add purge css it will give you a super lean css file > 10kb 🙌
Thanks Brad for this video! I was just going to dive into using Tailwind CSS for a project and you've made it easier for me to learn it!
You look like Brad
@@wobsoriano yes XD
@@wobsoriano lol
@@wobsoriano Lol HAHAHAHAHHA
First time I saw one of your videos and it's great. Took the mystery out of tailwind. I knew tailwind is one of the best choices, but now I understand WHY tailwind is one of the best choices (especially if you are working solo and not on a team). Thanks for this Tut, and I will be watching and liking more of your stuff. Thanks
Exactly what I was looking for. A quick demo of setup and use of Tailwind CSS. Thank you.
Sweet! Basically once that you have HTML & CSS covered, the frameworks are easier to understand! Thank you Brad :)
Hey! Just wanted to let everyone know that the build:css command line script he provides here is out of date. You need to use:
*tailwind build -i src/style.css -o dist/style.css*
Of course changing the paths to your source/distribution stylesheets respectively. If you use the one given here, Tailwind will use a blank style.css that *won't include your changes* (such as at 13:00) where he explains @apply directives.
Stay woke!!
I was looking for this for whole day. Thanks a lot, mate.
thank you so much !
I LOVE YOU
an update to this! i had to use npx tailwindcss build -i src/style.css -o dist/style.css
@@mikez3307 helped me so much for my work, tnq!
Ive been coding three months, and this is seriously the coolest thing I’ve seen yet!!! Seriously, im mad i’m just now deciding to learn Tailwind
I have heard alot about tailwind CSS and this really gives an awesome idea of how it works...
Great timing, thank you for the video! I didn't know this framework exists until I saw your video but it is exactly what I need for my project. Never liked the opinionated approach of Bootstrap although I started using it for prototyping lately.
Awesome crash course, Brad. Definitely using this in my next project.
Thank you so much for explaining Tailwind CSS in such a simple and beautiful way.😇
Thanks for the video. I've been meaning to read up on Tailwind. This was exactly what I needed.
Always the best timing! Love this Brad, really appreciate your works!
When I was about to learn bootstrap, I thought it was exactly what tailwind is where you can type whatever in the class and it dynamically change. I was very disappointing to learn it didn't do that. I've been watching tailwind development on twitter and finally am learning it now. This looks amazing
A great intro and also a refresher. Thanks for another enjoyable course!!
The first 5 minutes was so smooth I take it all in without stress! 💯🥰🇵🇭
Haven't heard a lot about Tailwind, but it looks like something to think about. Thanks Brad
One of my dreams is meet you in the real life. MY_BEST_TEACHER. Thank you Brad
Great tutorial, thanks Brad for your contribution to the web dev community.
A gist of Tailwind in such a simpler way. Loved it.
Amazing tailwind css tutorial helped me a lot, simple and clean explanation !
There is power of understanding in your voice. many thanks
Thank you so much Brad. An incredibly well explained video. Absolutely amazing. Very grateful. Thank you !
thanks brad, cant wait to build my first navbaaah with tailwind
been patiently waiting for this Crash Course
Great stuff as usual, Brad! Thanks!
Excellent as always. Thanks Brad 👍
Thanks for the tutorial Brad, I learned a lot! A lot of people swear by Tailwind, but I don't see any real benefit over pure CSS or Styled Components.
Thanks, Brad! Very convincing. We will use TailwindCSS for our upcoming project.
Excellent introduction to Tailwind CSS. Thanks.
I follow a lot of web devs / academies channels, you are the best by far. Keep going in your way. Thanks you dude!
Thanks a lot, man. I've been meaning to take a look at tailwind for a while, but all the tutorial I'd come across so far was either too beginner level or too unclear, like they put stuff there and didn't explain anything. Yours was spot on! Keep it up bro.
If you want to watch another video on Tailwind: I just posted a new Tailwind CSS Tutorial (2023) - maybe this is also helpful ... 😉
Thanks Brad. Awesome as always!
🙂A good teacher is always knows what the actual need of his student. I appreciate your effert dear!
This is a very good overview thank you for this and your passion
Brad. You have a gift to show how create many cool stuff in very easy way. Ofcourse it's very true that the knowledge about css is fundamental. Guys don't forget about this. Thanks a lot for youre work i'm apprieciated
Hey, I Got This Recommendation Two Years Later and Really, Found This useful 👍👍❤️
most helpful tutorial ever. thank you
if you are having problems getting the script to build try updating node and also include autoprefixer in the dependencies that helped me.
Brad, you're a diamond amongst the rough. Thank you!
Thank you for your tutorials. You have been an inspiration in my web dev journey.
Brad is a heavyweight React developer, I actually gave you thanks by buying your udemy course, thanks Brad!
This was a really great crash course. Thank you
Seems like exactly what I was looking for!
Wow, this was a really great overview. Thanks.
Love the way you do ... tu tutu tuut. Great video mate.
Great information! Love your videos!
Smooth. Calm. Soothing Voice Informative. Brad
Thank you! Nice and clear as always!
Thanks Brad for the tutorial. I think this combines really well with SvelteJS. It would be nice a tutorial for that.
Fantastic! Thanks for making this!
Thanks for such a simple yet informative video, it helped me get a good idea overview on tailwind css
I just posted a Tailwind CSS Tutorial for Beginners (in 2023) ... maybe this is helpful for you as well ... 😉
I was just trying out Tailwind yesterday and.. this video came. Thank you, Brad!!
Awesome as always. You are a valuable resource
This is way cooler than I thought it was
I'm learning Tailwind. thanks for the video
Tailwind is really cool, I like the idea of having utility classes to build my components the way I want, gives me more control over the UI and I don't have to be reseting bunch of css styles like with bootstrap
Yes! 💯
Excellent look at Tailwind.
Great introduction, thanks a lot!
I don't know if I should feel dumb but it wasn't until this video I learned about emmet abbreviations! 🤩 so excited to use those.
And Tailwind looks good, I think we'll be using it at our company 👍
Thank you for this crash course
Holy moly, thanks brad !!!
appreciated , but anyone coming new here, most the syntactical stuff has been updated so kindly go through docs if struggling
I just posted a Tailwind CSS Tutorial (in 2023) - This should help... 😉
Thank you! It was really helpful
"This is not a crutch".... you, Sir, are awesome. Great video!!!!!! I'll definitely take a closer look at Tailwind CSS. Thanks for posting this video! Also, your voice sounds like Giovanni Ribisi from the movie "Boiler Room". :)
Thanks - very instructive!
I love you Brad, I love you. Thank you so much.
Awesome tutorial as usual
Looks great.
I will give it a try.
Great tutorial. 5 stars. As of 8/2021, it looks like Tailwind no longer has text-teal by default, so either add it, or pick something else.
Thank you so much Brad!!! I am a Software Engineer because of your tutorials!
Awesome!
Thank you a lot! it really helped me!
This is a great framework. I have to use it!
Thanks Brad... Really helpful
Your timing is excellent. Please consider using tailwind in any of your next project-based web dev udemy courses :D
Thanks again for another awesome tutorial. I'm still digesting the content en struggling with putting css like stuff in my HTML files. I'm trying to keep my HTML files light and lean, while working on styling in the CSS stylesheets. Now this feels a bit like throwing everything in one file.... I'll give it some more thoughts :-) A good tutorial is a tutorial that make you mind move right.
Just in time! 💙
God bless you abundantly Brad, you have been a blessing
Great video love it!! 😁
Cheers Brad. Looks fast and more custom than Bootstrap, though the structural and presentation layers kind of get mish mashed. Good for fast prototyping at least.
Thanks man, now i know where to start😅
Thanks professor, u r great!!
I could have used this 30 days ago lol. I had to learn all of this the hard way, on a client's dime ;)