Mobile and Admin Apps
React Client
React Web implementation for the Open Volunteer Platform
Getting Started
- Running the Client in Developer Mode
- Adding Keycloak Integration to the Client
- Customizing the Action Reports Grid
- Customizing Action Report Nearby Distance
Requirements:
- Node.js 12.x or later version
- Keycloak server (Optional)
Running the Client in Developer Mode
- Install Ionic
npm install -g @ionic/cli
- Install dependencies
npm install
- Start the app
npm run dev
Adding Keycloak Integration to the Client
Rename the keycloak.example.json
to keycloak.json
and update the fields accordingly.
{
"realm": "<your realm>",
"auth-server-url": "https://your-server/auth",
"ssl-required": "none",
"resource": "<your-client>",
"public-client": true,
"use-resource-role-mappings": true,
"confidential-port": 0
}
Customizing the Action Reports Grid
- Column size can be customized by using the
REACT_APP_REPORT_COLUMN_SIZE
environment variable. - This value can be changed in the
.env
file. - The default value is
4
.
Customizing Action Report Nearby Distance
- Nearby distance to calculate actions reports depending on closeness of recipient location can be customized via
REACT_APP_NEARBY_MAX_DISTANCE
environment variable. - This value can be changed in
.env
file. - The default value is
100
km.*