-
Notifications
You must be signed in to change notification settings - Fork 2
First Steps
- Node version: 12.1.0 or later (Node.js Download: https://nodejs.org/en/download)
- Java version: 8 or later (for the JVx application)
- A JVx application, running on a Java application (Jetty, Tomcat, ...) server, using JVx mobile UI
- IDE of your choice (Visual Studio Code is recommended: https://code.visualstudio.com/download)
-
Clone the git repository, open it in your development environment of choice and run
npm install
to download the dependencies. -
Run the command
npm start
to start reactUI. A new tab will open in your browser. -
If the web application can not connect to the server there are different approaches to fix this issue, Depending on whether you want to connect to the server by a config.json file or URL
-
config.json File
Add a file called config.json in your public folder of your project. This file will be used to send the required data to the server during the startup-request.
The
appName
andbaseUrl
properties are the most important properties in this file!Example:
{ "appName": "[application name here]", "baseUrl": "[baseUrl here]", "username": "[username here]", "password": "[password here]", "deviceMode": "[deviceMode]", "langCode": "[language (en, de)]", "logoBig": "[path to logo in public directory]", "logoSmall": "[path to logo in public directory]", "logoLogin": "[path to logo in public directory]" "theme": "[theme here]", "colorScheme": "[color-scheme here]" }
-
URL
The parameters which are set in the config.json file, can also be set in the url, simply put the parameter after the first "/" of your url.
Example:
You can see that parameters are the same names as in the config.json and are combined by a "&". The url gets prioritized over the config.json file, if you happen to have both of those options!
It is also important to put a "#" after the last of your parameters, because we use the Hashrouter of
react-router-dom
!!
-
If everything works out as planned, you will be redirected to the login:
After you logged in or if you have a valid username, password combination you will be redirected to home:
There are two options to use bundling with webpack.
- Production Bundle
run
npm run bundle
to create a production bundle. URL configuration is then required in your app where reactUI is used as lib. Does not accept config.json! - Development Bundle
run
npm run devbundle
to create a development bundle. URL configuration is possible but config.json is also allowed.
More information about customizing screens, components and more can be found here
The style of the ReactUI is extremely customizable, check out the style example for more info. Theme Variables Color-Scheme Variables
We are also offering a Designer which simplifies the creation of themes and color-schemes and directly uploads them.