Set-up the Frontend

Please follow these instructions to configure and run the Frontend on your localhost

Open a New Terminal Window

As you know, our Backend and Frontend web apps are separate, therefore we will need separate terminal (Mac) or cmd (windows) windows running at the same time to lunch the Registration System.

Please lunch a new terminal/cmd window before proceeding to the next steps.

Please navigate into the 'Frontend' project directory and install the dependencies within your new terminal/cmd window.

cd <Frontend-dir> yarn install OR npm install

Configure Webpack

Before we can build, run or deploy our Frontend it is important to ensure that the 'webConfig.json' file is configured correctly for our environment.

{
"siteURL": "http://localhost:8080",
"axiosInstance_baseURL": "http://localhost:3000/api",
"environment": "development"
}

Please ensure this object is configured correctly:

  • siteURL - URL for the Frontend app

  • axiosInstance_baseURL - URL for Backend app + '/api'

Please note: You must add '/api' to the end of your Backend URL.

By default your Frontend/Backend will be running on:

Frontend: http://localhost:8080
Backend: http://localhost:3000

In the same way, set ‘environment’ to either ‘development’ or ‘production’. This will change the way webpack compiles your code.

Run a build and lunch our Frontend Web App

yarn run build OR npm run build
yarn run dev OR npm run dev

Your backend app should be running on

http://localhost:8080