certus-design-system

Specifications

* Client built using React, Webpack, and SCSS.
* Development server uses Node and Express.

Instructions

Can be installed locally using NPM or Yarn:

$3

Installation
* First, install dependencies: npm install

$3

Installation
* First, install dependencies: yarn install

$3

This package has peer-dependencies for the following libraries:
* @material-ui/core
* jss
* react
* react-dom
* react-jss

Please make sure your project includes these dependencies with the version specified in the package.json to avoid any conflicts specific to React or Material-UI.

At the root of your application you will need to setup your theme provider:
``javascript
const generateClassName = createGenerateClassName();
const jss = create(jssPreset());

function App() {
return (


// AppRouter or other root component


);
}
`

The wrapping MUI's theme provider with a JssProvider helps prevent classname conflicts commonly associated with Material-UI (as discussed here and here).

Certus Design System local development


* First clone the repository locally and cd into the repository
* Add a global symlink to the package _'certus-design-system'_: npm link
* In the directory you want to use the Certus Design System, reference the NPM link: npm link certus-design-system
* Run npm start or yarn start to watch for changes in the CDS directory
* Alternatively, you can run yarn build:dev or yarn build:prod to build for development or production respectively
* To visualise how the Webpack bundle is comprised, you can run yarn build:visual
* When creating a new component (or renaming an existing one), be sure to add the name of the export to the ./index.js module export list and the ./webpack.config.js entry array object.

Tests

* Tests have been built using Jest and Enzyme, with some Enzyme helper functions provided by Material-UI.
* To run the test cases: yarn test`