Greetings fellow developer, how are you? Hope you all are doing great :)

Today, I'm gonna talk about CSS! Almighty CSS, every developer's worst nightmare. OK, maybe not the worst but let's admit it, CSS is wearisome if you are a beginner who does not have much experience writing CSS.

Let’s Start

1. When developing applications, always try to do a mobile-first approach. And then optimize it for desktop, believe me, it will be easier.
2. Try not to nest classes while writing CSS inside the stylesheet, writing CSS for one class only is good.

3. Keep your magic numbers & values inside CSS variables (such as
colors, margin, padding, font size, etc).

4. The above point will also help you in creating themes based on your
current CSS, just change the variable values and VOILA! there you have
yourself a new theme.

5. Keep the spacing consistent throughout the app.

6. Use vanilla CSS as much as possible.

7. Try not to use "px" for spacing and sizing, instead use "rem" and "em"
for responsiveness ("rem" is more preferred).

8. Use a consistent naming convention for your classes (for better DX).
You can either create and follow your own naming convention or use
pre-existing conventions like BEM notation.

9. While writing an app keep in mind to give equal importance to both
UX and DX.

10. While approaching a complex design, first take your time and identify
your components:

• Components that are not going to be in normal flow i.e., components having position: absolute and position: fixed;
• Container components that are uni-directional will use display: flex;
• Container components that are bi-directional will use display: grid;

And then plan your approach accordingly.

That's all for now! I hope this helps somebody.

Happy Coding (●'◡'●)

Help me buy some books?