The Experience Management Service is the human-facing application enabling an Experience Owner or Experience Manager to modify or augment a learning metadata record ingested by the Experience Index Service (XIS). XMS UI is a user interface facilitating modification and augmentation of records by learning experience owners and managers. The Django web application XMS enables experience owners/managers to modify/augment experience metadata via (i.e., the "admin portal") REST API. It utilizes the Django admin UI for system configuration and management.
Note: For this service to work properly you will need the XMS Backend component to accompany it.
- Download and install Docker Desktop (docker compose included)
You can download Docker Compose binaries from the release page on this repository.
Rename the relevant binary for your OS to docker-compose and copy it to $HOME/.docker/cli-plugins
Or copy it into one of these folders to install it system-wide:
/usr/local/lib/docker/cli-pluginsOR/usr/local/libexec/docker/cli-plugins/usr/lib/docker/cli-pluginsOR/usr/libexec/docker/cli-plugins
(might require making the downloaded file executable with chmod +x)
Clone the Github repository
git clone https://github.com/adlnet/ecc-openlxp-xms-ui.git
- Create a
.envfile in the root directory - The following environment variables are required:
| Environment Variable | Description |
|---|---|
| NEXT_PUBLIC_XMS_BACKEND | The endpoint for your XMS backend |
Note: These environment variables need to be set up at build time
-
Create the OpenLXP docker network. Open a terminal and run the following command in the root directory of the project.
docker network create openlxp -
Run the command below to build your image for XMS UI
docker build -t xmsui . -
Run the command below to deploy the image built in step 2
docker run -p 3000:3000 xmsui -d
**Note: If deploying this at the same time as XMS UI, port mappings will need be changed to 3001:3000"
This project uses yarn as the package manager. If you already have yarn installed or are using a different package manager feel free to skip this step.
-
Start by installing yarn globally
npm install -g yarn -
Verify yarn was installed
yarn -version
-
Installs all requirements for development
yarn install
-
bundle your app into static files
yarn build
-
Run the project in development mode
yarn start
All of the components in the project are unit tested and are covered by the Jest testing framework. When testing components there are three key files to utilize:
jest.setup.js: This file is used to configure the testing environment including any mocks and setup functions for the code to work.mockSetUp.js: This file is used to mock any functions that are reliant on external APIs or services..test.js: This file is used to test the components. Any file in the tests directory will be run by the testing framework as long as the child components are appended with.test.jsor.spec.js.
- Statement Coverage: 80%
- Branch Coverage: 80%
- Function Coverage: 80%
- Line Coverage: 80%
-
Runs all the tests in the project with cached results
yarn test -
Run all the tests in the project without cached results. This produces a coverage report which can be viewed in the terminal or in the browser by opening the
/coverage/Icov-report/index.htmlfile in the project directory.yarn coverage
Next.js Documentation can be found here
React-Query Documentation can be found here
TailwindCSS Documentation can be found here
Axios Documentation can be found here
HeadlessUi Documentation can be found here
Eslint Documentation can be found here
Prettier Documentation can be found here
Jest Documentation can be found here
ECC-Openlxp Wiki can be found here
This project uses the Apache license.