We are using the Yarn NPM client. You must install this on your machine.
You can install Yarn through the Homebrew package manager. This will also install Node.js if it is not already installed.
brew install yarn
If you use nvm you should exclude installing Node.js so that nvm's version of Node.js is used.
brew install yarn --ignore-dependencies
Once you have Yarn installed. You can continue with project setup.
Setup commands must be run from the client interface directory.
yarn will install the project dependencies.
yarn start starts the local development server at http://localhost:8080
Do not edit the yarn.lock file directly. This will re-generate from yarn commands as needed. Please keep the yarn.lock tracked with git.
Do not use the NPM client to install/remove dependencies or launch NPM scripts. Please use Yarn commands instead.
The Webpack development server watches for code changes and reloads live updates, using Hot Module Replacement (HMR), there is no need to refresh your browser.
If you make changes to the React Semantic UI files, you must re-build the dependency.
cd /semantic
gulp build
You can also simply watch for changes and a fast build will automatically happen. This is the recommended approach.
gulp watch
We are compiling our javascript into code that works across browser using Babel. This means we can use the latest version of EcmaScript (ES6), so please use modern javascript.
We're using ESLint to help with javascript code quality with the AirBnB style guide configuration.
yarn lint will lint all the javascript files.
yarn fix will fix some ESLint errors automatically, other errors must be fixed manually.
When committing changes, yarn will run ESLint and also run snapshot tests for those files that have changed. It will stop you from committing changes that fail the lint and test process. If you really need to commit something that fails, ...naughty, you can pass the -n flag to disable it, like so.
git commit -n -m 'Thou shalt not commit dirty code'
We're using Flow for static type checking of javascript. Flow only checks those files with // @flow at the top.
We're using the Jest testing framework from Facebook.
yarn test will run the test suite.
yarn test:coverage will produce a code coverage report. We have a high threshold, please check regularly.
test:watch will watch files and test for you, if you prefer.