Key Features

• Create data-intensive, hugely scalable apps utilizing Sass and COMPASS
• Master the innovations of Sass and COMPASS and unharness your strength to increase enterprise-grade apps
• This booklet is an specialists' consultant on leveraging Sass and COMPASS features

Book Description

CSS and Sass upload attractiveness and excellence to the elemental language, and encompass a CSS-compatible syntax with a purpose to use variables, nested principles, mixins, inline imports, and masses more.

This ebook will begin with an summary of the positive aspects in Sass and Compass, such a lot of which you may already be primary; although, it will make sure you recognize what is anticipated because the publication is going deeper into Sass and Compass. subsequent you'll study CSS and HTML recommendations which are important to an outstanding Sass workflow. in spite of everything, Sass exists to simplify writing CSS, however it will not train you the way to make fresh, scalable, reusable CSS. For that, you want to comprehend a few simple suggestions of OOCSS, SMACCS, and Atomic Design.

Once you will have brushed up at the very important options, it is time to write a few Sass. generally you will write a number of services and mixins that actually leverage regulate circulate utilizing @if / @else loops and you can the way to determine whilst and why issues are going flawed prior to they convey you to a cease. relocating additional, you are going to the best way to use @debug, @warn and @error to correctly deal with errors.

You'll additionally find out about Gulp and the way to exploit it to automate your workflow and decrease your repetitive projects. and at last you are going to know about sourcemaps. With sourcemaps, possible write, debug, and examine your Sass and Compass all from in the browser. it will even LiveReload too!

As an advantage, you are going to seriously look into that funky Flexbox, at present all of the rage! you will find out how strong and versatile it truly is, and the way you should use it with Compass. better of all, it falls again very gracefully certainly! in truth, it is easy to use it on any current undertaking with no need to alter a line of the unique CSS.

What you are going to learn

• Master Sass and Compass features
• Familiarize your self with CSS and HTML ideas which are very important for a superb Sass workflow.
• Build real-world web content concentrating on layouts and content material aspects
• Work on a grid approach utilizing Compass and Susy
• Automate your workflow with Gulp
• Write capabilities and mixins to leverage the keep watch over flow

About the Author

Luke Watts is an internet developer and electronic artist from Galway, eire. He began studying website design in 2012 after decades operating with AutoCAD within the production undefined. In 2014 he organize his personal internet improvement corporation referred to as Affinity4 (http://affinity4.ie) in Galway, eire. he's an Oracle qualified MySQL Developer, and an Adobe qualified affiliate (Photoshop and Dreamweaver).

Luke has a prepared curiosity in studying and instructing others. He has written articles for plenty of web content, together with his personal weblog, on quite a lot of topics equivalent to website positioning, WordPress improvement, SVG, Sass, Jade, OOP, Git, Silex, MySQL, and PHP.

Luke is additionally an finished artist, either in conventional mediums (mostly pencil and ink) and in electronic portray. whilst no longer development web pages or writing code he'll probably be engaged on a electronic portray on his Wacom pill utilizing Photoshop or making a 3D version or scene in any variety of 3D modeling applications.

Table of Contents

1. Requirements
2. Sass – the line to higher CSS
3. Compass – Navigating with Compass
4. CSS and HTML – SMACSS, OOCSS and Semantics
5. Advanced Sass
6. Gulp – Automating initiatives for a speedier Workflow
7. Sourcemaps – enhancing and Saving within the Browser
8. Building a Content-Rich web site Components
9. Building a Content-Rich web site – Layout
10. Building a Content-Rich site – Theme