Setup for development

Node 16

This project uses node 16 (see .nvmrc).

Use nvm to support multiple Node versions on your system.

yarn

yarn is used in web projects. To install yarn, follow the guide here.

Note! You don't need to setup your PATH env.var. as described in the guide.

If you haven't installed node yet, install node from nodejs.org. Add the node bin directory to your PATH in $HOME/.profile

The version of node must be >= v12.16.1, i.e. the version of node that comes with yarn is not the latest.

In order to be able to install packages from this repository on your machine, you need to authenticate with the GitHub registry.

Here's a short summary of what you need to do:

1. Create a personal access token
   1. Name it appropriately
   2. Check write:packages and read:packages
2. Copy the token
3. Add the token to your ~/.npmrc: echo "//npm.pkg.github.com/:_authToken=YOUR_TOKEN" >> ~/.npmrc

Linting and imports in VS Code

• Add the ESLint extension to VS Code to get linting directly in the code. https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint.

• To get the right indentation, etc. directly in the code, and on save add the Prettier extension to VS Code. https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode.

• To get VS Code to automatically fix linting errors (if possible) and organize imports on save, add the following to your settings.json file:

    "editor.codeActionsOnSave": [
      "source.fixAll.eslint",
      "source.organizeImports",
    ],
  

  Be careful with source.organizeImports however since that can drastically reduce performance in vscode.

Useful developer tools

• React developer tools for Chrome
• Redux developer tools for Chrome

Available Scripts

In the project directory, you can run:

yarn develop

Runs the app in the development mode. Open http://localhost:8000 to view it in the browser.

The page will reload if you make edits. You will also see any lint errors in the console.

If you want to be able to access the development server from other computers, use this: yarn develop -H 0.0.0.0

yarn build

Builds the app for production to the build folder.

yarn serve

The same as yarn develop but it serves the built site.

Learn More

You can learn more in the Create React App documentation.

To learn React, check out the React documentation.