Skip to content
This repository was archived by the owner on Mar 13, 2025. It is now read-only.

Commit 4af25a9

Browse files
authored
Merge pull request #89 from topcoder-platform/dev
root only file system fix
2 parents 2e7c9f1 + e0e9fd6 commit 4af25a9

File tree

6 files changed

+146
-10
lines changed

6 files changed

+146
-10
lines changed

.circleci/config.yml

Lines changed: 21 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
11
version: 2
22
defaults: &defaults
33
docker:
4-
- image: circleci/python:2.7-stretch-browsers
4+
- image: cimg/python:3.11.0-browsers
55
install_dependency: &install_dependency
66
name: Installation of build and deployment dependencies.
77
command: |
8+
sudo apt update
89
sudo apt install jq
9-
sudo pip install awscli --upgrade
10-
sudo pip install docker-compose
10+
sudo apt install python3-pip
11+
sudo pip3 install awscli --upgrade
12+
sudo pip3 install docker-compose
1113
install_deploysuite: &install_deploysuite
1214
name: Installation of install_deploysuite.
1315
command: |
14-
git clone --branch v1.4.8 https://github.com/topcoder-platform/tc-deploy-scripts ../buildscript
16+
git clone --branch v1.4.15 https://github.com/topcoder-platform/tc-deploy-scripts ../buildscript
1517
cp ./../buildscript/master_deploy.sh .
1618
cp ./../buildscript/buildenv.sh .
1719
cp ./../buildscript/awsconfiguration.sh .
@@ -56,6 +58,14 @@ jobs:
5658
APPNAME: "mfe-core"
5759
steps: *builddeploy_steps
5860

61+
"build-qa":
62+
<<: *defaults
63+
environment:
64+
DEPLOY_ENV: "QA"
65+
LOGICAL_ENV: "qa"
66+
APPNAME: "mfe-core"
67+
steps: *builddeploy_steps
68+
5969
"build-prod":
6070
<<: *defaults
6171
environment:
@@ -77,6 +87,13 @@ workflows:
7787
- dev
7888
- feat/onboarding-app
7989

90+
- "build-qa":
91+
context: org-global
92+
filters:
93+
branches:
94+
only:
95+
- qa
96+
8097
# Production builds are exectuted only on tagged commits to the
8198
# master branch.
8299
- "build-prod":

README.md

Lines changed: 39 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,33 @@
33
This is the mfe-core [single-spa](https://single-spa.js.org/) application which loads all other Topcoder micro-frontend (MFE) applications.
44
It always loads the **Topcoder Header Microapp** which provides the top-level navigation, handles authorization, and loads other microapps depending on the current URL.
55

6+
## Content
7+
8+
Following are the list of sections defined in this document,
9+
10+
- [Overview](#overview)
11+
- [Requirements](#requirements)
12+
- [Local Development Setup](#local-development-setup)
13+
- [IDE](#ide)
14+
- [Hosting](#hosting)
15+
- [Terminal Configuration](#terminal-configuration)
16+
- [Linting](#linting)
17+
- [Git](#git)
18+
- [Branching](#branching)
19+
- [Commits](#commits)
20+
- [Application Configuration](#application-configuration)
21+
- [NPM Commands](#npm-commands)
22+
- [Local Deployment](#local-deployment)
23+
- [Deployment to Development](#deployment-to-development)
24+
- [Deployment to Production](#deployment-to-production)
25+
- [Segment Analytics](#segment-analytics)
26+
- [Add or Remove child app](#add-or-remove-child-app)
27+
- [Add-hoc child app replacement (import override)](#add-hoc-child-app-replacement-import-override)
28+
- [Creating child apps (microapps)](#creating-child-apps-microapps)
29+
- [Create new or use existent Angular child app](#create-new-or-use-existent-angular-child-app)
30+
- [Create new React child app](#create-new-react-child-app)
31+
- [Use existent React child app](#use-existent-react-child-app)
32+
633
## Overview
734

835
Topcoder Single Spa consist of 3 main components:
@@ -140,7 +167,9 @@ This `mfe-core` app has 2 types of configs:
140167
| `npm run format` | Format code using prettier |
141168
| `npm run test` | Run unit tests |
142169

143-
## Local Deployment from multi web servers (nodemon & webpack-dev-server) for local development - (most common)
170+
## Local Deployment
171+
172+
### Local Deployment from multi web servers (nodemon & webpack-dev-server) for local development - (most common)
144173

145174
To run the `mfe-core` app locally, run the following commands from the project root `./mfe-core`:
146175

@@ -154,7 +183,7 @@ Terminal 2
154183
$ npm run start-client
155184
```
156185
157-
## Local Deployment from web server (node)
186+
### Local Deployment from web server (node)
158187
159188
To deploy `mfe-core` app locally run inside the project root `./mfe-core`:
160189
@@ -169,7 +198,9 @@ To deploy `mfe-core` app locally run inside the project root `./mfe-core`:
169198
170199
⚠️ **NOTE** : that to make authorization work locally, you have to use domain `local.topcoder-dev.com` with port `3000`. On your local machine access file `/etc/hosts` add the line `127.0.0.1 local.topcoder-dev.com` and open app by URL http://local.topcoder-dev.com:3000
171200
172-
## Deployment to Development from web server (node) port 80
201+
## Deployment to Development
202+
203+
### Deployment to Development from web server (node) port 80
173204
174205
| Command | Description |
175206
| -------------------- | ---------------------- |
@@ -180,7 +211,9 @@ To deploy `mfe-core` app locally run inside the project root `./mfe-core`:
180211
| `$ npm start` | to start the app on port `80`, served from `dist/` |
181212
| `https://mfe.topcoder-dev.com/micro-frontends-react-route` | open url in browser to access the micro frame with react micro app and micro navbar app |
182213
183-
## Deployment to Production from web server (node) port 80
214+
## Deployment to Production
215+
216+
### Deployment to Production from web server (node) port 80
184217
185218
| Command | Description |
186219
| -------------------- | ---------------------- |
@@ -191,7 +224,7 @@ To deploy `mfe-core` app locally run inside the project root `./mfe-core`:
191224
| `$ npm start` | to start the app on port `80`, served from `dist/` |
192225
| `https://mfe.topcoder.com/micro-frontends-react-route` | open url in browser to access the micro frame with react micro app and micro navbar app |
193226
194-
### Deploying to Heroku
227+
#### Deploying to Heroku
195228
196229
Make sure you have [Heroky CLI](https://devcenter.heroku.com/articles/heroku-cli) installed and you have a Heroku account. And then inside the project folder run the next commands:
197230
@@ -221,7 +254,7 @@ Because analytics can be normally initialized once per website, we are initializ
221254
- We can enable debug mode by calling `analytics.debug();` inside browser console, see [debug documentation](https://segment.com/docs/connections/sources/catalog/libraries/website/javascript/#debug).
222255
- TODO: we might consider implementing one global logic for calling `window.analytics.page()` inside Frame of Navbar app so child apps wouldn't worry about this. Though we have to make sure that it works smoothly. In particular we have to make sure that if child app updates page `<title>` then `window.analytics.page()` is called after that and logs to the analytic correct page title. Also, child apps might want to provide additional arguments when calling `window.analytics.page()`. So we might come to this improvement in some time, after we try the current approach.
223256

224-
## Add/Remove child app
257+
## Add or Remove child app
225258

226259
For adding a child app to the root app make the following steps:
227260

config/constants.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,12 @@ module.exports = Object.freeze({
66
'mfeIndexPath': '/index.html',
77
'mfeRoutesPath': '/config/micro-frontends-routes-dev.txt'
88
},
9+
{
10+
'appEnv': 'qa',
11+
'mfeConfigPath': '/config/micro-frontends-config-qa.json',
12+
'mfeIndexPath': '/index.html',
13+
'mfeRoutesPath': '/config/micro-frontends-routes-qa.txt'
14+
},
915
{
1016
'appEnv': 'prod',
1117
'mfeConfigPath': '/config/micro-frontends-config-prod.json',
@@ -26,6 +32,7 @@ module.exports = Object.freeze({
2632
}
2733
],
2834
APP_ENV_DEV: "dev",
35+
APP_ENV_QA: "qa",
2936
APP_ENV_PROD: "prod",
3037
APP_ENV_LOCAL_MULTI: "local-multi",
3138
APP_ENV_LOCAL: "local",

config/micro-frontends-config-qa.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"imports": {
3+
"@topcoder/mfe-header": "https://platform.topcoder-qa.com/navbar/topcoder-mfe-header.js",
4+
"@topcoder/micro-frontends-react-app": "https://platform.topcoder-qa.com/react/topcoder-micro-frontends-react-app.js",
5+
"@topcoder/micro-frontends-angular-app": "https://platform.topcoder-qa.com/angular/main.js",
6+
"@topcoder/micro-frontends-teams": "https://platform.topcoder-qa.com/taas-app/topcoder-micro-frontends-teams.js",
7+
"@topcoder/micro-frontends-task-marketplace-app": "https://platform.topcoder-qa.com/tasks/topcoder-micro-frontends-task-marketplace-app.js",
8+
"@topcoder/micro-frontends-earn-app": "https://platform.topcoder-qa.com/earn-app/topcoder-micro-frontends-earn-app.js",
9+
"@topcoder/micro-frontends-submission-review-app": "https://platform.topcoder-qa.com/submissionreview/topcoder-micro-frontends-submission-review-app.js",
10+
"@topcoder/micro-frontends-model-app": "https://platform.topcoder-qa.com/model-app/topcoder-micro-frontends-model-app.js",
11+
"@topcoder/micro-frontends-community-admin-app": "https://tc-micro-community-admin.herokuapp.com/community-admin-app/topcoder-micro-frontends-community-admin-app.js",
12+
"@topcoder/micro-frontends-taas-admin-app": "https://platform.topcoder-qa.com/taas-admin-app/topcoder-micro-frontends-taas-admin-app.js",
13+
"@topcoder/micro-frontends-profile-app": "https://platform.topcoder-qa.com/profile-app/topcoder-micro-frontends-profile-app.js",
14+
"@topcoder/micro-frontends-onboarding-app": "https://platform.topcoder-qa.com/onboarding-app/topcoder-micro-frontends-onboarding-app.js",
15+
"@topcoder/micro-frontends-forums-app": "https://platform.topcoder-qa.com/forums-app/topcoder-micro-frontends-forums-app.js",
16+
"@topcoder/mfe-customer-work": "https://platform.topcoder-qa.com/self-service-app/topcoder-mfe-customer-work.js"
17+
}
18+
}

config/micro-frontends-routes-qa.txt

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
<route path="micro-frontends-react-route">
2+
<application name="@topcoder/micro-frontends-react-app"></application>
3+
</route>
4+
<route path="micro-frontends-angular-route">
5+
<application name="@topcoder/micro-frontends-angular-app"></application>
6+
</route>
7+
<route path="taas">
8+
<application name="@topcoder/micro-frontends-teams"></application>
9+
</route>
10+
<route path="task-marketplace">
11+
<application name="@topcoder/micro-frontends-task-marketplace-app"></application>
12+
</route>
13+
<route path="earn">
14+
<application name="@topcoder/micro-frontends-earn-app"></application>
15+
</route>
16+
<route path="submissionreview">
17+
<application name="@topcoder/micro-frontends-submission-review-app"></application>
18+
</route>
19+
<route path="model">
20+
<application name="@topcoder/micro-frontends-model-app"></application>
21+
</route>
22+
<route path="community-admin">
23+
<application name="@topcoder/micro-frontends-community-admin-app"></application>
24+
</route>
25+
<route path="taas-admin">
26+
<application name="@topcoder/micro-frontends-taas-admin-app"></application>
27+
</route>
28+
<route path="profile">
29+
<application name="@topcoder/micro-frontends-profile-app"></application>
30+
</route>
31+
<route path="onboard">
32+
<application name="@topcoder/micro-frontends-onboarding-app"></application>
33+
</route>
34+
<route path="forums">
35+
<application name="@topcoder/micro-frontends-forums-app"></application>
36+
</route>
37+
<route path="self-service">
38+
<application name="@topcoder/mfe-customer-work"></application>
39+
</route>
40+
<route path="work">
41+
<application name="@topcoder/mfe-customer-work"></application>
42+
</route>
43+
<route path="account">
44+
<application name="@topcoder/mfe-customer-work"></application>
45+
</route>
46+
<route path="support">
47+
<application name="@topcoder/mfe-customer-work"></application>
48+
</route>
49+
<route path="unauthorized">
50+
<div style="text-align: center; padding-top: 200px; font-size: 32px;">
51+
You are unauthorized
52+
</div>
53+
</route>
54+
<route default>
55+
<div style="text-align: center; padding-top: 200px; font-size: 32px;">
56+
Welcome to the Topcoder Platform. Get started by opening an app in the tool switcher on top right corner.
57+
</div>
58+
</route>

server.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ app.get("/micro-frontends-config", async function (req, res) {
2121
switch (process.env.APPENV.toLowerCase()) {
2222
case APP_CONST.APP_ENV_PROD.toLowerCase() :
2323
case APP_CONST.APP_ENV_DEV.toLowerCase() :
24+
case APP_CONST.APP_ENV_QA.toLowerCase() :
2425
mfeRoutes = await axios.get(env_config.mfeConfigPath)
2526
mfeRoutes = mfeRoutes.data
2627
break;
@@ -43,6 +44,7 @@ app.get("*", async function (req, res) {
4344
switch (process.env.APPENV.toLowerCase()) {
4445
case APP_CONST.APP_ENV_PROD.toLowerCase() :
4546
case APP_CONST.APP_ENV_DEV.toLowerCase() :
47+
case APP_CONST.APP_ENV_QA.toLowerCase() :
4648
case APP_CONST.APP_ENV_LOCAL.toLowerCase() :
4749
mfeIndex = await fsPromises.readFile(path.join(distPath + env_config.mfeIndexPath))
4850
break;
@@ -56,6 +58,7 @@ app.get("*", async function (req, res) {
5658
let mfeRoutes
5759
switch (process.env.APPENV.toLowerCase()) {
5860
case APP_CONST.APP_ENV_DEV.toLowerCase() :
61+
case APP_CONST.APP_ENV_QA.toLowerCase() :
5962
case APP_CONST.APP_ENV_PROD.toLowerCase() :
6063
mfeRoutes = await axios.get(env_config.mfeRoutesPath)
6164
mfeRoutes = mfeRoutes.data

0 commit comments

Comments
 (0)