isabella232 / ffd-microsite

An informational website about the Federal Front Door project.

Federal Front Door Microsite

This repository contains the files and infrastructure to run the Federal Front Door Microsite.

Section	Description
Installation	Installing the project locally.
Development	Development workflow using gulp.
Deployment	Automated and Manual deployment information using cloud.gov.
Contributing	Contributing to the project.

Installation

The development for the microsite has the following dependencies

• Hugo, a static-site generator written in Go.
• Gulp, an automation tool for asset-pipelines.
• NodeJS
• Ruby

This documentation assumes that you have Ruby and NodeJS installed on your machine. Instructions for installing node, and npm, [can be found here] node-install.

Installing Hugo

In order to serve the microsite locally, you will need to install the hugo command-line tool. This can be installed easily via Homebrew on Mac OS X with the following command in your Terminal.

brew update && \
brew install hugo

You can also download the latest release and checkout the quick start guide for further instructions.

Installing Gulp

In order to build the assets for the microsite, you will need to install the gulp command-line tool.

npm install --global gulp-cli

Installing SCSS-Lint

The Sass file linter uses the Ruby gem scss_lint. This gem must be installed on your machine in order to run any tasks that depend on the scss-lint binary.

gem install scss_lint

Development

Once gulp is installed globally, navigate to this directory in your Terminal and tell npm to bring in the asset-pipeline's dependencies.

npm install

Once that is complete, run gulp in your Terminal to get a list of tasks.

$ gulp

  Using gulpfile ~/Developer/ffd-microsite/gulpfile.js
  Starting 'default'...
  v1.0.0 ffd-microsite
   ______ ______ _____
  /\  ___/\  ___/\  __-.
  \ \  __\ \  __\ \ \/\ \
   \ \_\  \ \_\  \ \____-
    \/_/   \/_/   \/____/

  Available tasks

  ...

To start the local webserver and have gulp watch for changes:

npm start

Descriptions for optional gulp [ flags ] task prefixes

These flags are 100% optional and can be omitted from any tasks that are affected by them.

• no-test This flag disables linters and tests for all assets.
• production This flag enables minification and compression of all assets in prep for a production environment.

Deployment

The microsite is deployed on [cloud.gov] cg-homepage. To read the cloud.gov documentation, [click here] cg-docs. The documentation below makes the following assumptions.

• Assuming you have the cf binary installed on your machine and within your $PATH.
  • [Please read Setting up the command line] cg-docs-cli-install for more information.
• Assuming that you have a cloud.gov account.
  • [Please read Setting up your account] cg-docs-cg-account for more information.

Automated deployment

This project uses [Travis-CI] tci-homepage for continuous deployment. Our current process deploys our staging branch and our master branch to their own [staging] ffd-staging and [production] ffd-production URLs.

Manual deployment

Using the cf command-line tool, you can run a manual deployment to either staging or production by targeting the corresponding organization / space and as long as you have access to cf push the target. More information on deploying to cloud.gov can be found [here] cg-deploy-hw and [here] cg-deploy-ss.

Manual deployments are not necessary as all deployments should go through Travis-CI.

To check which space you're targeting using the cf command-line tool, type the following in your terminal.

cf target

Building the microsite locally

Building the microsite locally can be done with the same command that runs in Travis-CI. Type the following in your terminal.

npm run build

Pushing to a target

Once the microsite has been built locally by running the above command, you can push your changes up to the targeted space. Type the following in your terminal.

cf push