ft-interactive/trump-100-days-market-reactions-timeline

Name: trump-100-days-market-reactions-timeline

Owner: FT Interactive News

Description: null

Created: 2017-04-21 15:19:59.0

Updated: 2017-05-04 15:36:40.0

Pushed: 2017-10-20 13:03:00.0

Homepage: https://ig.ft.com/trump-100-days-market-reactions-timeline/

Size: 493

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

Starter Kit

A template for IG projects ? everything you need to build a standalone front end app (including some basic FT page furniture), configured to automatically deploy to the web.

–

How to use

Getting started

To start a new project based on Starter Kit, run this setup script in your terminal:

 "$(curl -s https://ig.ft.com/starter-kit/install)"

What the setup script does:

• Asks you a few questions about your project (e.g. title, description).
• Clones Starter Kit to your own computer (but reinitialises it as a brand new git repo with no history).
• Attempts to push it to the ft-interactive org on GitHub.
• NB. you'll need an access token and the git osxkeychain helper for this to work.
• Runs npm install to grab all the dependencies (this takes a few minutes).
• Runs npm start for the first time ? now you can start coding.

Using the built in tasks

You can run the following tasks from within your project directory:

• npm start ? starts up a development server and opens your app in a web browser. The dev server will automatically reload your browser when files change.
• npm run build - builds your app and puts it in the dist folder.
• npm run deploy ? deploys the contents of your dist folder to an appropriate location on S3. (You usually don't need to run this yourself ? it is run automatically by CircleCI.)

(You can find a few other, less interesting tasks defined in package.json.)

Key directories

• client ? the main files that make up your front end, including index.html and some Sass and JS files. You should mostly be working in here.
• config ? scripts that pull together some configuration details for your project, including basic facts (UUID, title, etc.) and 'onward journey' story links. These details are used to populate parts of the templates.
• views ? the standard page layout is formed from a few files in here (the project-specific files in client extend this layout). You generally don't need to edit this much.
• dist ? the optimsed HTML/CSS/JS bundle, generated automatically every time you run npm run build. You shouldn't edit files in here manually, as any manual changes would just get overwritten next time you build.

What's included in Starter Kit?

• A template for a basic front end app with FT.com page furniture
• Includes Origami components and various best-practice features such as meta tags to optimise SEO and social sharing.
• A build system including tasks for serving your app locally during development (auto-refreshing when you edit source files) and building an optimised HTML/CSS/JS bundle suitable for deployment.
• This is comprised of gulp, Babel, Browserify, Sass, and Nunjucks templates.
• A CI configuration that instructs CircleCI to deploy the project to S3 every time it builds.

Understanding automatic deployment ('continuous integration')

Whenever you add any repository to the ft-interactive GitHub org, the IG Buildbot automatically sets up a new CircleCI project linked to the new repo. That means CircleCI will build the project whenever you add a new commit to that repo (whether on master or other branches).

How does Starter Kit come into this? Starter Kit includes a circle.yml file that instructs CircleCI to run npm run deploy after any successful builds. This means that all you have to do is commit a change to your project, and push the commit to GitHub (or just make the change directly on the GitHub website), and it should get deployed within a few minutes. (The deploy script automatically decides what path to upload files to, based on the name of the repo on GitHub.) This process is called continuous integration.

Licence

This software is published by the Financial Times under the MIT licence.