For my last 2 personal projects I really dove into CSS a bit more, some Vanilla, some using TailwindCSS <- which honestly offers great documentation if you just want to learn Vanilla as well.
By developing my own structure and I have been able to have a better understanding of how some of the most frustrating features can be made simple. Flexbox for example, extremely easy to use if you follow its conventions and patterns.
It is very easy and convenient to use free TailwindCSS component websites or Bootstrap, and to be honest thats where I started but that is also how I really dove into figuring out what all those little lines of code did to my div.
Structuring your own CSS also allows you to plan ahead for your data structure without having to debug this complex component that was given to you.. <- this gets easier to debug as you learn the syntax of Tailwind, its more of a trail and error learning approach.
One piece of advice that really helped me was setting a border around the structure you're rendering. <- Proven to be really helpful when managing div structure i.e.
By no means I'm trying to tell you I am a CSS guru but I have been able to have a much more pleasant coding experience. I do most of my styling as I go. This allows me to really get a feel for how the data looks instead of getting all my functionality and then having to refactor all my code to make it look like I want. <- This is where I see most developers frustrated.
My advice:
Learn Vanilla CSS, pick one element you want to render across all your project (a button is a good example) and Vanilla that guy!
Use TailwindCSS resources; MerakiUI, SailboatUI, & DaisyUI for example are great for quick component libraries, but I challenge you to read and understand the syntax here. This is where CSS is awesome for me. Not having to jump to a .css file to make quick rendering features happen.
Hope you liked this post!
I am always open for suggestions and constructive criticism, so feel free to drop a comment below 👇
Top comments (2)
As someone who weirdly enjoys the weirdness of CSS, I love the sentiment of this post!
For anyone coming to this post to learn CSS, I suggest the brilliant Kevin Powell. He helped me get into working in vanilla CSS for most of my website projects, though when I need to work fast bootstrap is great too!
As CSS can be a little finicky when working with, knowing how to deal with it and have knowledge in how it works can be a great help! thank you for posting!
thanks for the reply and sharing the resource. Cheers