Javascript Tag Validator
Clone the repo then run npm install or yarn install
(Currently tested and working with yarn 1.3.2, npm 5.6.0 and node version(s) 9.3.0, 8.9.4)
UI is designed with sketch, and can be found in ui.sketch
This project was bootstrapped with Create React App.
React-scripts do a lot of background work. You can find the most recent version of the guide here.
Commands:
-
start dev server:
yarn start -
run tests:
yarn test -
build for production:
yarn build:shipit: -
eject (don't do..):
yarn eject
Testing
-
tests are run by Jest running "yarn test" will scan the entire src folder for "x.test.js" files, the tests folder for test files to run. Tests are run using nodejs with jsdom.
-
Tests are formatted using the expect statement. Snapshot testing is also supported.
-
Enzyme is used for test rendering.
Directory / File Structure
React Components
- All components go into
/src/components/{ComponentName}
Redux
- Currently using redux ducks but transitioning to re-ducks following the suggestions from here
Sentry (Error Handling)
Sentry is used for error tracking. All config is within src/index.js,
Each new release corresponds to a new release within Sentry. This makes it easy to see if users of an older version are reporting errors from known bugs. See releases for the documentation on using releases.
Errors within the application lifecycle methods are caught by error boundaries, a react 16 feature. A single error boundary is currently used, with Sentry integration. It is defined in src/components/SentryBoundary.js. There is room for additional, more specialised error boundaries that may be added later. (e.g A parser failure should look different to a validation or database function failing to run)
The boundaries are defined in /src/components/FileHandlerContainer.js where The <SentryBoundary> component wraps the respective container component. This way, if the component fails to mount, the entire application does not unmount. Coarser, or finer grained options are possible.
Travis CI
Travis CI is used for continuous integration. Currently the configuration runs with node v8. Node v6 does not currently work due to the lack of Object.entries added in ES17.
Documentation for changing slack integration can be found here
Codecov is used to track coverage. Results are automatically uploaded after each Travis build. The codecov token is encrypted in the same way the slack one is, and is stored in the env: section. See here for an example node repository.
Greenkeeper is used to track and keep npm dependencies up to date. Docs