Painless CSS with Sass & Compass

Nov 1, 2014 · Torrance, United States of America

This 7 hour course, geared toward both designers and developers, teaches you how to write smarter, cleaner, more efficient cross-browser CSS with Sass & Compass.  Through lecture, hands-on labs and code examples. you will learn how to utilize the power of both Sass and Compass and how to generate optimised css output to use on your web projects. 

WHAT IS SASS

CSS on its own can be fun, but stylesheets are getting larger, more complex, and harder to maintain. This is where a preprocessor can help. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty goodies that make writing CSS fun again. Once you start tinkering with Sass, it will take your preprocessed Sass file and save it out as a normal CSS file that you can use in your web site.

WHAT IS COMPASS

Compass is a framework for your CSS that resolves some of the problems with the language. It also includes a few tools to make development faster and easier:
• Like Sass, Compass supports variables, mixins and nesting;
• It provides a whole range of helper functions for images, colors, typography and more;
• it supports mathematical calculations;
• it helps ensure cross-browser compatibility.

Full Stack Development expert Rob Davarnia will teach you everything you need to know about these CSS tools and how they can help simplify your workflow and make writing CSS fun again.  Also learn how to automate your workflow with Grunt.js, scaffold your HTML, modularize your Sass with partials, and get started styling with variables and mixins.

This course is designed for the absolute beginner, meaning no prior knowledge of Sass or Compass  is required, however a fundamental understanding of CSS and HTML are recommended.

TOPICS THAT WILL BE COVERED INCLUDE:
• Introduction to Sass
• What is Sass?
• What is Compass?
• Installing Sass and Compass
• Using Grunt to work with Sass and Compass Projects
• Setting up a workflow with Grunt.js
• Folder Structure
• Using npm / package.json
• Create automated tasks
• Watch for changes
• Setting up browser reload
• Setting up a Sass and Compass project
• Working with Sass
• Variables And Nesting
• Custom variables containing colors, and other details
• Style nesting
• Partials And Import
• Modularizing Sass with partials
• Partials and Code Organization
• Mixins
• Reuseable components using mixins
• Inheritance
• Sharing sets of CSS code to keep Sass DRY
• Media Queries with Sass and Mixin
• Create optimized media queries with Sass respond-to
• Using Compass mixins 

PREREQUISITES

All attendees should have some experience with HTML prior to the training. Prior programming/scripting experience is helpful but not required. 
HANDS-ON/LECTURE RATIO

This class is 80% hands-on, 20% lecture, with the longest lecture segments lasting for approximately 10 - 15 minutes. Students "learn by doing" with immediate opportunities to apply the material they learn to real-world problems.
SYSTEM REQUIREMENTS AND DEVELOPMENT ENVIRONMENT 

Participates should bring a laptop/notebook computer.  Mac or PC with any modern web browser installed and working wireless capabilities. 



THE INSTRUCTOR

Rob Davarnia is a Software Developer in Orange County, California. He has worked with several global organizations helping them improve system scalability.  Rob has a B.S. in Computer Science and has given talks at multiple Code Camps and tech gatherings. Rob's is highly skilled in HTML5 and CSS3. His other skills include MongoDB,jQuery, Node.js, Backbone.js, PHP, C++, Java, Javascript, Objective-C, git, WordPress and Joomla.

Event organizers
  • Code District

    Code District provides innovative, technology training in high-demand skills ranging from web and mobile development to social media marketing and more. All our classes and workshops are instructed by industry professionals.  LOOKING FOR  NEW CAREER OPPORTUNITIES.  WE CAN HELP! At times Code District has knowledge of career opportunities within Web Development and other technologies.  If you...

    Recent Events
    More

Are you organizing Painless CSS with Sass & Compass?

Claim the event and start manage its content.

I am the organizer
Social
Rating

based on 0 reviews