USER INTERFACE BUILD GUIDE
The current GUI build is based on Grunt.
Grunt is a JavaScript Task Runner - an automation tool for performing repetitive tasks like minification, compilation, unit testing, linting etc.
The tasks performed during a typical GUI build are
- Pre Build checks (For Some development rules)
- ESLint for the JS files
- SCSS compilation to CSS
- CSS optimization
- HTML minification
- JS minification
- Required JS optimization to pack all the dependencies of a component into single file.
- Updating the files with configuration specified in the properties.json file.
- Generate integrity for all component files.
- Cache Busting for resources
- Generate resource bundle for English language
Running UI User Interface Build:
Follow steps below to run UI Build:
- First make sure that Node js is installed on the machine and grunt is available in global scope.
- Run npm install command inside _build folder.
- Now run build.sh to run the build
The properties.json file under _build folder is a configuration file having parameters to be set during build time:
- resource_base_path: The base path from which the JS and HTML resources are to be fetched. It can be a relative path pointing to the same domain the page is running or fully qualified path to server. This can be configured to implement Domain Sharing. Default value of it set as “/”
- api_base_url: If the HTTP server and the application server are on same host, the property is set as “same-origin” otherwise set to host name and port of the application server. Default value is “same-origin”.
- image_resource_path: The base path from which the image resources are to be fetched. It can also be a relative path pointing to the same domain the page is running on or a fully qualified path to different server on which images are hosted. Default value of it set as "/images".
- brand_resource_path: This property used for those images which are brand dependent. Defaults to image_resource_path.
- default_api_context_root: The default value of the weblogic context root. Defaults to “digx”.
- default_api_version: The value of the API version for the whole application. Defaults to “v1”.
- extended_api_context_root: The value of the context root of the Extended OBDX APIs. Defaults to “digx/ext”.
- extended_api_version: The value of the API version for the Extended OBDX APIs. Defaults to “v1”.
- social_api_context_root: The value of the context root of the Social Media OBDX APIs. Defaults to “digx-social”.
- social_api_version": The value of the API version for the Social Media OBDX APIs. Defaults to “v1”.
- secure_page: Set the protected page pathname. Defaults to “/pages/home.html”.
- logging_level": Set the logging level of the application. Defaults to "LEVEL_ERROR". Can accept following values LEVEL_ERROR (Log level error), LEVEL_INFO (Log level info), LEVEL_LOG (Log level - general message), LEVEL_NONE (Log level none) and LEVEL_WARN (Log level warning).
- public_page: Set the public page pathname. Defaults to “/index.html”.
- default_entity: This property holds the value of default entity of the application. This value is used when no entity is specified or available for use.
- oam_base_url: This is the URL of OAM server for validating username and password.
- obdx_base_path: To fund wallet using own bank account, need to redirect to bank portal.
- fb_sdk_url: This property stores the Facebook SDK API URL. It is being used in OBDX Facebook component of social media module.
- fb_api_key: This property stores the API key for the Facebook application. This API key is used for initializing and authenticating Facebook API.
- fb_send_message_api: API endpoint for Facebook Send API. With the Send Dialog people can privately send content to specific friends. They'll have the option to privately share a link as a Facebook message. Defaults to https://www.facebook.com/dialog/send.
- linkedin_sdk_url: This property stores the Linkedin SDK API URL. It is being used in OBDX Linkedin component of social media module.
- linkedin_api_key: This property stores the API key for the Linkedin app. This API key is used for initializing and authenticating Linkedin API.
- google_map_sdk: This property is a unique key of google map to be integrated in OBDX application. User need to enable the used API for respective key in on developer.google.com after creating the key from same.
- google_map_url: This URL is used to launch Google Maps with the location details passed as query parameters. Default value of it set as http://maps.google.com/maps.
- web_analytics: This property used to determine the analytic engine. Application will search same name file under <CHANNEL>/web-analytics folder for the analytics.
- axe_url: This property will required if run time accessibility check is required. This property hold the URL of AXE JS.