Before we get started, please refer to the http://foundation.zurb.com/develop/download.html webpage.
You will see that there are four versions of Foundation: complete, essentials, custom, and SCSS. We will be using the complete version for the first parts of this book. But let's talk about the other versions. The essentials is just a smaller version of Foundation that does not include all the components of the framework; this version is a barebones version. Once you are familiar with Foundation, you will likely only include the components that you need for a specific project. By only including the components you need, you can speed up the load time of your project and you do not make the user download files that are not being used by your project. The custom version allows you to pick the components and basic sizes, colors, radius, and text direction. You will likely use this or the SCSS version of Foundation once you are more comfortable with the framework.
The SCSS or Sass version of Foundation is the most powerful version. If you do not know what Sass is, it basically gives you additional features of CSS that can speed up how you theme your projects. We will be covering Sass later in this book. There is actually another version of Foundation that is not listed on this page, which can be found by hitting the blue Getting Started option in the top right-corner and then clicking on App Guide under Building and App. You can also visit this version at http://foundation.zurb.com/docs/applications.html. This version is the Ruby Gem version of Foundation, and unless you are building a Ruby on Rails project, you will never use this version of Foundation. Zurb keeps the gem pretty up to date, you will likely get the new version of the gem about a week or two after the other versions come out.
There are other versions of Foundation that people have ported to other languages, frameworks, and content management systems, and we will cover some of these at the end of this book.
Alright, let's get into Foundation. If you have not already, hit the blue Download Everything button below the complete heading on the webpage.
We will be building a one page demo site from the base Foundation theme that you just downloaded. This way, you can see how to take what you are given by default and customize this base theme to look anyway you want it to. We will give this base theme a custom look and feel, and make it look like you are not using a responsive framework at all. The only way to tell is if you view the source of the website. The Zurb components have very little theming applied to them. This allows you to not have to worry about really overriding the CSS code and you can just start adding additional CSS to customize these components.
We will cover how to use all the major components of the framework and by the end of the book, you will have an advanced understanding of the framework and how you can use it on all your projects going forward. The idea of this book is to give you a real-life example and show you how you can manipulate the framework to build any type of web project or app that you throw at it. Foundation has been used on small-to-large websites, web apps, at startups, with content management systems, and with enterprise-level applications.