imf-mm-api Website

nav: | API docs | Demo | Documentation | IMF Tool | Website docs |

Overview

This website is predominantly statically hosted on Amazon S3 and dynamically distributed using Amazon CloudFront. API endpoints are served using AWS Lambda and the whole thing is generously provided by the wonderful project partners at AWS Elemental to whom we are grateful.

imf-mm-api Website Structure

graph TD dns(AWS Route 53) cloudfront(AWS CloudFront) s3media(S3 Media Bucket) s3web(S3 Web Content) staging(Staging Lambda Endpoint) beta(Beta Lambda Endpoint) production(production Lambda Endpoint) dns == requests ==> cloudfront cloudfront -- web requests --> s3web cloudfront -- /media --> s3media cloudfront -- /staging/req --> staging cloudfront -- /beta/req --> beta cloudfront -- /1/req --> production

 

imf-mm-api Website Source

All the static sources for the site are located on github, along with the scripts for publishing to the s3 origins. This repository is private until late April when the project has been checked and will then be made public.

Cuttlebelle Engine

All the static pages authored in markdown blocks and rendered with Cuttlebelle that uses React to render each block. Blocks are pulled into pages via a yaml metadata file that encourages block re-use. The github repository shows the structure of the cuttlebelle content folders.

Mermaid diagrams

Diagrams are rendered in your browser using [svg] with flowcharts, sequence diagrams and gantt charts being rendered using the [mermaid] browser library to convert text into diagrams. This makes it easy to keep the website in github and automate deployment. Basically it allows the maintainer (me) to be lazy.

Site Automation

If you download the source, then you'll need some AWS keys to upload the generated content to a bucket. The gulpfile.js contains all the logic needed to automate site generation.

  1. install node v8.x or higher
  2. install cuttlebelle globally
  3. clone the github repository
  4. install development dependencies with npm install
  5. launch the local watch / preview environment cuttlebelle watch
  6. fiddle with pages
  7. gulp publish to push HTML to the s3 bucket specified in gulpfile.js
  8. gulp lazygit to check changes into github