This is where I was 30 years ago. I've been advocating "know the basics" since then. Often against the grain. And it's still actual. History keeps repeating itself. Good to see someone more popular than me say it out loud. Thank you master Kevin. Another lesson well taught.
I'm 56 semi retired truck driver and just recently decided to learn some html/css/js and am seeing many frameworks recommended but I keep plugging away at the basics because I was taught a good base is needed for everything else to be built on top of it no matter what you are doing.
In my opinion, this is probably the most important video you have made. I have been writing software since 1985 and could not agree with you more strongly!! Well Done Kevin!!
Completely on your side. I tried learning react first and as soon as I faced a problem I had no idea if I was on Js land or react land and made it a pain to solve problems. I took a step back and did a Discord clone with php, js and css and now I feel like I can tackle any problem and learn any framework.
This is so important for everyone starting out and you articulated that so well. Even if you, as a beginner, don't see the value in that, take it from someone who has experience and follow their advice
This is exactly how I started dipping my toes into frontend development! I noticed I was watching React tutorials here and there and I wasn't entirely sure what code was React specific and what was html and css specific. So I promised myself I would stay away from frameworks until I could comfortably logic my way through a solution using html, css and JavaScript. SET A STRONG FOUNDATION FOR YOURSELF! There's no rush, give yourself time 😌
I have kind of the opposite problem - I learned HTML/CSS/JS ages ago and feel very at home with it, but I've never gotten too familiar with all the new frameworks, understood exactly how they abstract from the basics, and I'm even still kind of stumbling around the whole Node.js ecosystem.
I've recently started learning nodejs and it's been a bit of a struggle for me. I found that the issue for me is most resources out there tell you to download 6 or 7 different frameworks to do something as simple as process a pathname request from a client and completely ignore the vanilla nodejs modules. The explanation for why tutorials do this is "it's easy and saves time" but the code ends up being so abstract that it goes completely over my head and I have no idea what any of the code is doing. It took a while before I realized I needed to ignore anything with the words "npm install" in it (along with reading the official npm documentation) so I can understand how requests and responses and http methods work. Then, after learning the more verbose way of doing things stuff like express js makes sense and I can appreciate the time it saves me.
Try to build a websocket with rust if you want to learn more about the underlying stuff, I personally think that once you learn a little bit of Rust using actix is much easier and faster than nodejs
I have said this for years, and it is so nice to see someone high profile say it. I have answered the question "I am a new programmer, what should I learn first, React or Vue?" Javascript. And oddly enough I fell into the same trap of learning jQuery before really diving into JS. I really value your videos because they focus on the core and I have learned lots from you. Keep it up!
Very much agree. The only thing I'd add from a personal perspective is that using Tailwind is what finally made many CSS concepts click for me. It was immensely helpful learning core CSS concepts
@@JakubSK you need to write less in Tailwind than in CSS (like class "flex" vs "display: flex"), don't need to worry about optimalization, easier to understand for more developers. Btw I don't know why someone cannot write good CSS, that's why I didn't use Tailwind first, but now for my own project I use it, because it's easier.
So true. I've tried learning frameworks such as react and vue also dabbled a bit with bootstrap back when i first started because they were "cooler" and that base css and js was too "lame". I never knew why i was doing what i was doing until i decided to strenghten my core css,js skills. After that it just clicked and now im enjoying programming more than ever
Great to hear this first thing in the morning, especially after all the pressure I'm getting to jump to React instead of sticking to the html, css and js vanilla for a little longer. I've learned a lot from you, ever since you & Kyle from WBS did the CSS battles. I'm very grateful! Keep up the great content.
This is great! I agree with you 100% on this. One my coworkers actually has only ever used Bootstrap. And we are using tailwind now on a project. He is struggling with tailwind because he does not have the basics of CSS down.
I'm 100% with you on that. When I first started to create websites (around 2000-2001), jQuery, LESS and SASS weren't even a thing. So I had no choice but to learn to crawl, before I could walk and walk before I could run. Nowadays, I do almost every project with VueJS and SASS. But all these younger people have always had the more advanced stuff at their disposal, so it's hard not to skip any steps in the process then. It's basically decades of catching up they have to do.
After stepping back and really taking the time to learn CSS, I now have whole new respect for CSS frameworks and what they can do for you. I also realized why I didn't really need them at all.
This is really close to my heart. When I try finding answers to basic javascript questions, there is so much on stackoverflow where the accepted answer unfortunately uses jquery. Quite often doing it in vanilla js is both shorter and a more long lasting skill.
I agree, I took that long route of learning vanilla things first and now I'm learning frameworks and the learning curve / debugging is much easier when u know the Core languages. Thank you kevin, you helped me a lot learning CSS.
Before subscribing to this channel I only used bootstrap and had only a basic understanding of css. I took the time to learn JavaScript/Typescript in depth but I always thought that css was not that important to do a web app and bootstrap with a few css lines was enough. But man, I lost so much time trying to do basic stuff because I didn't know grid, flexbox, etc. Because of this channel, I have a better understanding of css (still so much to learn) and it's so much easier to build stuff. So thanks !
I think that's the issue here, I love working with JS, CSS and HTML, and if i had an option to ditch any framework I would do, but the job market forces you to work with certain technologies :/
It is amazing how often I'm consulted by more senior devs about css! Learning base css that everything else boils down into and understanding how to use the browser to work with css truly makes a difference.
Thank You SOOOO much for posting this video! I received this via your newsletter and this video gives me a place to respond (I don't use Twitter or Discord). When I first read this, I was surprised because I agree with your approach 150% and I figured I was one of the few who viewed things in the manner you do. Of course, I haven't mastered HTML or CSS, but from a philosophical standpoint, I share your views and apply the "it's good to know the fundamentals" mindset to many things in life (at least in my life). So, it was quite refreshing to read your thoughts on this. You are my absolute #1 resource for all things CSS and I appreciate you, your knowledge, and your efforts to help make the web better for all. U R D Man!!!!!! :)
Best advice! I’ve been building for the web since the late nineties. Hard lessons have made me very wary of using *any* large libraries for HTML or CSS or JS*. It’s oh soo sweet to begin with. * does not apply to backend frameworks in my experience.
Thank you, Kevin. Really well put, in a respectful tone. I think many need to be reminded of this regularly, those who learn as well as those who teach.
when I got the newsletter, I was like Aha ok right, actually so right. Because I have heared the advice from so many people but did not know why, but there is another intersting thing that I thought about, which is seeing professionals (like you) using the basics only which made me think (subconsciously) that it is the only way to go. therefore, I stuck at the basics. After seeing the letter, I tried to expand my knowledge into Vue and Nuxt.
I had to rewrite an Angular app in Vanilla Js/html/css to make it easier for the backend team to attach objects without dealing with 5 cryptic classes. Personally, I find it cleaner and a little more time consuming.
Agreed. I’m learning Angular right now and my biggest pain point is CSS. Still don’t fully understand grid and flex which made my app super card to build. Back to the basics!
Very good point. At the same time, learning a modern framework allows you to build things easier and make progress faster. That could make things less overwhelming and give you a smaller chance of giving up. Once you’re hooked, you’ll gladly learn and dig deep into the fundamentals. Well, at least that’s how it worked for me.
I appreciate your use of vanilla css/html/js so much. For the longest time, when a new browser API was released, I'd find many tutorials on it with titles like "How to use [new API] with X, Y, and Z!" (X, Y, and Z being some mishmash of frameworks and / or libraries that I might or might not be familiar with). The difficult thing was always trying to understand where the new API ended and the framework / libs began, and how they _truly_ worked on their own. You make it a lot easier to actually understand the core feature you're demonstrating, which then makes it easier to use with whichever setup I have.
I support Kevin here, the basics are everything. I am a front-end developer self taught a year and a half, no job yet. I always wrote vanilla css bootstrap was just weird then tailwind too had issues in setting up the .config file. I had to go back to vanilla css. I don't regret it and that's my boy Kevin to support me.
Thank you, Kevin. As someone struggling in a bootcamp just now I'm just at the point, where to focus on. (It is probably inherent to bootcamps to race through the subject matter, to be confronted with React and Next while still contemplating arrays and loops, while parts of the brain still linger in fascination with the multitude of possibilities of CSS). Your video provides me with a guiding light and also the excitement for further learning after this bootcamp. However, to be fair, the bootcamp at least enables me to understand what you are talking about. I am a complete beginner and hope to experience moments of enthusiasm again and again.
Spot on, I have been working on the Fullstack Web ecosystem for a while, mainly React, and I got to a point where the line between React/Frameworks/SPAs gibberish was too far from native browser modules and behavior. I'm trying to work with vanilla a lot more since it seems like a better investment of my time. At the end of the day we write stuff that is rendered by a web browser and should stick to that.
Thank you for saying it!! Vanilla is everything. Been in the job for 15 years and I'm glad I had to start with the core languages. It makes learning React, Bootstrap, jQuery and Angular soooo easy.
Couldn't agree more. And I am so happy to have learned the web before any of these frameworks came along, even before CSS was a thing. And most of the time, even when using any of these frameworks, I try my best to stay as close to Vanilla as possible (especially the CSS part).
I totally agree with the sentiments. Basically the video is a great summary of the Law of Leaky Abstraction. I don't come from a web dev background. I am primarily an application developer, thanks to school and great teachers and later university I learned all the way from assembler to high level languages. The law of leaky abstraction still applies and knowing the basics often helped find hard-to-track bugs in any project or framework. I often work on finding difficult bugs, performance optimization, refactoring legacy code into more modern variants besides adding new features or building new projects. I don't code assembler, but the knowledge still helps a lot.
Brilliant video! It's always shocking when I have to school "senior" React frontend devs because they don't know how to solve a DOM/Javascript issue without installing yet another package. Interestingly, I find the same issue when devs avoid learning SQL by using ORMs.
Very true, and even without react going away major changes can happen, my framework of choice for a while has been next, and with ver 13 lots of changes have been made, among which is that css-in-js isn't really viable with server components, but it made me realize that using that solution in the first place was actually limiting, since migrating those styles to a different framework would require a complete rewrite. This convinced me to switch back to sass and honestly, it's more convenient and flexible.
This is probably one of the most important videos for people starting their frontend journey to watch on all of TH-cam. And probably one a lot of experienced frontend devs need to watch (and understand) as well. This shouldn't even be a point of debate. But sadly, it is. Thank you, Kevin!
Inheriting a site from a previous developer who heavily used bootstrap and jquery made me loooaathe those frameworks so much. So I really appreciate as much stuff being in vanilla as possible.
vanilla all the way, I've been doing this professionaly for a year and stuck to vanilla at work while others that have been there for 2+ years working on react projects have a very clear disadvantage, theres so many "basic" things in vanilla that I see these guys struggling on because they're so stuck in frameworks, when you're good at vanilla everything is so much easier to understand
@@jj-big-slay-yo from the lean ones I'd rather use svelte as its a bit more popular and I personally really like it but a dev should always do some work in vanilla to maintain understanding and learn whats new
Way I see it -- What Kevin makes can be applied to anything. Like mentioned in the video -- it's the core basics. I have say taken CSS principles (in Kevins demo's) and applied them to frontends that used say Material UI, Tailwind or whatever as a framework for styling mixed with say Vue or React or whatever stack I am working with or inherited. Once you understand the core -- things like React can easily be broken down it is barebone principles (hope this might help a newer developer)
When teaching I think this is the correct approach. I can't tell the number of times I've watched a tutorial or quick how-to video and get disappointed at the amount of time wasted on configuring or fiddling with totally irrelevant (for the context of that video) things, for example a video on css grids where 3/4ths of it were about setting up bootstrap and a vscode theme.
I highly appreciate that you stick with vanilla. I prefer vanilla as well and find it very annoying to work with folks capable of framework X or Y but not able to understand the underlying fundamentals. And most often certain frameworsk/libs overcomplicate the overall solution. Regarding jQuery ... although I understand the ease of use, the bloat and weight compared to other libs like PrototypeJS was horrible. Especially when looking at certain image slideshows / carussel. Where the actual Code including the full jQuery bundle (inclusive the plugins) was x times larger than doing it in vanilla css or with a stripped version of jQurey or any more fitting lib like PrototypeJS. As you said, nowadays many developers learn just the framework and struggle with the smallest piece that is not supported by the framework.
EXACTLY. I learned jQuery first, and now I am learning JavaScript. I would have been much better learning JavaScript from the beginning. What makes JavaScript so hard for me now is I am so used to keywords in jQuery that when thinking/learning JavaScript I am mixing the two languages up. So it takes me twice as long to learn JavaScript as I have to unlearn Jquery.
You can even take it a step further, at least when it comes to general purpose programming languages like JavaScript. I try to learn the fundamentals of good software design above anything else. Syntax may change between languages, but concepts like the SOLID design principles can be applied to nearly any language. In my experience an object is an object, a function is a function, a variable is a variable (barring any language specific idiosyncrasies).
Yes I litterally did a bigger mistake when jumping straight ahed to next js without knowing how to do any webdevelopment at all....now i am working through Html and css hand books then going to start with JavaScript then Typescript then Vue cuz its the framework that was the most fun to use for me
It's nice to know I'm not alone. All I here about are frameworks for every thing and their plugins. It doesn't make any sense. I can understand, but I can't agree. I feel so comfortable with HTML, CSS and JS/TS. I use Nuxt for certain projects but they are the exception, when I need something more complex. Thank you for your content. I'm a fan 🙂🙏
I think what might be a good thing to show, somehing I would certainly find interesting, is taking one of the frameworks, like bootstrap or whatever, taking some kind of design mockup/theme from somewhere else, and doing a long form/multi-part video showing how to use your css/html knoiwledge to create a boilerplate project with some sample content with all the common page building blocks in that framework. I.E. Show how to apply that plain css/js/html knowledge when starting a new project using the framework.
i am really happy that i took like 2 years to pick up a frontend framework. the best thing to happen to my productivity using various frontend frameworks was the time i spent not using them. i am a much better react developer thanks to my relucancy to pick it up in the first place. don't rush yourself, id force yourself to at least 2 or 3 large projects in vanilla before you pick up a framework of any kind.
I cannot agree more, i get asked all the time for these things, and you gave the best possible answer, i will use it from now on, because it is better than mine xD similar in message but much better explained.
ปีที่แล้ว
Totally wholeheartedly agree! Even using a simple CSS framework like bootstrap keeps you locked in and in the end eliminates all the progress you had in the beginning. I made that error myself. Better stick to the roots. CSS has become so infinitely better that there is no real need to lock yourself in a toxic relationship. Frameworks and libraries will betray you. SCSS is the next on my list to eliminate.
Agree with everything. When I started programming I was making sorting algorithms and asking for memory allocation in C, then I just typed .sort and left the garbage collector to work it's magic. Now I just ask ChatGPT what to do XD. I don't miss those days but I'm glad I started there to get a better grasp of what's underneath.
Oh my goodness! Finally, someone said it! Thank you, Kevin, for saying it! Every DEV on every team on every program on every project on every invading UFO from every alien planet everywhere needs to hear what you just said (and wrote in your news letter). Seriously, bro. This should be required reading/listening/watching for every DEV class worth paying for. Remember 'Macromedia' Flash/ActionScript? Really fun making all those cool (inaccessible) Flash intros... but they all went the way of the Dodo because they were dependency based (not native to the browser). Thus replaceable with the next shiny object and promises of DEV nirvana... Hmmm... sort of how JS frameworks are replaceable today. Just sayin... want your code to last? Go native! Great post. Wish I could like, follow, and sign up for the news letter more than twice...
Well, I still use JavaScript almost exclusively for DOM manipulation, and when I started out vanilla JS just confused me. A coworker then told me something along the lines of „just use jQuery“ and so I did. I found it to be much more readable and understandable and it helped a great deal to understand how to use JavaScript in general. Some time ago I switched back to vanilla JS know how to do everything I need. But all in all I would say that I took the right path for me by learning jQuery first 😅
Love this! I think it’s sad that so many developers tout using Tailwind. I get it… it makes things a little faster. But I love making my own design systems from scratch. I love the craft. It’s the same reason I didn’t ride my bike with training wheels when I was a kid. Sure, you’ll fall and get hurt, but each of those moments (hopefully) teaches a valuable lesson.
I am a hobbyist web dev (I am a developer by profession but not web, I work in data), however one of the "quirks" of being me is my desire to understand everything from the flat basics. If a pipe is leaking I don't just want to know what will make it stop, I want to understand the flow, the structure, why it could have even ended up leaking etc. This can be an issue in a lot of ways because it means I don't just do a 5 minute job, I take several hours learning seemingly irrelevant things just to make something basic. Whilst there's people out there with several finished website, my website is still Under Construction as has been for a long time. However, one big benefit is exactly what you take about here, I understand coding logic really well (a mix of wanting to learn everything and also doing around 10 different coding languages). I'm incredibly good at recalling specific info and debugging within a language. I've had several practising web developers be stuck on a project in something I've never used, but with my knowledge of base JS I was able to logic it out and solve it for them within a few minutes, it's one of my big strengths despite all the weaknesses of this approach. And I think that's why learning these basics is so important, because I can just look at the code and know what it does. Then once I was doing a React course, I absolutely flew through it because I already knew the logic, I just needed to know the React syntax. I'm not saying things are easy for me, there's still some deeply complex logic that I have to sit and untangle, but at least the language is never the problem. If I was asked to create a React component to do something, I would know which bits need to be regular JS and which bits are React syntax. And I think exactly the advice you give here is the reason I can so quickly pick up things now, because I put in that massive chunk of extra time early on when everyone else just wanted to pump out finished projects. I think you still need a balance (unless you're a hobbyist projects still need to be completed after all) and you can absolutely specialise in a framework if you wish, but please make sure you learn the basics first so you don't have the issue of just copy-pasting code, not understanding what it actually does and then having to try debug something you don't get.
I'm agree with you but for people already master HTML CSS and JavaScript? You can teach react too or tailwindcss for work easier and more fast. I'm talking about tutorial for senior développer or just for improve productivity. You are a good instructor and I know you can always deliver great content. 👍
JQuery did actually have some completion in the early days from Mootools. It was a bit like the VHS vs Betamax wars (for those of us older to remember). I went with Mootools for many years and still maintain it on legacy projects.
I totally agree. However, I never would have been able to get over the hump of learning the basics before learning how to practically build an app. If you want to join learn the framework and go back later and fill in the basics then do that. It's really easy after the fact to look back and think you should have learned the basics first, but if that would have kept you from breaking in to start with then it wouldn't have been the right path.
Something that you didn't say but I think really stands out in your content is how pedagogical it is and how distracting it would be to introduce a tool in these videos. It can actually be a problem. People learn for example to couple the UI layer and the data layer when watching tutorials on state management in React, because introducing the indirections necessary to avoid coupling would be a distraction (the learner is already learning something new, they are already confused, why confuse them even more by having to explain more code?), but because the learners do not spend the time learning the basics of computer science, they never learn how to do things "properly".
In this spirit of this video, I trust you and would also like to hear your opinion on the pros and cons of adding these frameworks on to our vanilla JS and CSS knowledge, especially Tailwind and other CSS-as-a-thousand-classes libraries.
What about when CSS modules are a native thing (`with/assert { type: 'style' }`)? With those, HTML & JSON modules, and custom elements, I can see a mind-blowing tutorial showing off what native can do (and pretty easily).
Frameworks are only a tool to make your work easier, but in the end it's still *you* who has to do the work. If you don't know web technologies, React will not help you, the same way buying an expensive car won't teach you how to drive (and will only bring regrets when you crash it). When you learn the basics of the craft, it will be really easy to pick up the tools, but when you learn the tool, it will be hard to learn the craft itself.
I totally agree. I even think that using these frameworks bugs me with more effort in learning things that vanilla, with a little bit more elbow grease, already provides.
The issue with most FE frameworks is they are just JS with some boiler-plated overhead, yes it is nice we do not have to do most of that boilerplate everytime. Most of everything I used to use Jquery for back in the day can be done in JS now.
JQuery is still quite popular according to the stackoverflow survey. I've switched to mostly vanilla years ago due to different libraries and frameworks never doing quite what I need and I was fed up with having to bend them to my will and then there's all the extra bloat. I got rid of almost everything and performance is way up and projects are actually simpler. I do still use JQuery (NOT jquery ui) as I do actually still find it quite handy.
Also, the most important part. You are master of HTML/CSS/JS, and in my opinion, the top of the top TH-camrs in CSS content. I believe most of us looking up your videos for this reason. I'm sure you could teach React decently well too, but there might be others who are better in that specific library. There is nothing bad about specialising on something as a content creator.
Makes sense. Core languages are so so important
This is where I was 30 years ago. I've been advocating "know the basics" since then. Often against the grain. And it's still actual. History keeps repeating itself.
Good to see someone more popular than me say it out loud.
Thank you master Kevin. Another lesson well taught.
"Often against the grain"... very well stated!
As usual, spot on, Kevin. Knowing the foundations and pillars of front-end web development is the only way to properly learn any framework.
I'm 56 semi retired truck driver and just recently decided to learn some html/css/js and am seeing many frameworks recommended but I keep plugging away at the basics because I was taught a good base is needed for everything else to be built on top of it no matter what you are doing.
I like that you don't focus on frameworks, makes it really easy to tweak stuff as you need to.
That’s the best feeling when you have full control.
Yeah, agreed
@@obelisk.5890 yet impossible to build anything real
In my opinion, this is probably the most important video you have made. I have been writing software since 1985 and could not agree with you more strongly!! Well Done Kevin!!
Completely on your side. I tried learning react first and as soon as I faced a problem I had no idea if I was on Js land or react land and made it a pain to solve problems. I took a step back and did a Discord clone with php, js and css and now I feel like I can tackle any problem and learn any framework.
This is so important for everyone starting out and you articulated that so well. Even if you, as a beginner, don't see the value in that, take it from someone who has experience and follow their advice
This is exactly how I started dipping my toes into frontend development! I noticed I was watching React tutorials here and there and I wasn't entirely sure what code was React specific and what was html and css specific. So I promised myself I would stay away from frameworks until I could comfortably logic my way through a solution using html, css and JavaScript.
SET A STRONG FOUNDATION FOR YOURSELF! There's no rush, give yourself time 😌
I have kind of the opposite problem - I learned HTML/CSS/JS ages ago and feel very at home with it, but I've never gotten too familiar with all the new frameworks, understood exactly how they abstract from the basics, and I'm even still kind of stumbling around the whole Node.js ecosystem.
I've recently started learning nodejs and it's been a bit of a struggle for me. I found that the issue for me is most resources out there tell you to download 6 or 7 different frameworks to do something as simple as process a pathname request from a client and completely ignore the vanilla nodejs modules. The explanation for why tutorials do this is "it's easy and saves time" but the code ends up being so abstract that it goes completely over my head and I have no idea what any of the code is doing. It took a while before I realized I needed to ignore anything with the words "npm install" in it (along with reading the official npm documentation) so I can understand how requests and responses and http methods work. Then, after learning the more verbose way of doing things stuff like express js makes sense and I can appreciate the time it saves me.
Try to build a websocket with rust if you want to learn more about the underlying stuff, I personally think that once you learn a little bit of Rust using actix is much easier and faster than nodejs
I have said this for years, and it is so nice to see someone high profile say it. I have answered the question "I am a new programmer, what should I learn first, React or Vue?" Javascript. And oddly enough I fell into the same trap of learning jQuery before really diving into JS. I really value your videos because they focus on the core and I have learned lots from you. Keep it up!
Very much agree. The only thing I'd add from a personal perspective is that using Tailwind is what finally made many CSS concepts click for me. It was immensely helpful learning core CSS concepts
Do you know some tailwind courses?
@@emmanuelmantilla1465 you don't really need a course if you understand css, just read the docs
@@emmanuelmantilla1465 Net Ninja did a solid Tailwind course.
You're absolutely right. Nowadays, there are too many strange frameworks, and it only adds to the confusion.
There are, but some makes web dev easier like Tailwind.
Makes you feel dumb because you don’t know the latest fashionable framework with a snazzy sounding name.
@@mezesadam1997 I don't understand how it makes it easier tbh
@@JakubSK you need to write less in Tailwind than in CSS (like class "flex" vs "display: flex"), don't need to worry about optimalization, easier to understand for more developers. Btw I don't know why someone cannot write good CSS, that's why I didn't use Tailwind first, but now for my own project I use it, because it's easier.
@@mezesadam1997 I’ve used Tailwind on many projects. No thank you.
So true. I've tried learning frameworks such as react and vue also dabbled a bit with bootstrap back when i first started because they were "cooler" and that base css and js was too "lame". I never knew why i was doing what i was doing until i decided to strenghten my core css,js skills. After that it just clicked and now im enjoying programming more than ever
Great to hear this first thing in the morning, especially after all the pressure I'm getting to jump to React instead of sticking to the html, css and js vanilla for a little longer.
I've learned a lot from you, ever since you & Kyle from WBS did the CSS battles. I'm very grateful! Keep up the great content.
This is great! I agree with you 100% on this. One my coworkers actually has only ever used Bootstrap. And we are using tailwind now on a project. He is struggling with tailwind because he does not have the basics of CSS down.
I'm 100% with you on that. When I first started to create websites (around 2000-2001), jQuery, LESS and SASS weren't even a thing. So I had no choice but to learn to crawl, before I could walk and walk before I could run. Nowadays, I do almost every project with VueJS and SASS. But all these younger people have always had the more advanced stuff at their disposal, so it's hard not to skip any steps in the process then. It's basically decades of catching up they have to do.
After stepping back and really taking the time to learn CSS, I now have whole new respect for CSS frameworks and what they can do for you. I also realized why I didn't really need them at all.
This is really close to my heart. When I try finding answers to basic javascript questions, there is so much on stackoverflow where the accepted answer unfortunately uses jquery. Quite often doing it in vanilla js is both shorter and a more long lasting skill.
I agree, I took that long route of learning vanilla things first and now I'm learning frameworks and the learning curve / debugging is much easier when u know the Core languages.
Thank you kevin, you helped me a lot learning CSS.
Before subscribing to this channel I only used bootstrap and had only a basic understanding of css. I took the time to learn JavaScript/Typescript in depth but I always thought that css was not that important to do a web app and bootstrap with a few css lines was enough. But man, I lost so much time trying to do basic stuff because I didn't know grid, flexbox, etc. Because of this channel, I have a better understanding of css (still so much to learn) and it's so much easier to build stuff. So thanks !
As a JS, CSS and HTML Vanilla frontend developer, i can say that is a bit hard to find jobs only knowing vanilla languages
I think that's the issue here, I love working with JS, CSS and HTML, and if i had an option to ditch any framework I would do, but the job market forces you to work with certain technologies :/
It is amazing how often I'm consulted by more senior devs about css! Learning base css that everything else boils down into and understanding how to use the browser to work with css truly makes a difference.
Thank You SOOOO much for posting this video! I received this via your newsletter and this video gives me a place to respond (I don't use Twitter or Discord). When I first read this, I was surprised because I agree with your approach 150% and I figured I was one of the few who viewed things in the manner you do. Of course, I haven't mastered HTML or CSS, but from a philosophical standpoint, I share your views and apply the "it's good to know the fundamentals" mindset to many things in life (at least in my life). So, it was quite refreshing to read your thoughts on this. You are my absolute #1 resource for all things CSS and I appreciate you, your knowledge, and your efforts to help make the web better for all. U R D Man!!!!!! :)
Best advice!
I’ve been building for the web since the late nineties. Hard lessons have made me very wary of using *any* large libraries for HTML or CSS or JS*. It’s oh soo sweet to begin with.
* does not apply to backend frameworks in my experience.
Thank you, Kevin. Really well put, in a respectful tone. I think many need to be reminded of this regularly, those who learn as well as those who teach.
when I got the newsletter, I was like Aha ok right, actually so right. Because I have heared the advice from so many people but did not know why, but there is another intersting thing that I thought about, which is seeing professionals (like you) using the basics only which made me think (subconsciously) that it is the only way to go. therefore, I stuck at the basics. After seeing the letter, I tried to expand my knowledge into Vue and Nuxt.
I had to rewrite an Angular app in Vanilla Js/html/css to make it easier for the backend team to attach objects without dealing with 5 cryptic classes. Personally, I find it cleaner and a little more time consuming.
What do you mean by cryptic classes.
Wut? This comment makes no sense at all.
I totally agree. But deep down we also want to see tech stacks you work with and your opinion on latest new frameworks
Using vanilla stuff is why I still comeback to your channel. Good work Kevin
Agreed. I’m learning Angular right now and my biggest pain point is CSS. Still don’t fully understand grid and flex which made my app super card to build. Back to the basics!
Very good point. At the same time, learning a modern framework allows you to build things easier and make progress faster. That could make things less overwhelming and give you a smaller chance of giving up. Once you’re hooked, you’ll gladly learn and dig deep into the fundamentals. Well, at least that’s how it worked for me.
I appreciate your use of vanilla css/html/js so much. For the longest time, when a new browser API was released, I'd find many tutorials on it with titles like "How to use [new API] with X, Y, and Z!" (X, Y, and Z being some mishmash of frameworks and / or libraries that I might or might not be familiar with). The difficult thing was always trying to understand where the new API ended and the framework / libs began, and how they _truly_ worked on their own.
You make it a lot easier to actually understand the core feature you're demonstrating, which then makes it easier to use with whichever setup I have.
I support Kevin here, the basics are everything. I am a front-end developer self taught a year and a half, no job yet. I always wrote vanilla css bootstrap was just weird then tailwind too had issues in setting up the .config file. I had to go back to vanilla css. I don't regret it and that's my boy Kevin to support me.
Exactly! Thanks a lot for bringing up these points, Kevin.
Thank you, Kevin. As someone struggling in a bootcamp just now I'm just at the point, where to focus on. (It is probably inherent to bootcamps to race through the subject matter, to be confronted with React and Next while still contemplating arrays and loops, while parts of the brain still linger in fascination with the multitude of possibilities of CSS).
Your video provides me with a guiding light and also the excitement for further learning after this bootcamp. However, to be fair, the bootcamp at least enables me to understand what you are talking about. I am a complete beginner and hope to experience moments of enthusiasm again and again.
Spot on, I have been working on the Fullstack Web ecosystem for a while, mainly React, and I got to a point where the line between React/Frameworks/SPAs gibberish was too far from native browser modules and behavior. I'm trying to work with vanilla a lot more since it seems like a better investment of my time. At the end of the day we write stuff that is rendered by a web browser and should stick to that.
i fell for this..just discovered u recently with another full long length video and i wanted to thank you for putting this out there.
Thank you for saying it!! Vanilla is everything. Been in the job for 15 years and I'm glad I had to start with the core languages. It makes learning React, Bootstrap, jQuery and Angular soooo easy.
I wish I could shake your hand! I am so grateful for everything you teach, and the principles with which you do so.
Couldn't agree more. And I am so happy to have learned the web before any of these frameworks came along, even before CSS was a thing.
And most of the time, even when using any of these frameworks, I try my best to stay as close to Vanilla as possible (especially the CSS part).
You are the best, after working for year in it. thanks to you I started to like css
Keep it vanilla, you don’t how much you have helped me in my career. Thank you.
I totally agree with the sentiments. Basically the video is a great summary of the Law of Leaky Abstraction.
I don't come from a web dev background. I am primarily an application developer, thanks to school and great teachers and later university I learned all the way from assembler to high level languages. The law of leaky abstraction still applies and knowing the basics often helped find hard-to-track bugs in any project or framework.
I often work on finding difficult bugs, performance optimization, refactoring legacy code into more modern variants besides adding new features or building new projects. I don't code assembler, but the knowledge still helps a lot.
Brilliant video! It's always shocking when I have to school "senior" React frontend devs because they don't know how to solve a DOM/Javascript issue without installing yet another package. Interestingly, I find the same issue when devs avoid learning SQL by using ORMs.
SQL? The answer surely must be MongoDB.
Spot on as always. You really stand out on youtube.
Brilliant! Makes perfect sense - thanks for sharing
Very true, and even without react going away major changes can happen, my framework of choice for a while has been next, and with ver 13 lots of changes have been made, among which is that css-in-js isn't really viable with server components, but it made me realize that using that solution in the first place was actually limiting, since migrating those styles to a different framework would require a complete rewrite. This convinced me to switch back to sass and honestly, it's more convenient and flexible.
This is probably one of the most important videos for people starting their frontend journey to watch on all of TH-cam. And probably one a lot of experienced frontend devs need to watch (and understand) as well. This shouldn't even be a point of debate. But sadly, it is. Thank you, Kevin!
Inheriting a site from a previous developer who heavily used bootstrap and jquery made me loooaathe those frameworks so much. So I really appreciate as much stuff being in vanilla as possible.
Fully agree and appreciate your approach. Thanks for doing what you do!
True, it's easy to port vanilla css to other frameworks but not vice-versa.
Hey Kevin, You're amazing. Thanks for being you. Thanks for sharing your knowledge.
Nice explaination! Keep it on!
vanilla all the way, I've been doing this professionaly for a year and stuck to vanilla at work while others that have been there for 2+ years working on react projects have a very clear disadvantage, theres so many "basic" things in vanilla that I see these guys struggling on because they're so stuck in frameworks, when you're good at vanilla everything is so much easier to understand
for jobs, i use react
Or you could just use a lean framework like preact, or solid-js.
@@jj-big-slay-yo from the lean ones I'd rather use svelte as its a bit more popular and I personally really like it but a dev should always do some work in vanilla to maintain understanding and learn whats new
Way I see it -- What Kevin makes can be applied to anything. Like mentioned in the video -- it's the core basics. I have say taken CSS principles (in Kevins demo's) and applied them to frontends that used say Material UI, Tailwind or whatever as a framework for styling mixed with say Vue or React or whatever stack I am working with or inherited.
Once you understand the core -- things like React can easily be broken down it is barebone principles (hope this might help a newer developer)
When teaching I think this is the correct approach. I can't tell the number of times I've watched a tutorial or quick how-to video and get disappointed at the amount of time wasted on configuring or fiddling with totally irrelevant (for the context of that video) things, for example a video on css grids where 3/4ths of it were about setting up bootstrap and a vscode theme.
Wholeheartedly agree. Learning the underlying language of any framework, help you to more fully understand the framework.
I highly appreciate that you stick with vanilla. I prefer vanilla as well and find it very annoying to work with folks capable of framework X or Y but not able to understand the underlying fundamentals. And most often certain frameworsk/libs overcomplicate the overall solution.
Regarding jQuery ... although I understand the ease of use, the bloat and weight compared to other libs like PrototypeJS was horrible. Especially when looking at certain image slideshows / carussel. Where the actual Code including the full jQuery bundle (inclusive the plugins) was x times larger than doing it in vanilla css or with a stripped version of jQurey or any more fitting lib like PrototypeJS.
As you said, nowadays many developers learn just the framework and struggle with the smallest piece that is not supported by the framework.
Like learning Flutter before understanding Dart. Great content Kevin
EXACTLY. I learned jQuery first, and now I am learning JavaScript. I would have been much better learning JavaScript from the beginning. What makes JavaScript so hard for me now is I am so used to keywords in jQuery that when thinking/learning JavaScript I am mixing the two languages up. So it takes me twice as long to learn JavaScript as I have to unlearn Jquery.
You can even take it a step further, at least when it comes to general purpose programming languages like JavaScript. I try to learn the fundamentals of good software design above anything else. Syntax may change between languages, but concepts like the SOLID design principles can be applied to nearly any language. In my experience an object is an object, a function is a function, a variable is a variable (barring any language specific idiosyncrasies).
Spittin’ facts 💯
Yes I litterally did a bigger mistake when jumping straight ahed to next js without knowing how to do any webdevelopment at all....now i am working through Html and css hand books then going to start with JavaScript then Typescript then Vue cuz its the framework that was the most fun to use for me
It's nice to know I'm not alone. All I here about are frameworks for every thing and their plugins. It doesn't make any sense. I can understand, but I can't agree. I feel so comfortable with HTML, CSS and JS/TS. I use Nuxt for certain projects but they are the exception, when I need something more complex. Thank you for your content. I'm a fan 🙂🙏
I think what might be a good thing to show, somehing I would certainly find interesting, is taking one of the frameworks, like bootstrap or whatever, taking some kind of design mockup/theme from somewhere else, and doing a long form/multi-part video showing how to use your css/html knoiwledge to create a boilerplate project with some sample content with all the common page building blocks in that framework. I.E. Show how to apply that plain css/js/html knowledge when starting a new project using the framework.
I learned the jQuery lesson in another way but what you say is absolutely right! The core concepts are, well the core.
i am really happy that i took like 2 years to pick up a frontend framework. the best thing to happen to my productivity using various frontend frameworks was the time i spent not using them. i am a much better react developer thanks to my relucancy to pick it up in the first place. don't rush yourself, id force yourself to at least 2 or 3 large projects in vanilla before you pick up a framework of any kind.
I cannot agree more, i get asked all the time for these things, and you gave the best possible answer, i will use it from now on, because it is better than mine xD similar in message but much better explained.
Totally wholeheartedly agree! Even using a simple CSS framework like bootstrap keeps you locked in and in the end eliminates all the progress you had in the beginning. I made that error myself. Better stick to the roots. CSS has become so infinitely better that there is no real need to lock yourself in a toxic relationship.
Frameworks and libraries will betray you.
SCSS is the next on my list to eliminate.
Agree with everything. When I started programming I was making sorting algorithms and asking for memory allocation in C, then I just typed .sort and left the garbage collector to work it's magic. Now I just ask ChatGPT what to do XD. I don't miss those days but I'm glad I started there to get a better grasp of what's underneath.
Oh my goodness! Finally, someone said it! Thank you, Kevin, for saying it!
Every DEV on every team on every program on every project on every invading UFO from every alien planet everywhere needs to hear what you just said (and wrote in your news letter).
Seriously, bro. This should be required reading/listening/watching for every DEV class worth paying for.
Remember 'Macromedia' Flash/ActionScript? Really fun making all those cool (inaccessible) Flash intros... but they all went the way of the Dodo because they were dependency based (not native to the browser). Thus replaceable with the next shiny object and promises of DEV nirvana...
Hmmm... sort of how JS frameworks are replaceable today.
Just sayin... want your code to last? Go native!
Great post. Wish I could like, follow, and sign up for the news letter more than twice...
Thanks for this video, reached me just in time.😊
Can't be any more accurate, thanks Kevin!
Well, I still use JavaScript almost exclusively for DOM manipulation, and when I started out vanilla JS just confused me. A coworker then told me something along the lines of „just use jQuery“ and so I did. I found it to be much more readable and understandable and it helped a great deal to understand how to use JavaScript in general. Some time ago I switched back to vanilla JS know how to do everything I need. But all in all I would say that I took the right path for me by learning jQuery first 😅
Thank you for teach us css cores it is great. But just wondering which css framework do you prefer in your projects?
Always appreciate your videos, love to see more js videos from a mentor like you.
Great points. Please keep it this way :)
Love this! I think it’s sad that so many developers tout using Tailwind. I get it… it makes things a little faster. But I love making my own design systems from scratch. I love the craft. It’s the same reason I didn’t ride my bike with training wheels when I was a kid. Sure, you’ll fall and get hurt, but each of those moments (hopefully) teaches a valuable lesson.
Great message and video!
Sir. You speak much truth. Thank you.
Your content is awesome and I was surprised how many people are not familiar with CSS...
I am a hobbyist web dev (I am a developer by profession but not web, I work in data), however one of the "quirks" of being me is my desire to understand everything from the flat basics. If a pipe is leaking I don't just want to know what will make it stop, I want to understand the flow, the structure, why it could have even ended up leaking etc. This can be an issue in a lot of ways because it means I don't just do a 5 minute job, I take several hours learning seemingly irrelevant things just to make something basic. Whilst there's people out there with several finished website, my website is still Under Construction as has been for a long time.
However, one big benefit is exactly what you take about here, I understand coding logic really well (a mix of wanting to learn everything and also doing around 10 different coding languages). I'm incredibly good at recalling specific info and debugging within a language. I've had several practising web developers be stuck on a project in something I've never used, but with my knowledge of base JS I was able to logic it out and solve it for them within a few minutes, it's one of my big strengths despite all the weaknesses of this approach. And I think that's why learning these basics is so important, because I can just look at the code and know what it does. Then once I was doing a React course, I absolutely flew through it because I already knew the logic, I just needed to know the React syntax.
I'm not saying things are easy for me, there's still some deeply complex logic that I have to sit and untangle, but at least the language is never the problem. If I was asked to create a React component to do something, I would know which bits need to be regular JS and which bits are React syntax. And I think exactly the advice you give here is the reason I can so quickly pick up things now, because I put in that massive chunk of extra time early on when everyone else just wanted to pump out finished projects. I think you still need a balance (unless you're a hobbyist projects still need to be completed after all) and you can absolutely specialise in a framework if you wish, but please make sure you learn the basics first so you don't have the issue of just copy-pasting code, not understanding what it actually does and then having to try debug something you don't get.
The reason I watch your channel is because you teach this way.
I'm agree with you but for people already master HTML CSS and JavaScript? You can teach react too or tailwindcss for work easier and more fast. I'm talking about tutorial for senior développer or just for improve productivity. You are a good instructor and I know you can always deliver great content. 👍
JQuery did actually have some completion in the early days from Mootools. It was a bit like the VHS vs Betamax wars (for those of us older to remember). I went with Mootools for many years and still maintain it on legacy projects.
I totally agree. However, I never would have been able to get over the hump of learning the basics before learning how to practically build an app. If you want to join learn the framework and go back later and fill in the basics then do that. It's really easy after the fact to look back and think you should have learned the basics first, but if that would have kept you from breaking in to start with then it wouldn't have been the right path.
Something that you didn't say but I think really stands out in your content is how pedagogical it is and how distracting it would be to introduce a tool in these videos.
It can actually be a problem. People learn for example to couple the UI layer and the data layer when watching tutorials on state management in React, because introducing the indirections necessary to avoid coupling would be a distraction (the learner is already learning something new, they are already confused, why confuse them even more by having to explain more code?), but because the learners do not spend the time learning the basics of computer science, they never learn how to do things "properly".
Great video. Thank you for sharing.
In this spirit of this video, I trust you and would also like to hear your opinion on the pros and cons of adding these frameworks on to our vanilla JS and CSS knowledge, especially Tailwind and other CSS-as-a-thousand-classes libraries.
a great teacher! ❤ thanks for standing tall 🔥
BTW which frameworks you use regulary... or use own written html css and js?
What about when CSS modules are a native thing (`with/assert { type: 'style' }`)? With those, HTML & JSON modules, and custom elements, I can see a mind-blowing tutorial showing off what native can do (and pretty easily).
Frameworks are only a tool to make your work easier, but in the end it's still *you* who has to do the work. If you don't know web technologies, React will not help you, the same way buying an expensive car won't teach you how to drive (and will only bring regrets when you crash it). When you learn the basics of the craft, it will be really easy to pick up the tools, but when you learn the tool, it will be hard to learn the craft itself.
I totally agree. I even think that using these frameworks bugs me with more effort in learning things that vanilla, with a little bit more elbow grease, already provides.
The issue with most FE frameworks is they are just JS with some boiler-plated overhead, yes it is nice we do not have to do most of that boilerplate everytime.
Most of everything I used to use Jquery for back in the day can be done in JS now.
because you are an awesome teacher which focuses on basics 😀.
JQuery is still quite popular according to the stackoverflow survey. I've switched to mostly vanilla years ago due to different libraries and frameworks never doing quite what I need and I was fed up with having to bend them to my will and then there's all the extra bloat. I got rid of almost everything and performance is way up and projects are actually simpler. I do still use JQuery (NOT jquery ui) as I do actually still find it quite handy.
Also, the most important part. You are master of HTML/CSS/JS, and in my opinion, the top of the top TH-camrs in CSS content. I believe most of us looking up your videos for this reason. I'm sure you could teach React decently well too, but there might be others who are better in that specific library. There is nothing bad about specialising on something as a content creator.
I spent some time learning vanilla CSS, and now I am able to help my colleagues with that easily