Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Aurelian Spodarec
Aurelian Spodarec
10,801 Points
Posted by Aurelian Spodarec
Aurelian Spodarec
10,801 Points

What are good ways to code with CSS?

What are good ways, that you can maintain CSS? Like BEM? etc..

I want to make a website, that is good CSS, that is maintenable, but im strugling on how can i achieve it.

I can do hTML and CSS etc.. but it wont be clean. It will be messy, My code is organized.. but it's messy, class names this that etc..

If you are going to point me to a TTH vidoe, I watched them. Something from your experience woudl be good, or if you have a middle/big project, even small, on github maybe, that is a good coded project, without frameworks i can have a look plesae?

2 Answers

Adam Duffield
Adam Duffield
30,494 Points
Adam Duffield
Adam Duffield
30,494 Points

I've found that managing your CSS with gulp/grunt can be incredibly useful e.g. Have a source file full CSS partials that you can compile into one minified CSS file for your main project. That way your code is modular depending on what it is used for but still efficient when it comes to putting on your live site.

I also use BEM which is a great standard to stick by. If you want to go even deeper into having good CSS code check out CSS style standard guides. Other than that there isn't much more you can do, programming in general is messy, best you can do is name things well and make the logic easy to follow and find. :)

See airbnb's github for some style standards, they really know what their doing!

https://github.com/airbnb/css

Aurelian Spodarec
Aurelian Spodarec
10,801 Points
Aurelian Spodarec
Aurelian Spodarec
10,801 Points

You can cleary see the difference no lol if you look at this for 30 sec, and that's what im striving it to be. Bare in mind that im new as well lol so i need to code it, before using gulp and stuff.. i mean, there is going to be too much. I use HTML/CSS and Sass now

https://youtu.be/dzBbmq2nnoc?t=4m38s

Then you can see what im striving for, and below there are mine one, airbnb is when i started

Well, if you Look at this, look at config file here and other things https://github.com/AurelianSpodarec/hcBEMpractice1

https://aurelianspodarec.github.io/hcBEMpractice1/

ANd compare it to aribnb code https://github.com/AurelianSpodarec/sassairbnb

https://aurelianspodarec.github.io/sassairbnb/

Adam Duffield
Adam Duffield
30,494 Points
Adam Duffield
Adam Duffield
30,494 Points

I'm not 100% sure what your after but judging by the YouTube video it sounds like you might benefit from a case framework like bootstrap or foundation?

If not take a look at one of my recent projects and see if it helps in any way :)

https://github.com/ajduff14/govuk-assessment/tree/master/src/sass

Aurelian Spodarec
Aurelian Spodarec
10,801 Points
Aurelian Spodarec
Aurelian Spodarec
10,801 Points

I can use framewokrs, but the point is to be able to build a framework like bootstrap, to be able to write perfect CSS without framework. I want to learn.

But yeah, somewhat like your project.

DO you have middle/big proejct that you have coded pure CSS but are well coded?