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).
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)
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 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.
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)
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 !
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
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!
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.
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
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)
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?
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)
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.
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 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... 😉
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.
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.
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.
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.
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.
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!!! 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
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 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 🤝
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.
Thanks K for showing people how to learn - how to learn something is more important than just learning by any which means and puffing your time away on length tutorials with so much distraction already around
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 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
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.
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
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.
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 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 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.
@@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 😂
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 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.
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.
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'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.
Great educational video as usual. By the way, why is using Tailwind via CDN is for development purposes only and not best for production according to the documentation?
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???
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.
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.
thankyou for this, i've only ever used basic pure css and wanted to learn tailwind, like u said the length of tutorials immediately puts me off, im glad there's a shorter way of learning it. from what i see, tailwind is kinda like inline css then right? u just write it inside the html class, it does look simple, only the different property names might take a bit to get used to and recognize
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.
Mmeeh, honestly a bit click-baited by the Title, coz I love TailwindCSS very much. Yes, you are right. But,... anyone has their own method to learn something (not just TailwindCSS)... I mean it is not necessary to understand CSS well first to look up TailwindCSS. Plus, you also need like forever to fully understand CSS, right? and then you move on to learn pairing of CSS with TailwindCSS... What works for me : Only basic CSS, then learn TailwindCSS, then build and learn CSS through TailwindCSS documentations. Honestly I often re-visit my old CSS code and applying Tailwind's CSS property, coz I don't know some kind of CSS property exists before I learn Tailwind
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.
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!
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!
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.
sometimes use "p" for padding "text" for text, or "" to position, that the problem, if tailwind had a consisted patern, It would be more easier to learn. Another thing about the pattern who gives me a guarantee, that the pattern won't change soon?
![ง้อ (ALRIGHT) - FOURTH Prod. by URBOYTJ [ OFFICIAL MV ]](http://i.ytimg.com/vi/Qs8ZeV6Dqj8/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).
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)
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 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?
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)
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 !
Heard this guy making a youtube video about master CSS not tailwind and boom now we have a tutorial
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 👌
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!
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.
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
This is so true Kyle. I personally prefer bootstrap and apply custom styling afterward to make a unique design but the same rules apply.
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)
Been planning to watch 4 hours course. Thanks for saving my time!
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?
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)
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.
Great job. There are only a few, who has a courage to state that "King is naked". Bravo.
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 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... 😉
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.
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.
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.
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.
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.
Hehe, that's how I mastered Bootstrap but I forgot about the strategy when it came to Tailwind, thank you so much!
Thank you for this...
I was actually taking a course for tailwind
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.
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!!! 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
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 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 🤝
Came to watch a 4+ hours course and went with all the knowledge in 8 minutes.
Thank you! Stand-out content creator. Your cadence and knowledge is perfect.
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.
Thanks K for showing people how to learn - how to learn something is more important than just learning by any which means and puffing your time away on length tutorials with so much distraction already around
I was actually about to watch that 4hrs course until i scrolled down and saw your vid.....You're a genius!
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 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%!
Really appreciate your efforts. You are guiding people to save their most precious thing "Time".
*Watches and follows tailwind tutorial and understands it*
TH-cam home screen: "Watching tailwind tutorials is a waste of time"
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.
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
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.
Thank you for saving 4 hours of my time with a 8-minute video 🎉😊 Awesome job
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.
amazing man. thank you i actually didnt get time to go through so long videos. you really simplified it.
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 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.
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 😂
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 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.
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.
Thank you so much for saving me many hours, bro!!! 👍 You are absolutely right, reading the docs is the best approach BY FAR
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.
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
Thanks so much for this info Kyle..i think I'm gonna gain a lot of time✨
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
Great educational video as usual. By the way, why is using Tailwind via CDN is for development purposes only and not best for production according to the documentation?
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???
I started tailwind today only and instructor also said to do from docs if u know css😅
I have a two short tutorials on tailwind, that help you learn the basics faster... 😉
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... 😉
TailwindCSS docs are so easy to understand. Found out about tailwind randomly and got the hang of it really quickly.
i was about to watch tutorials , thanks for saving my time mate
I have almost 1 year of experience learning css so I'll follow the tailwind docs briefly
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 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 God I saw this 😂 I already started the 4 hours tutorial meanwhile I understand css perfectly already
I started tailwind without knowing css 😅. And for this approach I watch a walkthrough and one project video.
Thank you, Kyle, for taking the time to show us the best way to learn Tailwind CSS. Your efforts are greatly appreciated.
video was so good I tried to subscribe but realized I was already subscribed
i never watched i tailwind tutorial i only learn from the Docs there docs is so easy
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)
🐐 This is you. You are the GOAT. Greatest of all time.
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.
thankyou for this, i've only ever used basic pure css and wanted to learn tailwind, like u said the length of tutorials immediately puts me off, im glad there's a shorter way of learning it. from what i see, tailwind is kinda like inline css then right? u just write it inside the html class, it does look simple, only the different property names might take a bit to get used to and recognize
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.
Mmeeh, honestly a bit click-baited by the Title, coz I love TailwindCSS very much.
Yes, you are right. But,... anyone has their own method to learn something (not just TailwindCSS)...
I mean it is not necessary to understand CSS well first to look up TailwindCSS. Plus, you also need like forever to fully understand CSS, right? and then you move on to learn pairing of CSS with TailwindCSS...
What works for me :
Only basic CSS, then learn TailwindCSS, then build and learn CSS through TailwindCSS documentations.
Honestly I often re-visit my old CSS code and applying Tailwind's CSS property, coz I don't know some kind of CSS property exists before I learn Tailwind
that tailwind intellisense is super useful. Thank you so much!
I'm absolutely agree with you. css is basic knowladge, freamworks might change everytime, they based on css.
I completely agree. I never learned any tailwind course before. I just read tailwind's docs. And then code and code
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.
Very nice video! Thanks for the approach and method to search and learn, very usefull no only for Tildwind
You are making everything look easy!❤
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!
Bros saved my hours of my time in 8 minutes.
it's really motivating. but those who haven't got a sound knowledge on css yet, go first learn css then watch this video.
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!
I've been using tailwind for over 2 years and I finally learned peer. It's used to customize input "placeholders".
this answers lots of my questions thanks, couldnt find info on google - no irony
This one is the true -> "The only video you need to learn tailwind CSS"
Tailwind doc is the best documentation. It's easy to understand.
Thanks Kyle as always! 👍
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.
A tutorial of how to actually create your css layout would be good.
(Where properties should be, in what order and why)
Can you make a video on "Material UI" in the same way
sometimes use "p" for padding "text" for text, or "" to position, that the problem, if tailwind had a consisted patern, It would be more easier to learn.
Another thing about the pattern who gives me a guarantee, that the pattern won't change soon?