new-flow-app's Introduction

Flow starter app with React ⚛️

Minimal repo to kickstart a Javascript app with Flow, hot reloading, linting and server-side rendering.

This is a universal react project, providing server-side rendering and Flow syntax.

Feel free to post any issues, questions or suggestions. PRs are more than welcome 👍.

Getting Started

Clone the repo

https://github.com/nazimjamil/new-flow-app.git

Install dependencies.

yarn install

Start the dev server

yarn start

Orientation

HTML template is located at /template.html, the main app JS file is app/index.jsx.

ESLint has been preconfigured with the Airbnb styleguide.

Build artefacts will end up in the /dist folder.

Testing

You'll find an example spec under the ___tests___ directory.

Start the watcher.

yarn run test:watch

Or do a single run

yarn run test

Build

Run the build command and take a look at /dist

yarn run build

A postbuild step runs react-snap which will create a static site within the dist folder. If you would like to verify the static site locally, you can do so by running the following

yarn run start:dist

VSCode setup

I recommend using VSCode, if you do here is a configuration

{
  "flow.pathToFlow": "./node_modules/.bin/flow",
  "flow.useNPMPackagedFlow": true,
  "flow.enabled": true,
  "flow.runOnEdit": true,
  "flow.showStatus": true,
  "javascript.validate.enable": false,
  "eslint.enable": true,
  "eslint.options": {
    "configFile": "./.eslintrc.json"
  },
  "files.associations": {
    "*.css": "postcss"
  }
}