Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I'm learning SASS and now I'm only reading sometings about it. When I should use it in my projects?
Is there some tricks about it? For example,
If lines of CSS file(s) are more than X,
If small,medium,large project,
If there are more than X class, field, id etc.
Because now I'm using only CSS3 for my projects and it seems enough for me.
Because SASS compiles to CSS, it cannot style to any greater degree than will normal CSS.
The reason to use SASS is to structure your stylesheets. SASS allows you to use mixins, variables, and functions, which allow you to DRY (Don't repeat yourself) up your code.
In the beggining with precompilers like Sass I used only minimum of functionality like nesting, variables , imports , some mixins.
Preprocessors don't learn you to write better code, it only ease the structuring , organization and can help you DRY your code.
Allways check output when you starting with preprocessors because you can bloat your CSS if you are not careful enough.
I use Sass in all project big and small and my favourite functionality is importing.
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 6 months ago.
Improve this question
I started working on an app made with tsx. This app has a general stylesheet for everything and some of the components have inline styling. Personally it feels disorganized.
I'm a biginner at css so I don't know what would be the best way to aproach this. I thought of two options: do all inline styling or make a stylesheet for each component. The first feels wrong ,in the second I'm gonna end up with 30 stylesheets and the overrides are going to mess up everithing.
The styled-components library is universally popular and you'll find plenty of support from the large community that uses it. With this you can write your css inside your component files. I'd also recommend getting the VS-Code extension for it so that you get css intellisense.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
Does anybody know how how browser reading SASS? I learned how you can make sass file or how you can convert .css file in .sass and than compile it in new .css file that's more or less clear to me. But in the end you're getting new .css file again and than you include it in html. So whats happen with .sass file where, in which moment (if is there any) he becomes active during page-rendering process?
SASS is a CSS pre-processor scripting language or you can say it is a scripting language that is interpreted into CSS and SASS is NOT used by browser during page rendering instead the generated CSS is used by the browser for rendering styles of the respected page.
SASS is scripting language which has programming features like any other programming or scripting language like javascript, python, etc. It has loops, conditional statements, functions which can be used like any other programming language.
In SASS power and advantages of programming techniques are used to write style sheets more efficiently and quickly.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I'm always looking to learn from the best and ensure coding quality.
When it come to CSS styling within my responsive designs, my custom CSS style sheet can get a bit overwhelming. Constantly hitting ⌘ + F (Control + F) to locate my classes.
I could split sections of my classes into multiple style sheets (for example: media.css, typography.css etc...) however I believe calling into to many style sheets may jeopardise performance.
What are the best practices in keeping your CSS organised and well manageable?
Keep in mind that the file structure for production does not necessarily need to be the same as development.
Split up the files logically in development and group them together as needed for production. How the files are organized totally depends on your project. Of course, this implies that you have some sort of deployment pipeline in which to concatenate the files. This is not always feasible for small websites. There are hacky ways to glob files dynamically at runtime on the server, but that adds latency to the total request time.
One important advantage to this is reusability of common styles. You could have style libraries that are included in multiple stylesheets. When you need to change the core library, you're making the change in one place as opposed to many.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 1 year ago.
Improve this question
I am a developer and I am trying to understand one thing... how does the Sass processor fit into the day to day design/development workflow?
Without it it was something simple like saving the CSS file and refresh the page.
But if you use, let's say, something like SASS, how does it change?
If I got it right:
You write your sass files on your favourite text editor
Process it in some way
Check the results on your localhost (or wherever you have the development version)
Is this how the workflow is with Sass or another CSS pre-processor? And if it is, isn't this time consuming?
Great question. At first SASS can seem to be time consuming but after a little while you truly see the benefits.
You need to work locally (which I recommend anyway) and I use Koala (http://koala-app.com) which processes by SASS file into CSS every time I save. You still link your css in exactly the same way so when you are ready to deploy, you just do it the same where you've always done it.
CSS preprocessors are the demand of the day. They give you the benefit of Variables, Partials and Nesting(VPN as I would call).
The code is written in Less Or Sass and then compiled into .css files using grunt and compass. You can keep a watch to see if the file(s) is/are being changed at any time. Just typing in this command will help
sass --watch input.scss:output.css
Pre-Processors help in the long run as long code manipulation needs more time and effort and is mistake prone. Definitely, Pre-Processors are better
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I just started using css less and thinking about which way is better: include less file to page with less.js library or convert less into pure css and include that file to a page.
Which way do you use and think which way is better?
I would compile the less to css and implement the compiled file to my site. I think this is the usual way to do this.
There are a lot of tools for this task. Take a look at compass and/or scout.
Compiling process can also do with commmand line itself or Gruntjs.
All of these tool compiling the less files onthefly.