You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+99-87Lines changed: 99 additions & 87 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,96 +1,137 @@
1
-
# Open LXP: Experience Discovery Service UI
1
+
# OpenLXP: Experience Discovery Service UI (XDS UI)
2
2
3
-
This is the UI for the Open LXP: Experience Discovery Service. It allows you to create and manage your own experience collection, subscribe to other people's experience collections, and search for experiences indexed in the service.
3
+
This is the UI for the OpenLXP: Experience Discovery Service. It allows you to create and manage your own experience collection, subscribe to other people's experience collections, and search for experiences indexed in the service.
4
4
5
-
_Note_: For this service to work properly you will need the XDS Backend component to accompany it.
5
+
**Note: For this service to work properly you will need the XDS Backend component to accompany it.**
6
6
7
-
## Table of Contents
7
+
## Prerequisites
8
+
### Install Docker & docker-compose
9
+
#### Windows & MacOS
10
+
- Download and install [Docker Desktop](https://www.docker.com/products/docker-desktop) (docker compose included)
- The following environment variables are required:
24
35
25
-
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.
| NEXT_PUBLIC_BACKEND_HOST | The endpoint for your XDS backend |
39
+
| NEXT_PUBLIC_XAPI_LRS_ENDPOINT | The endpoint for your SQL-LRS |
40
+
| NEXT_PUBLIC_XAPI_LRS_KEY | The SQL-LRS key |
41
+
| NEXT_PUBLIC_XAPI_LRS_SECRET | The SQL-LRS secret |
26
42
27
-
> Start by installing yarn globally
43
+
**Note: These environment variables need to be set up at build time**
28
44
29
-
```terminal
30
-
npm install -g yarn
31
-
```
45
+
## 3. Deployment
46
+
1. Create the OpenLXP docker network. Open a terminal and run the following command in the root directory of the project.
32
47
33
-
> Verify yarn was installed
48
+
```terminal
49
+
docker network create openlxp
50
+
```
34
51
35
-
```terminal
36
-
yarn -version
37
-
```
52
+
2. Run the command below to build your image for XDS UI
38
53
39
-
### Step 3: Install project dependencies
54
+
```terminal
55
+
docker build -t xdsui .
56
+
```
57
+
58
+
3. Run the command below to deploy the image built in step 2
40
59
41
-
> Installs all requirements for development
60
+
```terminal
61
+
docker run -p 3000:3000 xdsui -d
62
+
```
42
63
43
-
```terminal
44
-
yarn
45
-
```
64
+
## Local development/testing
65
+
### 1. Install yarn
46
66
47
-
### Step 4: Update .env file
67
+
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.
48
68
49
-
The `.env` file can be found in the root directory of the project folder
69
+
- Start by installing yarn globally
50
70
51
-
> Example `.env` file
71
+
```terminal
72
+
npm install -g yarn
73
+
```
74
+
75
+
- Verify yarn was installed
52
76
53
-
```js
54
-
// api gateway
55
-
NEXT_PUBLIC_BACKEND_HOST=
56
-
NEXT_PUBLIC_XAPI_LRS_ENDPOINT=
57
-
NEXT_PUBLIC_XAPI_LRS_KEY=
58
-
NEXT_PUBLIC_XAPI_LRS_SECRET=
59
-
```
77
+
```terminal
78
+
yarn -version
79
+
```
60
80
61
-
**NEXT_PUBLIC_BACKEND_HOST**: The url for the XDS component
81
+
### 2: Install project dependencies
62
82
63
-
> Note: the lrs component is not required for the UI to function.
83
+
- Installs all requirements for development
84
+
85
+
```terminal
86
+
yarn install
87
+
```
64
88
65
-
**NEXT_PUBLIC_XAPI_LRS_ENDPOINT**: The url for the LRS component
89
+
### 3. Build the project
66
90
67
-
**NEXT_PUBLIC_XAPI_LRS_KEY**: The key for the LRS component
91
+
- bundle your app into static files
68
92
69
-
**NEXT_PUBLIC_XAPI_LRS_SECRET**: The secret for the LRS component
93
+
```terminal
94
+
yarn build
95
+
```
70
96
71
-
### Step 5: Run the project
97
+
### 4. Run your project
98
+
99
+
- Run the project in development mode
72
100
73
-
> Run the project in development mode
101
+
```terminal
102
+
yarn start
103
+
```
74
104
75
-
```terminal
76
-
yarn dev
77
-
```
105
+
## Testing
106
+
107
+
All of the components in the project are unit tested and are covered by the [Jest](https://jestjs.io/) testing framework. When testing components there are three key files to utilize:
78
108
79
-
### Step 6: Run the project in production mode
109
+
1. `jest.setup.js`: This file is used to configure the testing environment including any mocks and setup functions for the code to work.
110
+
2. `mockSetUp.js`: This file is used to mock any functions that are reliant on external APIs or services.
111
+
3. `.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.js` or `.spec.js`.
80
112
81
-
> Build the docker image
113
+
### Our current threshold for testing coverage is:
82
114
83
-
```terminal
84
-
docker build -t openlxp-xds-ui .
85
-
```
115
+
- **Statement Coverage**: 80%
116
+
- **Branch Coverage**: 80%
117
+
- **Function Coverage**: 80%
118
+
- **Line Coverage**: 80%
86
119
87
-
> Run the docker image
120
+
### Command to run tests
88
121
89
-
```terminal
90
-
docker run -p 3000:3000 openlxp-xds-ui
91
-
```
122
+
- Runs all the tests in the project with cached results
123
+
124
+
```terminal
125
+
yarn test
126
+
```
127
+
128
+
- 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.html` file in the project directory.
92
129
93
-
## Development
130
+
```terminal
131
+
yarn coverage
132
+
```
133
+
134
+
## Documentation
94
135
95
136
### Frontend Stack Documentation
96
137
@@ -111,32 +152,3 @@ docker run -p 3000:3000 openlxp-xds-ui
111
152
[Prettier Documentation can be found here](https://prettier.io/docs/en/install.html)
112
153
113
154
[Jest Documentation can be found here](https://jestjs.io/docs/en/getting-started)
114
-
115
-
## Testing
116
-
117
-
All of the components in the project are unit tested and are covered by the [Jest](https://jestjs.io/) testing framework. When testing components there are three key files to utilize:
118
-
119
-
1.**jest.setup.js**: This file is used to configure the testing environment including any mocks and setup functions for the code to work.
120
-
2.**mockSetUp.js**: This file is used to mock any functions that are reliant on external APIs or services.
121
-
3.**.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.js` or `.spec.js`.
122
-
123
-
### Our current threshold for testing coverage is:
124
-
125
-
-**Statement Coverage**: 80%
126
-
-**Branch Coverage**: 80%
127
-
-**Function Coverage**: 80%
128
-
-**Line Coverage**: 80%
129
-
130
-
### Command to run tests
131
-
132
-
> Runs all the tests in the project with cached results
133
-
134
-
```terminal
135
-
yarn test
136
-
```
137
-
138
-
> Runs all the tests in the project without cached results produces a coverage report which can be viewed in the terminal or in the browser by opening the `/coverage/Icov-report/index.html` file in the project directory.
0 commit comments