More Cons than Pros of using SASS on a new MVC website?

Pros and more Cons of using SASS on a new MVC website?

I have not used SASS but hear it produces perfect CSS files. One downside is that everyone who needs to create classes must learn the SASS scripting language. Another may be that debugging time is much higher.

Are there, instead, good coding practices that all developers can follow, so they can avoid the negatives of using SASS and get some of the benefits of using standardized CSS?

(I am not sure if the MVC site will use the Razor View Engine, but does this change your opinion of using SASS?)

Thanks
curiouswebsterSoftware EngineerAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Chris StanyonWebDevCommented:
First off, you can write standard CSS in your SASS files. For the most part, SASS is much the same as CSS.

It does however add in some programming style functionality to your CSS ( you can use functions / variables etc). You can also nest your CSS and create a modular CSS systems - create a SASS file for colours / one for layout / one for typography / one for forms elements etc, and compile them into a single, minified CSS fie. In theory, it actually makes handling your site's styles easier (you want to update your sites colour scheme - edit a single color variables file). Checkout the Source code for how BootStrap organises it's SASS files to see this in action.

It doesn't create perfect CSS in the same way that CSS doesn't create perfect CSS.

As for debugging, it shouldn't add any time to your site. If you set it up correctly and add in a watcher, when you change any of your SASS files, it can automatically recompile the CSS.

There is a slight learning curve, but fundamentally it's just CSS, so most CSS devs can adapt pretty quickly and easily.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
curiouswebsterSoftware EngineerAuthor Commented:
What do you mean by Watcher?
Chris StanyonWebDevCommented:
A watcher is a process that runs in the background and keeps on an eye on your files. You can, for example configure it to run a particular script when any .scss files change to recompile your SASS. You can config it to watch js files and concat and uglify them. Config it to watch your images folder to optimize them.
Your Guide to Achieving IT Business Success

The IT Service Excellence Tool Kit has best practices to keep your clients happy and business booming. Inside, you’ll find everything you need to increase client satisfaction and retention, become more competitive, and increase your overall success.

curiouswebsterSoftware EngineerAuthor Commented:
that's a new word for me: uglify

do tell...

is the watcher to help notify other developers that something may have changed?
Chris StanyonWebDevCommented:
haha. It's a great word :)

Basically, it means to minify (reduce the size) or your Javascript files. It removes all unnecessary whitespace and renames variables names to shorter ones. Once it's done, it's very difficult to read (hence the term uglify I guess). Usually, an uglified file has the min added to the filename, so your myscripts.js would normally become myscripts.min.js

A watcher isn't to tell other developers that files have changed - it's used to trigger an action (such as running a SASS compiler / JS Uglifier / CSS Minifier) automatically. It's kind of like an automated build tool.

Usually, you'd use a version control system (such as Git) to inform developers that files have changed and keep everyone in sync.
curiouswebsterSoftware EngineerAuthor Commented:
thank you.
Chris StanyonWebDevCommented:
No worries
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.