Agree 100%. Used a tutorial to try and learn Tailwind a few months back and stopped after an hour. Tailwind Intellisense and the docs are all you need (Headwind is nice too).
The Tailwind documentation is fantastic. I learned a lot about both Tailwind and CSS just by reading it while using it. I never looked at any tutorial.
I 100% approve this advice. I learned pure CSS first and when I decided to jump to Tailwind it was as simple as searching in the docs the equivalent in CSS.
It’s worth noting that, while it’s not bad to learn Tailwind first per se, it’s generally _best_ to ensure you still always learn the basics _regardless_ of if you also learn something like Tailwind first. I say this because, as a web developer of >20yrs, my CSS knowledge has only grown and has always been useful over time. But, over that same time, various frameworks have come in and out of style. That said, I’m sure Tailwind may stick around for awhile, it’s just general advice so take that as you will. 😅
True, but unfortunately when I learnt react, then next from TH-cam there wasn't anything like CSS or Sass barring a handful tutes. Had to learn tailwind, styled components etc
@IridiumZero I know... it's weird because way back at the beginning we all used copious amounts of inline styles using each tag's "style" attribute. Then we moved to a style block at the top of the document. Then an external style sheet, and now we back round to copious guff at a tag level (plus external style sheet)
Oh, this was an ad for your ~12.3h 60$ css course, of course! But I get your point, and it's a fair one! Learn CSS first and you'll almost master tailwind by proxy. Good video explaining it!
It took me awhile to learn tailwind because I thought needed to learn much stuff but when I dived into the docs, I was able to learn tailwind so fast while implementing it on a project. So, I agree. If you know CSS well then you know tailwind well.
Thank you!!! I've been thinking about getting started with Tailwind but the 4hours videos are pretty overwhelming and are sometimes not so useful when you're in a specific situation that's not introduced on the video. The way you presented things made so much sense and it feels a lot more manageable to learn to work with Tailwind now, so you might have saved me many hours of work !
You are very correct. I started learning tailwind via Intellisense and the docs and, if you have good firm grasp on the css fundamentals, it literally is a waste of time to learn tailwind via tutorial resources.
I literally learnt more in this video than other tutorials or guides showing how to use TailwindCSS. I know that's kinda the point, but wow, it really surprised me.
Before I use Tailwind, my CSS skill is basic. Now I'm advanced in CSS through Tailwind because there are bunch of CSS property that I learnt when I'm using it practically. Plus, for beginner it's easier to learn CSS through Tailwind than CSS itself, for example CSS grid, it will be overwhelming for beginner seeing CSS grid property and syntax, but with Tailwind it's as easy as "grid grid-cols-2 gap-4". Up until this point, I don't have any reason to leave Tailwind to vanilla CSS, because the time amount to code just in element class is much less than thinking about naming CSS semantic class name, then moving to CSS file, write a bunch of lines, and move it back, and so on. There is no limitation in Tailwind since you can just use arbitrary value and even arbitrary property, and you can just extend with vanilla CSS and use Sass if you want. Using Tailwind has no cons at all, change my mind.
I love tailwind & it's my first choice for solo projects but when more developers become involved it becomes somewhat hard to debug the code and know which classes belong to which part of the code etc. You could just divide code into more components for easier debugging, but at that point you start losing 1 of tailwind's benefits as now you have to think of a name for the component. It's fantastic for speedy development, not very good for refactoring especially in a group environment.
i used inline styling for testing and when i discovered that you can do a much cleaner, concise and consistent work with tailwind, it was the easiest switch for me and i never looked back again (but i still find guides and tutorials in css bc there is so much of it out there. that said, one of the best features of tailwind is how easily you can reimplement/adapt css to it)
thank you for these info, I planned to learn Tailwind by taking a course, but after this video, it's so logical for me that just i need to learn how to install and the 5% you said
I only learned about tailwind when I was having a look at nextjs and tailwind was integrated in the example project. I was somewhat shocked how easy it was to use with just some basic knowledge in css. Once you understand the basic structure (which doesn't require much more effort than just looking up a few things in the documentation), you can pretty much guess what classes you need. The only part I'm having a bit of a struggle with is the typography-plugin, but I'm not sure, I may be using it wrong. (Also, small side note: Don't try to use the documentation in Safari)
Yes, we should only take a day to watch tutorial, in the tutorial we should focus on how things are setup and how to customize it. The classes are nearly indentical to CSS properties, so after that we should only rely on the documentation and articles. I actually watched an hour on tailwind course and built a simple responsive landing page on my own. It nearly took me a week, but it was worth the time, I didn't have to memorize the class names, we will easily get used to it and remember the names as we built more projects by relying on the documentation. Also its like learning CSS and a library at the same time.
when i started, my approach to plain css was the inline style attribute to see the results on the fly while testing. imagine my surprise when i discovered that tailwind did something similar, but in a much more concise and consistent way. it was the easiest switch and i really never looked back (well, you should know css anyway bc of how many guides and tutorial are out there. you just have to reimplement them in your project using tailwind, and that's pretty easy to do)
Im a total noob and I love tailwind css docs, it so easy to navigate and read. Even when im just writing full css if I forgot something i prefer to use tailwind docs instead of mdn, i only use that one when I need help with more complex stuff. I think best way to learn tailwind is to make a single page with dark mode and custom colors that way you learn to tweak the config.
I found the same. We need good command on CSS first, then tailwind will be very easy. I also agree that we don't need to spend much time watching tutorials, what we need is giving a try immediately. To start initially it needs only to check very few documentations, as shown in this video. In fact, Tailwind is not that much complicated for them who knows CSS well.
I want to add something about the crash courses, it can be used to learn how different people use Tailwind. Checking out the codes of other people can also teach us the proper/different ways of using things. It's true that you need to learn and be better at CSS first. Otherwise it will be difficult even someone goes through a lot of tutorials. If the concept is not clear and if we don't understand what people are writing and why they are writing the codes in that way it's meaningless.
It's what Ii thought with all CSS frameworks. Once I learned vanilla CSS and grassped what Bootstrap is for the first time, I started checking all other frameworks as well. Realisation came to me that once you know how to use one, you know all of them, it's just matter of having docs ready when you need them.
I love tailwind, it's easy to format and position the content where you want, and most importantly, doing it fast. That with headless ui is the perfect combo.
You are right, Kyle. This documentation is very helpful. Before we start using this CSS framework, we need to study and comprehend the documentation well.
I would say. The best thing to do is first learn basic vanilla css. Then use tailwind i learned it in one day. Just read through the tailwind css guide/documentation you would see all the available tailwind css shorthand styling. Its also really make your reaponsiveness super duper fast. I started this Tuesday and i can do everything i do on basic css now. Just very little css properties are missing in tailwind so you still need. Vanilla css
Yes, 100%! BTW: I just posted 2 short videos about tailwind, that will help you learn it or get good in it even faster then by using the official docs... 😉
Yo dude you saved me, My friend told Tailwind let's u customise stuff, lot than bootstrap. So when I started to search for Tailwind tutorials, I saw this video 3rd and I always knew u have a good point. Thanks ❤
Really awesome! I think the reason why I find it difficult to watch those long tailwindcss tutorial is what you mentioned here. What people need to understand and spend a little more time is setting a design system for a project. Could you please do a video on that?
Yea if you know CSS, Tailwind is beyond easy and useful. Edit: I disagree about watching the video, some people learn differently. Jumping into the doc can be a major waste of time. Whereas if you have a general map of where to find things in the docs beforehand it makes using it easier.
Yeah I’m a video learner. Thing about css styles is that there are too many settings that I don’t even know about. By watching a video, I also learn about new css properties I haven’t used before. As you said, everyone has their preferences and that’s fine.
Some people advising to learn css through tailwind. No don't do that. It's just like learning javascript through react. It'll help you get around small projects once complicated stuff comes up you'll be asking for someone to do that for you. Master the fundamentals and then go to frameworks you'll be at much better position.
So true. Some of them explain you 10 ways to colorise text to explain each 10 classes like 100, 200, 300 etc. and for me I enjoy tailwind but only because I learned css before.
Thank you!!! Few years ago, between you and other people in my life and on the internet, know the basics and the rest will follow, it's finally coming to fruition
To be honest, back then I started to watch the project using Tailwind on it. I felt overwhelm not to understand what's all about because I don't have my CSS Basic understanding. So I step back to learn about the behavior of CSS (also Grid layout & Flexbox), now it's really easy to understand about what to write with Tailwind CSS just reading their Documentation
Yep. I would 100% recommend people to start writing pure CSS themselves before using frameworks. Or at the very least use micro CSS libraries, like Pure CSS, or Pico CSS.
Bro you just saved me so... much time, I can't compare myself to other developers but I'd say I know my way around css and I was about taking dave gray 3 hours tailwind course
My biggest issue was learning how to implement Tailwind with an existing VIte project using React. This coupled with the video explaining Tailwind in 100 seconds really helps a ton.
Really amazing ! The way you show that css is the important thing and tailwind is so easy to master it by starting just with the documentation is really cool and helpfull Thank you so much 🤝
Super helpful advice bro. Thank you very much. I didn't know that I knew like 95% of Tailwind while never having written a single line of it? WhaTTTT! 😍
thanks for the advice! there are a lot of libs or frameworks which documentations are pretty good and it's more worthwhile reading them than seeing any tutorial.
I think the real issue before tailwind was there was lot of back and forth between writing CSS classes and what to use SAAS or Plain CSS and that too comes with lot of vendor related fixes. The end result was someone who is trying to learn CSS was focusing on this gochas rather than actual CSS and eventually just get tired of it. The most demotivating factor for some really good developers(mostly backend devs who were trying for CSS) was doesn't matter how hard they try without designers their page looks horrible due to wrong color selection and lots of other factors. Tailwind changed everything. All of sudden devs were focusing on writing classes and seeing at least reasonably beautiful result due to all right default settings setup by tailwind. I don't see anything wrong learning Tailwind first. In fact Tailwind was the thing that made me understand CSS very well as I was able to play around various things like Flexbox, Grid etc very quickly. Plus practically VS code Tailwind intelligence plug-in also displays underlying actual CSS for tailwind utility classes. Being a senior backend dev I find Tailwind is the best way to learn CSS.
I've learned tailwind pretty quick. The way I learned it was by watching only one video of React project where tailwind has been used. Then I started to use it for my very first project after that with a little help of intellisense and tailwind cheat sheet. After a day or two I was really confident using it.
Thanks, Kyle. I know CSS, Bootstrap, and a few other UI frameworks, but I recently started coding with React/next.js and am looking to learn Tailwind. But goddamn, the help videos are crazy long.
I was about to watch tailwind CSS today but your suggestion makes a sense..so I'll go through the documentation and install tailwind CSS intelligence today...thank you so much
I learned Css 3 three times than I came to tailwind it is very easy and joyful my advice is you must use tailwind but before learn css very well then come to tailwind it will make your coding life much easier
I learned both CSS and TailwindCSS, but when I learn and read TailwindCSC documentation, I more understand about styling concept like spacing, sizing, typography, color, background, layouting, flex, and grid also by implementing TailwindCSS more quickly instead using CSS.
I think this is true for any library and/or framework. Way better to learn the original language and fully understand how a language functions before you dive into libraries.
Thanks Kyle. The thing that often gets overlooked about Tailwind is the underlying design system. Using a framework such as Svelte, where you get to write scoped semantic CSS for each component-and therefore don't need to waste time coming up with tons of class names and all the BEM malarkey-makes Tailwind's utility classes unnecessary, assuming you already know how to write CSS. However, the benefit gained from using Tailwind is its design system. Many devs are not UI designers and so Tailwind can really help out if that's not your forte. Unless you already have your own custom components, Tailwind's design system can be a big help when it comes to building mock-ups and prototypes that look professional.
I never took a Tailwind course. Just followed their documentation. It is super easy to use and comprehend. It is much like Laravel documentation. But having prior CSS knowledge is a must IMO. In some cases, I did the other way around. That is, I learned CSS using Tailwind. Thanks Kyle!
Investing those hours into learning the fundamentals of CSS is way better than diving straight to a CSS framework like Tailwind, Bootstrap, Material etc. I find that these frameworks are too invested in manipulating a single div or button and they don't tell us how to manipulate alternating rows of a table or arrange buttons in a grid evenly. Another thing is frameworks come and go easily like a passing trend. It used to be Bootstrap that was on top, then it was MaterialUI, after that Tailwind and now some people are either into styled components (which require a strong knowledge of CSS) or frameworks of frameworks like DaisyUI which is a framework of Tailwind. Since these trends evolve so quickly it's better to master CSS first then just use the docs of whatever framework of your choice.
Because mastering html and css would make you too powerful. We have to abstract everything behind a blackbox framework to keep development mysterious and frustrating
Totally agree I've tried to watch some tailwind tutorials but after a while I try to brute force it and turn out well css is still css you apply tailwind utility you css-ing lol also huge credit for the tailwind vscode extension.
@@miketepes8208 well sure but I started out using tailwind and being a CSS dummy, i seriously only knew about padding, margin and text align, I learnt through copying somebody's tailwind components and playing around to see what happens if i remove a field etc.
I didn't know that people now instead of learning css they learn tailwind directly When they said technology changes fast i didn't know they mean that fast i I just finished the basics by the way 😂
CSS clicked for me in a way, only after I used Tailwind because it was much easier in a way for me to get the layout I want. Later I transitioned away from it, but I would use it if I have the option in a project. I agree that the docs are enough, but I am pretty sure that doesn't make courses obsolete... 4 hours course can be great and can provide immense value or it can be a giant pain the ass and boring, but that depend on who is teaching, not on the subject, so I dont think its a good idea to say "you dont need these courses", unless one has already really been through them. If we accept that then we can say the same for basically any tool out there that has a documentation and also courses.
I fully agree. If you know CSS, you know tailwindcss, its not a big deal at all. If you have to spend 4-8 hours on a tutorial, just revisit your CSS. I started a course, but got pissed off, I just had to watch on X2, then I went on practicing with FEM projects, and that was it. I was slow for a couple of hours, or days, but you needed to see me use Tailwind the following week👨💻.
As was bootstrap, or jquery, or whatever other abstraction we add on top of native languages. So few people are learning to code, script, markup, or style, but rather just puke out the same looking garbage. Shout out to all the devs putting in the time to learn base languages, never stop!
Why not just learn the css and put it into your own classes, like Kyle shows us how to do. It's the best way. Stay DRY, it's ok to say no to tailwind css. 😊
I downloaded and watched your video... but man, I had to come back and give another thumbs-up 👍👍 You're a lifesaver... a timesaver...! Thanks for this.
I learnt vanilla CSS a lot faster by using Tailwind than I ever did by using vanilla CSS. You work so much more efficiently with Tailwind,and the things you do are practically 1:1 so it makes sense, but it sounds weird if you don't think about it.
I learned CSS long before frameworks started to appear. So I've had it difficult to let go of old habits and adopt a framwork. Of course, a job can force you to know a framework, but I'm basically a backend dev.
Tailwind is just modularized css so the latter knowledge is crucial. Then it's just a matter of learning new syntax which isn't that hard. (So yes, I agree) I wouldn't call it a "waste of time" however. You still learn something the same way you'd from any other css tutorials. And then there are some best practices tailored only to tailwindcss. Applying global styles for example, or how to mix well with native css. Plus it's always good to practice syntax.
I actually think the complete opposite. Learn tailwindCSS and constantly check through Intellisense what it translates to in real CSS. I've learned a lot that way and only had to learn CSS Position and the Grid/Flex inner child positioning after that (they will usually be default to stretch, so learn the aligns and justifies to control their positioning behavior). TailwindCSS already applies all best practices so you can start using the best properties of CSS right off the gate. EDIT: the video actually doesn't want you to not learn TailwindCSS, it just prefers that you don't do it through tutorials and instead learn by crafting. I feel very baited by the title and the first few seconds of the video. I still think that tutorials are important to fill your knowledge gaps. Intellisense won't help you adding CSS properties you don't even know that exist.
There is no shortcuts. If you want to do front-end you must learn css... you use tailwind? Good. But what if your next project is not based on tailwind? Learn the basics, always.
tailwind feels like inline styles as classes. i get the appeal, but i can't seem to get past the class soup it tends to create. of course, maybe that's just my hangup and not actually a real problem. i could see it being really powerful with sass' @extend though. you could use only your classes with tailwind doing some of the heavy lifting for sensible defaults and you wouldn't have the overhead of including the entire tailwind framework.
I never understood the point of creating classes for standard margins or colors since they can be written just as easily with inline styles. However, it makes sense to use classes for repeating elements or groups of elements such as dropdown menus or tables. But what’s the point of writing ‘black’ instead of ‘color: black’? Does it really save THAT much time???
as FE developer for 6 years, i can confirm that learning CSS as the goal is best way to do tailwind css is just kinda like alias to write css by using its utility classes, plus perks, like purging unused css automatically
![กี่หมื่นฟ้า | Your Sky Series EP.1 [2/4]](http://i.ytimg.com/vi/qJbQs_nhjD4/mqdefault.jpg)
![กี่หมื่นฟ้า | Your Sky Series EP.1 [1/4]](http://i.ytimg.com/vi/vLGjxFL6U_I/mqdefault.jpg)
Agree 100%. Used a tutorial to try and learn Tailwind a few months back and stopped after an hour. Tailwind Intellisense and the docs are all you need (Headwind is nice too).
The Tailwind documentation is fantastic. I learned a lot about both Tailwind and CSS just by reading it while using it. I never looked at any tutorial.
Please could you Provide me with the link of that documentation bro?
I 100% approve this advice. I learned pure CSS first and when I decided to jump to Tailwind it was as simple as searching in the docs the equivalent in CSS.
Yes, 100%!
It’s worth noting that, while it’s not bad to learn Tailwind first per se, it’s generally _best_ to ensure you still always learn the basics _regardless_ of if you also learn something like Tailwind first. I say this because, as a web developer of >20yrs, my CSS knowledge has only grown and has always been useful over time. But, over that same time, various frameworks have come in and out of style. That said, I’m sure Tailwind may stick around for awhile, it’s just general advice so take that as you will. 😅
I agree with you is better to learn the fundamentals of CSS.
Having to add 800 classes to every markup tag is fundamentally not an efficient thing to be doing. This fad will pass and be forgotten.
@@jpanPirate jap always learn the core tech first. Html, css and JS and then libraries and then frameworks.
True, but unfortunately when I learnt react, then next from TH-cam there wasn't anything like CSS or Sass barring a handful tutes. Had to learn tailwind, styled components etc
@IridiumZero I know... it's weird because way back at the beginning we all used copious amounts of inline styles using each tag's "style" attribute. Then we moved to a style block at the top of the document. Then an external style sheet, and now we back round to copious guff at a tag level (plus external style sheet)
Oh, this was an ad for your ~12.3h 60$ css course, of course! But I get your point, and it's a fair one! Learn CSS first and you'll almost master tailwind by proxy. Good video explaining it!
It took me awhile to learn tailwind because I thought needed to learn much stuff but when I dived into the docs, I was able to learn tailwind so fast while implementing it on a project. So, I agree. If you know CSS well then you know tailwind well.
Tailwind was great but now it's time to move on
@@DeepTitanic what do you mean by moving on?
Thank you!!! I've been thinking about getting started with Tailwind but the 4hours videos are pretty overwhelming and are sometimes not so useful when you're in a specific situation that's not introduced on the video.
The way you presented things made so much sense and it feels a lot more manageable to learn to work with Tailwind now, so you might have saved me many hours of work !
This is so true Kyle. I personally prefer bootstrap and apply custom styling afterward to make a unique design but the same rules apply.
You are very correct. I started learning tailwind via Intellisense and the docs and, if you have good firm grasp on the css fundamentals, it literally is a waste of time to learn tailwind via tutorial resources.
I literally learnt more in this video than other tutorials or guides showing how to use TailwindCSS. I know that's kinda the point, but wow, it really surprised me.
Before I use Tailwind, my CSS skill is basic. Now I'm advanced in CSS through Tailwind because there are bunch of CSS property that I learnt when I'm using it practically. Plus, for beginner it's easier to learn CSS through Tailwind than CSS itself, for example CSS grid, it will be overwhelming for beginner seeing CSS grid property and syntax, but with Tailwind it's as easy as "grid grid-cols-2 gap-4". Up until this point, I don't have any reason to leave Tailwind to vanilla CSS, because the time amount to code just in element class is much less than thinking about naming CSS semantic class name, then moving to CSS file, write a bunch of lines, and move it back, and so on. There is no limitation in Tailwind since you can just use arbitrary value and even arbitrary property, and you can just extend with vanilla CSS and use Sass if you want. Using Tailwind has no cons at all, change my mind.
Exactly. I also learned css while doing stuff with tailwind and checking the doc and sometimes filling in from CSS docs.
I love tailwind & it's my first choice for solo projects but when more developers become involved it becomes somewhat hard to debug the code and know which classes belong to which part of the code etc. You could just divide code into more components for easier debugging, but at that point you start losing 1 of tailwind's benefits as now you have to think of a name for the component.
It's fantastic for speedy development, not very good for refactoring especially in a group environment.
i used inline styling for testing and when i discovered that you can do a much cleaner, concise and consistent work with tailwind, it was the easiest switch for me and i never looked back again
(but i still find guides and tutorials in css bc there is so much of it out there. that said, one of the best features of tailwind is how easily you can reimplement/adapt css to it)
thank you for these info, I planned to learn Tailwind by taking a course, but after this video, it's so logical for me that just i need to learn how to install and the 5% you said
I will post a short crash course on Tailwind CSS next week on my channel, if you are interested... 😉
I already posted the video - this should be exactly what you are looking for ... 😉
@@lukas.webdev it's on time 👌
I only learned about tailwind when I was having a look at nextjs and tailwind was integrated in the example project. I was somewhat shocked how easy it was to use with just some basic knowledge in css. Once you understand the basic structure (which doesn't require much more effort than just looking up a few things in the documentation), you can pretty much guess what classes you need.
The only part I'm having a bit of a struggle with is the typography-plugin, but I'm not sure, I may be using it wrong.
(Also, small side note: Don't try to use the documentation in Safari)
Yes, we should only take a day to watch tutorial, in the tutorial we should focus on how things are setup and how to customize it. The classes are nearly indentical to CSS properties, so after that we should only rely on the documentation and articles. I actually watched an hour on tailwind course and built a simple responsive landing page on my own. It nearly took me a week, but it was worth the time, I didn't have to memorize the class names, we will easily get used to it and remember the names as we built more projects by relying on the documentation. Also its like learning CSS and a library at the same time.
Been planning to watch 4 hours course. Thanks for saving my time!
when i started, my approach to plain css was the inline style attribute to see the results on the fly while testing. imagine my surprise when i discovered that tailwind did something similar, but in a much more concise and consistent way.
it was the easiest switch and i really never looked back
(well, you should know css anyway bc of how many guides and tutorial are out there. you just have to reimplement them in your project using tailwind, and that's pretty easy to do)
Im a total noob and I love tailwind css docs, it so easy to navigate and read. Even when im just writing full css if I forgot something i prefer to use tailwind docs instead of mdn, i only use that one when I need help with more complex stuff. I think best way to learn tailwind is to make a single page with dark mode and custom colors that way you learn to tweak the config.
I found the same. We need good command on CSS first, then tailwind will be very easy. I also agree that we don't need to spend much time watching tutorials, what we need is giving a try immediately. To start initially it needs only to check very few documentations, as shown in this video. In fact, Tailwind is not that much complicated for them who knows CSS well.
I want to add something about the crash courses, it can be used to learn how different people use Tailwind. Checking out the codes of other people can also teach us the proper/different ways of using things.
It's true that you need to learn and be better at CSS first. Otherwise it will be difficult even someone goes through a lot of tutorials. If the concept is not clear and if we don't understand what people are writing and why they are writing the codes in that way it's meaningless.
It's what Ii thought with all CSS frameworks. Once I learned vanilla CSS and grassped what Bootstrap is for the first time, I started checking all other frameworks as well. Realisation came to me that once you know how to use one, you know all of them, it's just matter of having docs ready when you need them.
I love tailwind, it's easy to format and position the content where you want, and most importantly, doing it fast.
That with headless ui is the perfect combo.
You are right, Kyle. This documentation is very helpful. Before we start using this CSS framework, we need to study and comprehend the documentation well.
Thank you for this...
I was actually taking a course for tailwind
I would say. The best thing to do is first learn basic vanilla css. Then use tailwind i learned it in one day. Just read through the tailwind css guide/documentation you would see all the available tailwind css shorthand styling. Its also really make your reaponsiveness super duper fast. I started this Tuesday and i can do everything i do on basic css now. Just very little css properties are missing in tailwind so you still need. Vanilla css
Yes, 100%!
BTW: I just posted 2 short videos about tailwind, that will help you learn it or get good in it even faster then by using the official docs... 😉
Yo dude you saved me, My friend told Tailwind let's u customise stuff, lot than bootstrap. So when I started to search for Tailwind tutorials, I saw this video 3rd and I always knew u have a good point. Thanks ❤
Great job. There are only a few, who has a courage to state that "King is naked". Bravo.
Really awesome! I think the reason why I find it difficult to watch those long tailwindcss tutorial is what you mentioned here. What people need to understand and spend a little more time is setting a design system for a project. Could you please do a video on that?
I was actually about to watch that 4hrs course until i scrolled down and saw your vid.....You're a genius!
Yea if you know CSS, Tailwind is beyond easy and useful.
Edit: I disagree about watching the video, some people learn differently. Jumping into the doc can be a major waste of time. Whereas if you have a general map of where to find things in the docs beforehand it makes using it easier.
Yeah I’m a video learner. Thing about css styles is that there are too many settings that I don’t even know about. By watching a video, I also learn about new css properties I haven’t used before. As you said, everyone has their preferences and that’s fine.
Some people advising to learn css through tailwind. No don't do that. It's just like learning javascript through react. It'll help you get around small projects once complicated stuff comes up you'll be asking for someone to do that for you. Master the fundamentals and then go to frameworks you'll be at much better position.
So true. Some of them explain you 10 ways to colorise text to explain each 10 classes like 100, 200, 300 etc. and for me I enjoy tailwind but only because I learned css before.
Thank you!!! Few years ago, between you and other people in my life and on the internet, know the basics and the rest will follow, it's finally coming to fruition
To be honest, back then I started to watch the project using Tailwind on it. I felt overwhelm not to understand what's all about because I don't have my CSS Basic understanding. So I step back to learn about the behavior of CSS (also Grid layout & Flexbox), now it's really easy to understand about what to write with Tailwind CSS just reading their Documentation
Yep. I would 100% recommend people to start writing pure CSS themselves before using frameworks.
Or at the very least use micro CSS libraries, like Pure CSS, or Pico CSS.
Bro you just saved me so... much time, I can't compare myself to other developers but I'd say I know my way around css and I was about taking dave gray 3 hours tailwind course
My biggest issue was learning how to implement Tailwind with an existing VIte project using React. This coupled with the video explaining Tailwind in 100 seconds really helps a ton.
I was watching a video on tailwind CSS and felt like I was wasting my time, then I saw ur video in the recommendation. I couldn't agree more.
Really amazing !
The way you show that css is the important thing and tailwind is so easy to master it by starting just with the documentation is really cool and helpfull
Thank you so much 🤝
Really appreciate your efforts. You are guiding people to save their most precious thing "Time".
TailwindCSS docs are so easy to understand. Found out about tailwind randomly and got the hang of it really quickly.
It's the best and shortest tailwind CSS tutorial on TH-cam!
Super helpful advice bro. Thank you very much. I didn't know that I knew like 95% of Tailwind while never having written a single line of it? WhaTTTT! 😍
thanks for the advice! there are a lot of libs or frameworks which documentations are pretty good and it's more worthwhile reading them than seeing any tutorial.
I think the real issue before tailwind was there was lot of back and forth between writing CSS classes and what to use SAAS or Plain CSS and that too comes with lot of vendor related fixes. The end result was someone who is trying to learn CSS was focusing on this gochas rather than actual CSS and eventually just get tired of it. The most demotivating factor for some really good developers(mostly backend devs who were trying for CSS) was doesn't matter how hard they try without designers their page looks horrible due to wrong color selection and lots of other factors. Tailwind changed everything. All of sudden devs were focusing on writing classes and seeing at least reasonably beautiful result due to all right default settings setup by tailwind. I don't see anything wrong learning Tailwind first. In fact Tailwind was the thing that made me understand CSS very well as I was able to play around various things like Flexbox, Grid etc very quickly. Plus practically VS code Tailwind intelligence plug-in also displays underlying actual CSS for tailwind utility classes. Being a senior backend dev I find Tailwind is the best way to learn CSS.
I'm absolutely agree with you. css is basic knowladge, freamworks might change everytime, they based on css.
Thank you! Stand-out content creator. Your cadence and knowledge is perfect.
I completely agree. I never learned any tailwind course before. I just read tailwind's docs. And then code and code
I've learned tailwind pretty quick. The way I learned it was by watching only one video of React project where tailwind has been used. Then I started to use it for my very first project after that with a little help of intellisense and tailwind cheat sheet. After a day or two I was really confident using it.
Building a project is the best way to learn.
Which video? Can you please share the link
amazing man. thank you i actually didnt get time to go through so long videos. you really simplified it.
Hehe, that's how I mastered Bootstrap but I forgot about the strategy when it came to Tailwind, thank you so much!
The docs itself is soo good, that I use it to search up any everyday css things (like place-items or so, just in case I forget it)
Thanks, Kyle. I know CSS, Bootstrap, and a few other UI frameworks, but I recently started coding with React/next.js and am looking to learn Tailwind. But goddamn, the help videos are crazy long.
I was about to watch tailwind CSS today but your suggestion makes a sense..so I'll go through the documentation and install tailwind CSS intelligence today...thank you so much
I learned tailwind by watching reactjs projects 🙌🏻 and I find it the most useful way because I was learning react+tailwind in the same time
Thank you for saving 4 hours of my time with a 8-minute video 🎉😊 Awesome job
I learned Css 3 three times than I came to tailwind it is very easy and joyful my advice is you must use tailwind but before learn css very well then come to tailwind it will make your coding life much easier
100%!
Thank you so much for saving me many hours, bro!!! 👍 You are absolutely right, reading the docs is the best approach BY FAR
I've been using tailwind for over 2 years and I finally learned peer. It's used to customize input "placeholders".
I learned both CSS and TailwindCSS, but when I learn and read TailwindCSC documentation, I more understand about styling concept like spacing, sizing, typography, color, background, layouting, flex, and grid also by implementing TailwindCSS more quickly instead using CSS.
I think this is true for any library and/or framework. Way better to learn the original language and fully understand how a language functions before you dive into libraries.
Thanks Kyle. The thing that often gets overlooked about Tailwind is the underlying design system. Using a framework such as Svelte, where you get to write scoped semantic CSS for each component-and therefore don't need to waste time coming up with tons of class names and all the BEM malarkey-makes Tailwind's utility classes unnecessary, assuming you already know how to write CSS. However, the benefit gained from using Tailwind is its design system. Many devs are not UI designers and so Tailwind can really help out if that's not your forte. Unless you already have your own custom components, Tailwind's design system can be a big help when it comes to building mock-ups and prototypes that look professional.
Boom 7 mins tailwind done😇. Man you are like god, Thank you.
Heard this guy making a youtube video about master CSS not tailwind and boom now we have a tutorial
Thanks kyle.i was just starting tailwind CSS but you saved my time.
Thanks
I just posted 2 short videos on Tailwind CSS, that will help you get better faster then by only using the official docs... 😉
Thank you, Kyle, for taking the time to show us the best way to learn Tailwind CSS. Your efforts are greatly appreciated.
I never took a Tailwind course. Just followed their documentation. It is super easy to use and comprehend. It is much like Laravel documentation. But having prior CSS knowledge is a must IMO. In some cases, I did the other way around. That is, I learned CSS using Tailwind. Thanks Kyle!
Thanks man. You saved me SO MUCH time and energy!
Tailwind doc is the best documentation. It's easy to understand.
Investing those hours into learning the fundamentals of CSS is way better than diving straight to a CSS framework like Tailwind, Bootstrap, Material etc. I find that these frameworks are too invested in manipulating a single div or button and they don't tell us how to manipulate alternating rows of a table or arrange buttons in a grid evenly.
Another thing is frameworks come and go easily like a passing trend. It used to be Bootstrap that was on top, then it was MaterialUI, after that Tailwind and now some people are either into styled components (which require a strong knowledge of CSS) or frameworks of frameworks like DaisyUI which is a framework of Tailwind. Since these trends evolve so quickly it's better to master CSS first then just use the docs of whatever framework of your choice.
Because mastering html and css would make you too powerful.
We have to abstract everything behind a blackbox framework to keep development mysterious and frustrating
I started tailwind without knowing css 😅. And for this approach I watch a walkthrough and one project video.
Totally agree I've tried to watch some tailwind tutorials but after a while I try to brute force it and turn out well css is still css you apply tailwind utility you css-ing lol also huge credit for the tailwind vscode extension.
You can learn CSS through tailwind. It goes both ways.
This. CSS written and video tutorials went all over my head. Tailwind taught me how flex works, how to get rounded stuff etc
You learn more CSS by using CSS directly
Yeah but the route css to tailwind is easier
@@miketepes8208 well sure but I started out using tailwind and being a CSS dummy, i seriously only knew about padding, margin and text align, I learnt through copying somebody's tailwind components and playing around to see what happens if i remove a field etc.
I didn't know that people now instead of learning css they learn tailwind directly
When they said technology changes fast i didn't know they mean that fast i
I just finished the basics by the way 😂
bro, that is a great video, thank you, I was about to waste time watching hours of video and within 10 minutes I am up and running, thanks
CSS clicked for me in a way, only after I used Tailwind because it was much easier in a way for me to get the layout I want. Later I transitioned away from it, but I would use it if I have the option in a project. I agree that the docs are enough, but I am pretty sure that doesn't make courses obsolete... 4 hours course can be great and can provide immense value or it can be a giant pain the ass and boring, but that depend on who is teaching, not on the subject, so I dont think its a good idea to say "you dont need these courses", unless one has already really been through them. If we accept that then we can say the same for basically any tool out there that has a documentation and also courses.
I fully agree. If you know CSS, you know tailwindcss, its not a big deal at all. If you have to spend 4-8 hours on a tutorial, just revisit your CSS. I started a course, but got pissed off, I just had to watch on X2, then I went on practicing with FEM projects, and that was it.
I was slow for a couple of hours, or days, but you needed to see me use Tailwind the following week👨💻.
This has come at a perfect time. It's true, Tailwind CSS documentation is pretty easy to understand
i never watched i tailwind tutorial i only learn from the Docs there docs is so easy
I have almost 1 year of experience learning css so I'll follow the tailwind docs briefly
🐐 This is you. You are the GOAT. Greatest of all time.
You are making everything look easy!❤
A tutorial of how to actually create your css layout would be good.
(Where properties should be, in what order and why)
As was bootstrap, or jquery, or whatever other abstraction we add on top of native languages. So few people are learning to code, script, markup, or style, but rather just puke out the same looking garbage. Shout out to all the devs putting in the time to learn base languages, never stop!
Why not just learn the css and put it into your own classes, like Kyle shows us how to do. It's the best way. Stay DRY, it's ok to say no to tailwind css. 😊
I am learning css and I want to learn it substantially.
I downloaded and watched your video... but man, I had to come back and give another thumbs-up 👍👍 You're a lifesaver... a timesaver...! Thanks for this.
Thanks so much for this info Kyle..i think I'm gonna gain a lot of time✨
I learnt vanilla CSS a lot faster by using Tailwind than I ever did by using vanilla CSS.
You work so much more efficiently with Tailwind,and the things you do are practically 1:1 so it makes sense, but it sounds weird if you don't think about it.
I learned CSS long before frameworks started to appear. So I've had it difficult to let go of old habits and adopt a framwork. Of course, a job can force you to know a framework, but I'm basically a backend dev.
that tailwind intellisense is super useful. Thank you so much!
Tailwind is just modularized css so the latter knowledge is crucial. Then it's just a matter of learning new syntax which isn't that hard. (So yes, I agree)
I wouldn't call it a "waste of time" however. You still learn something the same way you'd from any other css tutorials. And then there are some best practices tailored only to tailwindcss. Applying global styles for example, or how to mix well with native css. Plus it's always good to practice syntax.
i was about to watch tutorials , thanks for saving my time mate
I actually think the complete opposite. Learn tailwindCSS and constantly check through Intellisense what it translates to in real CSS. I've learned a lot that way and only had to learn CSS Position and the Grid/Flex inner child positioning after that (they will usually be default to stretch, so learn the aligns and justifies to control their positioning behavior). TailwindCSS already applies all best practices so you can start using the best properties of CSS right off the gate.
EDIT: the video actually doesn't want you to not learn TailwindCSS, it just prefers that you don't do it through tutorials and instead learn by crafting. I feel very baited by the title and the first few seconds of the video. I still think that tutorials are important to fill your knowledge gaps. Intellisense won't help you adding CSS properties you don't even know that exist.
wow so i started learning tailwind yesterday and i have a video by wds today.. amazing😍
Thank God I saw this 😂 I already started the 4 hours tutorial meanwhile I understand css perfectly already
There is no shortcuts. If you want to do front-end you must learn css... you use tailwind? Good. But what if your next project is not based on tailwind? Learn the basics, always.
I learned this a week ago after watching a 3 hour video and learning nothing, Yet I learned a lot from their site
tailwind feels like inline styles as classes. i get the appeal, but i can't seem to get past the class soup it tends to create. of course, maybe that's just my hangup and not actually a real problem.
i could see it being really powerful with sass' @extend though. you could use only your classes with tailwind doing some of the heavy lifting for sensible defaults and you wouldn't have the overhead of including the entire tailwind framework.
this answers lots of my questions thanks, couldnt find info on google - no irony
I never understood the point of creating classes for standard margins or colors since they can be written just as easily with inline styles. However, it makes sense to use classes for repeating elements or groups of elements such as dropdown menus or tables. But what’s the point of writing ‘black’ instead of ‘color: black’? Does it really save THAT much time???
as FE developer for 6 years, i can confirm that learning CSS as the goal is best way to do
tailwind css is just kinda like alias to write css by using its utility classes, plus perks, like purging unused css automatically
video was so good I tried to subscribe but realized I was already subscribed
Thanks a lot for this video! It helps save a lot of time.