Creating New Projects With Google's Web Starter Kit [Guide]

Google have just released a boilerplate named Google Web Starter Kit. Web Starter Kit is aimed to help web developers to start a new web development project quickly. Google Web Starter Kit features It contains powerful tools such as BrowserSync, LiveReload, HTTP Server, PageSpeed, ImageMin, Sass Compiler, JSHint, and a couple of templates that we can use to develop web applications that works in multiple devices. Let's take a look to see how we can start using the Web Starter Kit.

Getting Started

Google Web Starter Kit can be downloaded from Google Web Starter Page and you can use it right away. But to make use of the tools that comes with it you will have to install the following tools. First, ensure that you have installed NodeJS, which is required to run a number of Gulp tasks including PageSpeed, ImageMin and JSHint. Since Web Starter Kit uses Sass to compose the CSS, you'll also need to install Ruby and Sass. Lastly, you will also need to install Gulp. Web Starter Kit also comes with a number of Gulp plugins that automates development tasks. All Gulp plugins are pre-configured within gulpfile.js which can be found in the Web Starter Kit root directory. To install Gulp, use the command below.

 npm install gulp

Once all these tools are set, we can start using the Web Starter Kit.

Using Web Starter Kit

As mentioned, you can download Web Starter Kit from Google Web Starter Page and extract it to your desired folder. Another way you can get the kit is to u [...]