diff --git a/content/posts/css-is-fun.md b/content/posts/css-is-fun.md index a3c5dab..b478960 100644 --- a/content/posts/css-is-fun.md +++ b/content/posts/css-is-fun.md @@ -12,22 +12,23 @@ CSS is something that web developers often don't really like or understand. It's ## Why use CSS? -First, why would you use CSS instead of the fancy frameworks that already exist, like [tailwind](!todo). To be fair, I haven't used tailwind a lot in my life and my experience with it mostly was following tutorials. But ask yourself: is `` really more clear than `body { margin: 4 }`? Both of these do exactly the same thing, but one is way more verbose and explains itself. For the tailwind version, you should know that you've set the margin to 4. +First, why would you use CSS instead of the fancy frameworks that already exist, like [tailwind](https://tailwindcss.com/)? To be fair, I haven't used tailwind a lot in my life and my experience with it mostly was following tutorials. But ask yourself: is `` really more clear than `body { margin: 4 }`? Both of these do exactly the same thing, but one is way more verbose and explains itself. For the tailwind version, you should know that you've set the margin to 4. CSS can also be used in static sites easily, just have a stylesheet and reference it from your HTML file. You don't have to do any preprocessing[^2] and can serve everything through a simple webserver. Lastly, it's one of the core web technologies. Learn your tools and become familiar with them! ## How to learn -My favorite way to learn CSS is just by using it. I'm in no way an expert like [Josh Comeau](!todo) or [David Bushell](!todo), but I've taught myself most of my basic CSS knowledge through [The Odin Project](!todo), which is an awesome learning tool for all web development. After that, you can just use it a lot in building your own site(s) and finding more and more snippets and knowledge through use. I have built this site through a lot of flexbox use and it is actually quite simple if you understand the methods. +My favorite way to learn CSS is just by using it. I'm in no way an expert like [Josh Comeau](https://www.joshwcomeau.com) or [David Bushell](https://dbushell.com), but I've taught myself most of my basic CSS knowledge through [The Odin Project](https://www.theodinproject.com/), which is an awesome learning tool for all things web development. After that, you can just use that knowledge for building your own site(s) and finding more and more snippets and tricks through use. I have built this site through a lot of flexbox use and it is actually quite simple if you understand the basics. -Understanding what you're writing also helps with learning new things. I've just run in to this fun post on the "full-bleed" layout by [Josh Comeau](!todo), which looks kind of amazing[^3]. You can follow along and learn a lot of new technologies by reading these posts and just have fun with CSS that way. +Understanding what you're writing also helps with learning new things. I've just run into this fun post on the "full-bleed" layout by [Josh Comeau](https://www.joshwcomeau.com/css/full-bleed/), which looks kind of amazing[^3]. You can follow along and learn a lot of new technologies by reading these posts and just have fun with CSS that way. ## Conclusion -CSS is one of the core citizens of web development, together with javascript and HTML. By learning it, you can deepen your knowledge on web development and just do a lot of cool stuff. CSS allows you to do so much awesome things and it is way more verbose than things like tailwind. By using it you can understand the underlying technology better and don't have to document what every `p-*` and `m-*` means. CSS just explains it for you (thanks, earlier you!). +CSS is one of the core citizens of web development, together with javascript and HTML. By learning it, you can deepen your knowledge on web development and just do a lot of cool stuff. CSS allows you to all this and is way more verbose than frameworks like tailwind. By using it you can understand the underlying technology better and don't have to document what every `p-*` and `m-*` means. CSS just explains it for you (thanks, earlier you!). -If you're already so familiar with these simple frameworks, keep on using them! Nobody is forcing you to do anything, but just know what is under these abstractions you use day-to-day, and perhaps experiment a bit on your personal stuff (or just create a toy site). +If you're already so familiar with these simple frameworks, keep on using them! Nobody is forcing you to do anything, but just know what is under these abstractions you use day-to-day, and perhaps experiment a bit on your personal stuff (or just create a toy site). Have fun with web development (and other places[^4]) [^1]: "Try to center a div", it can be solved in a lot of ways. Try it yourself! [^2]: In my case this is somewhat of a lie, as I use sass as a CSS preprocessor. [^3]: I _really_ don't need to redesign my site for the umpteenth time... +[^4]: Things like [waybar](https://github.com/Alexays/Waybar) and [rofi](https://github.com/davatorium/rofi) also use css, which makes your skills even more useful.