You do not have Javascript enabled. Some elements of this website may not work correctly.

These are useful resources for getting up to speed with our various tech projects

[toc]

General

CEA Code

Static Sites

In general, CEA websites that are mostly static content (i.e. are not web apps) should use the Contentful/Metalsmith/Netlify stack. This stack ensures good separation of concerns, keeping raw content hosted on Contentful, site generation using a Metalsmith build script,

Boilerplate

Contentful

Contentful is an API-first content management system. It's the platform we use to host all of our web content, including all page content (in Markdown format) and static assets (mostly images, but also PDF files etc.)

Static Site Generator (Metalsmith)

Metalsmith is a pluggable static site generator that we use to bring in data from Contentful, and transform it into a folder containing HTML files and other static content (e.g. CSS, JavaScript, JSON etc).

Technologies used in the static site build chain

  • Browserify - script bundler for taking a Javascript file using CommonJS modules (i.e. ones loaded with require() calls) and bundling them into a single script that can be used in browsers (which don't support require())
  • SASS - CSS preprocessor supporting variables, calculations, partials, mixins etc
  • Pug - Terse templating language for writing HTML templates
  • Markdown - Minimal formatting for writing text (note that Markdown has a very minimal specification and that parsing varies between implementations — CEA sites use MarkdownIt parse with HTML disabled by default)

Some important modules to be aware of that are used in the boilerplate:

Netlify

Netlify builds, deploys, and hosts our static sites. It takes a build script hosted in a GitHub repo, installs the required dependencies, runs the build script, and then deploys the resulting static site to a fast CDN.

Tooling