Yarn is not required. Anywhere it says yarn <command> you can sub in npm run <command>.

Upon install:

1. Run yarn or npm install
2. Put your Flickr credentials in flickr_crendentials.json in the format: {"api_key": "<your key here>", "secret": "<your secret here>"}.

For development

1. Run yarn dev:api in one terminal
2. Run yarn dev in another terminal
3. Open http://localhost:8080 in a browser

For production

1. Run yarn build
2. Run yarn start
3. Open http://localhost:3000 in a browser.

• build: Runs Webpack to build a production build of your CSS and JS
• dev: Runs the webpack-dev-server which runs a local server on 8080, builds and serves dev builds of your JS and CSS as well as proxies requests to your API server
• dev:api: Runs a local API server that proxies the Flickr API
• format: Runs the code through Prettier, a JavaScript code formatter
• lint: Runs the code through ESLint. This code adheres to the Airbnb rules (inasmuch they don't conflict with Prettier)
• size-css: Prints out the size of the CSS after minification and gzip
• size-js: Prints out the size of the JS after minification and gzip
• start: Runs a production-ready Express server that proxies the Flickr API as well as serves your already built CSS and JS on http://localhost:3000
• test: Runs the Jest test suite
• test:update: Updates the Jest snapshots
• types: Runs the Flow static type checker
• validate: Runs the full suite: format, lint, types, test, size-css and size-js

• Node
• Webpack
• Babel w/ preset-env and static class properties
• Preact
• Preact-Router
• Postcss, cssnano, and cssnext
• Flow
• ESLint
• Prettier
• Jest
• Express

• gzip and minified JS: 7.11KB
• gzip and minified CSS: 1.43KB
• Tested with 18 unit tests, linted, and statically typed
• Google Lighthouse
  • Performance: 97
  • Accessibility: 94
  • Best Practices: 83 (not using HTTP2 or manifest)

• Service worker: was planned and architected to use, just ran out of time
• Server-side rendering: had it finished but greatly increased complexity of code, little gain
• Code-splitting: app is already tiny; the savings would be too small to justify complexity
• More gestures: swiping between images
• Pagination on search images