README.md

Data Portal Front End

Mise en place

1. Install recommended VSCode extensions (source)
   1. Open the repo in VSCode
   2. You should get a notification to install the recommended extensions
   3. If not, go to the VSCode extension tab in the editor, and type @recommended in the searchbox to see the list.
   4. See here for why the extensions are recommended

Development

The following steps will start a FE server that connects to dev API. (See useful tips section to connect to a different API)

1. Install nvm
   • Example: brew install nvm
2. Check .nvmrc to see which version of node to download.
   • Example: nvm install 20.10.0 && nvm use 20.10.0
3. Install npm packages and playwright browsers
   • Example: npm i && npx playwright install
4. Copy configs file frontend/src/configs/local.js to frontend/src/configs/configs.js
   • Example: cp ./src/configs/local.js ./src/configs/configs.js
5. Start FE server
   • Example: npm run dev
6. Navigate to http://localhost:3000/

Option: With Docker

See DEV_ENV.md for local dev quick start using Docker containers

Useful tips

1. Test FE app production build locally: npm run build && npm run serve
2. Connect FE app to a different deployed env API
   1. Go to frontend/src/configs/configs.js, uncomment the env API you want to use

Environment Variables

The environment variables for the web application. The variables are stored in /frontend/configs/*. E.g., frontend/configs/local.js

For local development, please copy local.js to a new file named configs.js in the same directory (frontend/src/configs/configs.js)

WARNING: Do not store sensitive data in the environment variables.

Name	Description
AUTH0_DOMAIN	The hosted Auth0 domain used for Authentication
AUTH0_CLIENT_ID	The client id of the Auth0 application for this site
AUDIENCE	The domain of the corpora api
API_URL	The URL to the corpora api

Deployment

Steps are described in On Call Check List

e2e Tests

See tests documentation for details