Hey everyone! I'm a total beginner, and I need some advice on my CSS organization. I've been learning from an old coding book my dad left behind, and I'm working on a web project called "Obscuria Terminal" (I know, a bit dramatic!). Instead of using one large CSS file, I ended up creating multiple smaller files like `header.css`, `utilities.css`, and `modals.css`. I'm wondering if this is overkill for someone just starting out. Is this a normal practice among developers, or am I complicating things? Would it have been better to stick with one file or break it up differently? I'm just trying to avoid picking up bad habits early on. Thanks for any tips!
4 Answers
Your approach seems really organized! The only thing to consider is that having lots of separate CSS files can make it tricky to spot styling conflicts since classes might be spread out. One tip is to prefix your class names with the component they're associated with. For example, start button classes with "button-" to keep things clear.
You’ll know if you’ve overdone it when you come back weeks later and curse the person who split everything up! That said, splitting files can help you think in components, which is super helpful. Modern frameworks tend to do this too, organizing CSS, HTML, and JS for each component separately. If it helps you navigate your project better, you’re on the right track!
I love your story and the project name! Your sense of organization is great, which is essential in coding. Today’s tools like TailwindCSS change how we write CSS, but it’s totally fine to stick with vanilla CSS if that's what you're comfortable with. Just keep in mind that having many files means the browser has to fetch them individually, which isn’t the most efficient. But honestly, the organization benefits often outweigh that concern!
I mostly work in backend, but honestly, your structure looks solid compared to many projects I've encountered. If I can make sense of it quickly, that’s a big plus!
Thanks for the positive feedback! Can I ask why you prefer backend over frontend?
Totally agree! Using a methodology like BEM can really help with organization.