Skip to content

ImagineThisUCL/ImagineThisWeb

Repository files navigation

Imagine This Web Frontend

CircleCI

This project was bootstrapped with Create React App.

Access Token && OAuth 2.0 Authentication:

See this link to learn how to get Access tokens. See this link to learn how to use OAuth.

If the app notices you that "the token or the project ID is not correct" please check again and make sure that your ImagineThisServer is running before you submit the tokens.

Quick Start Guide

If it's your first time running this project, you should install all dependencies first:

$ npm install  

and then use

$ npm start 

to start the app.

Available Scripts

In the project directory, you can run:

npm start

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

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

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

To run the whole ImagineThis System on your local environment:

If you want the entire ImagineThis system to be run in your local environment, including the front-end, back-end and databases. You can access the ImagineThis system repository and follow the instructions there.

Env Variables Configuration

In order to adhere to the changes that the whole ImagineThisSystem are going to deployed using Docker, the front-end now needs to get some configuration value from the system envaribles. For development process though, you can create a .env file in the root folder to specify the env variables instead of changing and updating the actual env variable settings on you local machine.

These are the env variables that you need to configure:

# Address that your application will runs on.
# For development environment, simply set it to the development server address (http://localhost:3000 by default)
REACT_APP_DOMAIN="" 
# These two env variables are related to the Oauth functionality.
# See [Figma official guide on Oauth](https://www.figma.com/developers/api#oauth2) for more information.
REACT_APP_CLIENT_ID=""
REACT_APP_CLIENT_SECRET=""
# This env variable should be set to the backend API server address. For more information check the ImagineThisServer repo.
# If the backend server is running locally, the default server address should be http://localhost:8080
REACT_APP_BACKEND_ADDRESS=""

About

Client-side of the Imagine This project

Resources

License

Stars

Watchers

Forks

Contributors 11