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

Commit 84b5f56

Browse files
nkumar-topcodernkumar-topcoder
authored
Merge pull request #33 from topcoder-platform/dev
Initial merge to master
2 parents 9c22649 + 9726e18 commit 84b5f56

File tree

196 files changed

+27868
-2
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

196 files changed

+27868
-2
lines changed

‎.circleci/config.yml

+88
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
version: 2
2+
defaults: &defaults
3+
docker:
4+
- image: circleci/python:2.7-stretch-browsers
5+
install_dependency: &install_dependency
6+
name: Installation of build and deployment dependencies.
7+
command: |
8+
sudo apt install jq
9+
sudo pip install awscli --upgrade
10+
sudo pip install docker-compose
11+
install_deploysuite: &install_deploysuite
12+
name: Installation of install_deploysuite.
13+
command: |
14+
git clone --branch v1.4.2 https://github.com/topcoder-platform/tc-deploy-scripts ../buildscript
15+
cp ./../buildscript/master_deploy.sh .
16+
cp ./../buildscript/buildenv.sh .
17+
cp ./../buildscript/awsconfiguration.sh .
18+
restore_cache_settings_for_build: &restore_cache_settings_for_build
19+
key: docker-node-modules-{{ checksum "package-lock.json" }}
20+
21+
save_cache_settings: &save_cache_settings
22+
key: docker-node-modules-{{ checksum "package-lock.json" }}
23+
paths:
24+
- node_modules
25+
26+
builddeploy_steps: &builddeploy_steps
27+
- checkout
28+
- setup_remote_docker
29+
- run: *install_dependency
30+
- run: *install_deploysuite
31+
#- restore_cache: *restore_cache_settings_for_build
32+
- run:
33+
command: |
34+
./awsconfiguration.sh $DEPLOY_ENV
35+
source awsenvconf
36+
./buildenv.sh -e $DEPLOY_ENV -b ${LOGICAL_ENV}-${APPNAME}-buildvar
37+
- run:
38+
name: Running build-var.
39+
command: |
40+
source buildenvvar
41+
./build.sh ${APPNAME}
42+
#- save_cache: *save_cache_settings
43+
- deploy:
44+
name: Running MasterScript.
45+
command: |
46+
./awsconfiguration.sh $DEPLOY_ENV
47+
source awsenvconf
48+
./buildenv.sh -e $DEPLOY_ENV -b ${LOGICAL_ENV}-${APPNAME}-deployvar
49+
source buildenvvar
50+
./master_deploy.sh -d ECS -e $DEPLOY_ENV -t latest -s ${LOGICAL_ENV}-global-appvar,${LOGICAL_ENV}-${APPNAME}-appvar -i ${APPNAME}
51+
52+
jobs:
53+
# Build & Deploy against development backend
54+
"build-dev":
55+
<<: *defaults
56+
environment:
57+
DEPLOY_ENV: "DEV"
58+
LOGICAL_ENV: "dev"
59+
APPNAME: "micro-frontends-taas-admin-app"
60+
steps: *builddeploy_steps
61+
62+
"build-prod":
63+
<<: *defaults
64+
environment:
65+
DEPLOY_ENV: "PROD"
66+
LOGICAL_ENV: "prod"
67+
APPNAME: "micro-frontends-taas-admin-app"
68+
steps: *builddeploy_steps
69+
70+
workflows:
71+
version: 2
72+
build:
73+
jobs:
74+
# Development builds are executed on "develop" branch only.
75+
- "build-dev":
76+
context: org-global
77+
filters:
78+
branches:
79+
only:
80+
- dev
81+
82+
# Production builds are exectuted only on tagged commits to the
83+
# master branch.
84+
- "build-prod":
85+
context: org-global
86+
filters:
87+
branches:
88+
only: master

‎.eslintignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
src/decls

‎.eslintrc

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"extends": [
3+
"eslint:recommended",
4+
"plugin:react/recommended",
5+
"react-important-stuff",
6+
"plugin:prettier/recommended"
7+
],
8+
"parser": "babel-eslint",
9+
"rules": {
10+
"no-unused-vars": "warn"
11+
}
12+
}

‎.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -102,3 +102,6 @@ dist
102102

103103
# TernJS port file
104104
.tern-port
105+
106+
# macOS cache files
107+
.DS_Store

‎.nvmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
10.22.1

‎.prettierignore

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
.gitignore
2+
.prettierignore
3+
yarn.lock
4+
yarn-error.log
5+
package-lock.json
6+
dist
7+
coverage

‎.prettierrc

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"singleQuote": false
3+
}

‎README.md

+158-2
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,158 @@
1-
# taas-admin-app
2-
taas-admin-app for managing taas administrative activities
1+
# Topcoder TaaS Admin Micro-app
2+
3+
This is a [single-spa](https://single-spa.js.org/) example React microapp.
4+
5+
> NOTE. This application have been configured to be run as child app of a single-spa application. So while this app can be deployed and run independently, we would need some frame [single-spa](https://single-spa.js.org/) which would load it. While technically we can achieve running this app as standalone app it's strongly not recommended by the author of the `single-spa` approach, see this [GitHub Issue](https://github.com/single-spa/single-spa/issues/640) for details.
6+
7+
## Requirements
8+
9+
- node - v10.22.1
10+
- npm - v6.14.6
11+
12+
## Technology Stack
13+
14+
- React 16.12
15+
- Router via [Reach Router](https://reach.tech/router/)
16+
- CSS Modules with SCSS
17+
- [React Inline SVG](https://github.com/airbnb/babel-plugin-inline-react-svg)
18+
- We use **Redux Store** for storing page data if we need to edit it. Otherwise we can use local state.
19+
- [react-redux-toastr](https://www.npmjs.com/package/react-redux-toastr) for success/error popups in the bottom left corner.
20+
21+
## Config
22+
23+
For available variables config which depend on the running environment (`APPENV=dev` or `APPENV=prod`), please refer to `config/dev.js` and `config/prod.js`.
24+
25+
For application constants which don't depend on the running environment use `src/constants/index.js`.
26+
27+
## NPM Commands
28+
29+
| Command | Description |
30+
| --------------------- | ----------------------------------------------------------------- |
31+
| `npm start` | Run server which serves production ready build from `dist` folder |
32+
| `npm run dev` | Run app in the development mode |
33+
| `npm run dev-https` | Run app in the development mode using HTTPS protocol |
34+
| `npm run build` | Build app for production and puts files to the `dist` folder |
35+
| `npm run analyze` | Analyze dependencies sizes and opens report in the browser |
36+
| `npm run lint` | Check code for lint errors |
37+
| `npm run format` | Format code using prettier |
38+
| `npm run test` | Run unit tests |
39+
| `npm run watch-tests` | Watch for file changes and run unit tests on changes |
40+
| `npm run coverage` | Generate test code coverage report |
41+
42+
## Deployment to Production
43+
44+
- `npm i` - install dependencies
45+
- `npm build` - build code to `dist/` folder
46+
- Now you can host `dist/` folder using any static server. For example, you may run a simple `Express` server by running `npm start`.
47+
48+
### Deploying to Heroku
49+
50+
Make sure you have [Heroku 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:
51+
52+
- If there is not Git repository initiated yet, create a repo and commit all the files:
53+
- `git init`
54+
- `git add .`
55+
- `git commit -m 'initial commit'`
56+
- `heroku apps:create` - create Heroku app
57+
- `git push heroku master` - push changes to Heroku and trigger deploying
58+
- Now you have to configure frame app to use the URL provided by Heroku like `https://<APP-NAME>.herokuapp.com/topcoder-micro-frontends-teams.js` to load this micro-app.
59+
60+
## How to run Locally for Development
61+
62+
TaaS Admin App is done using Single SPA micro-frontend architecture https://single-spa.js.org/. So to start it, we would also have to run Frame App and Navbar App. Here I would show the steps to run locally everything we need.
63+
64+
### Local Authentication
65+
66+
First of all, to authenticate locally we have to run a local authentication service.
67+
68+
- Clone this repository into `taas-admin-app`.
69+
- Inside the folder `taas-admin-app/auth-local` run `npm start`.
70+
- You would need npm 5+ for it. This would start a local sever on port 5000 which could be used for local Authentication.
71+
72+
### Local Domain
73+
74+
Some config files are using domain `local.topcoder-dev.com`. You can change it to `localhost` in all the configs of each repo mentioned below. Or on your local machine, update file `/etc/hosts` add the line `127.0.0.1 local.topcoder-dev.com`. This file has another path on Windows.
75+
76+
### Run Applications
77+
78+
1. Run **Frame** App:
79+
80+
```sh
81+
git clone https://github.com/topcoder-platform/micro-frontends-frame.git
82+
cd micro-frontends-frame
83+
# inside folder "micro-frontends-frame" run:
84+
85+
nvm use # or make sure to use Node 10
86+
npm i # to install dependencies
87+
88+
# set environment variables:
89+
90+
export APPMODE="development"
91+
export APPENV="local-multi"
92+
93+
npm run local-server
94+
95+
# this would start frame server on http://localhost:3000
96+
```
97+
98+
open one more terminal window in the same folder and run:
99+
100+
```sh
101+
# set environment variables:
102+
103+
export APPMODE="development"
104+
export APPENV="local-multi"
105+
106+
npm run local-client
107+
108+
# this host frame client code on http://localhost:8080
109+
```
110+
111+
2. Run **Navbar** micro-app:
112+
113+
```sh
114+
git clone https://github.com/topcoder-platform/micro-frontends-navbar-app.git
115+
cd micro-frontends-navbar-app
116+
```
117+
118+
Update in file `micro-frontends-navbar-app/config/dev.js` values for `ACCOUNTS_APP_CONNECTOR` and `AUTH` to `http://localhost:5000` so Navbar app which handles authentication uses our local Authentication service.
119+
120+
```sh
121+
# inside folder "micro-frontends-navbar-app" run:
122+
123+
nvm use # or make sure to use Node 10
124+
npm i # to install dependencies
125+
126+
npm run dev
127+
128+
# this host navbar app as http://localhost:3001/navbar/topcoder-micro-frontends-navbar-app.js
129+
```
130+
131+
3. Run **TaaS Admin** micro-app:
132+
133+
```sh
134+
# inside folder "taas-admin-app" run:
135+
136+
nvm use # or make sure to use Node 10
137+
npm i # to install dependencies
138+
139+
npm run dev
140+
141+
# this hosts TaaS Admin App as http://localhost:8502/taas-admin-app/topcoder-micro-frontends-taas-admin-app.js
142+
```
143+
144+
4. Now we have to update the `micro-frontends-frame` app to show our local version of TaaS Admin App, instead of remote one. Update file `micro-frontends-frame/config/micro-frontends-config-local.json`:
145+
146+
```js
147+
// replace line
148+
"@topcoder/micro-frontends-taas-admin-app": "https://platform.topcoder-dev.com/taas-admin-app/topcoder-micro-frontends-taas-admin-app.js",
149+
150+
// with line:
151+
"@topcoder/micro-frontends-taas-admin-app": "http://localhost:8502/taas-admin-app/topcoder-micro-frontends-taas-admin-app.js",
152+
```
153+
154+
- Now open in the browser http://localhost:8080/taas-admin.
155+
- If you are not logged-in yet, you should be redirected to the login page.
156+
- If you cannot see the application and redirect doesn't happen, make sure that file "http://local.topcoder-dev.com:8502/taas-admin-app/topcoder-micro-frontends-taas-admin-app.js" is loaded successfully in the Network tab.
157+
158+
Congratulations, you successfully run the project. If you had some issue, please, try to go through README of https://github.com/topcoder-platform/micro-frontends-frame and https://github.com/topcoder-platform/micro-frontends-navbar-app.

‎auth-local/README

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
1. Run any static files server inside this directory, for example:
2+
- `npx http-server . -p 5000`
3+
- `php -S localhost:5000`
4+
2. Run your application on http://localhost:3000.
5+
3. Now you can open http://localhost:5000 in browser and click login (wait it a little bit, it may take time to redirect you). After you login, you should be redirected back to http://localhost:3000
6+
7+
PS. You may also download latest version of `setupAuth0WithRedirect.js` file from here - https://github.com/topcoder-platform/tc-auth-lib/blob/dev/web-assets/js/setupAuth0WithRedirect.js
8+
9+
10+
11+

‎auth-local/index.html

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<title>Auth0</title>
6+
<meta charset="utf-8" />
7+
<script language="javascript" type="text/javascript" src="./setupAuth0WithRedirect.js"></script>
8+
</head>
9+
10+
<body>
11+
Loaded...redirecting to auth0.(see browser console log)
12+
<script>
13+
window.onload = authSetup;
14+
</script>
15+
<a href="?retUrl=http://localhost:3000" >Login</a>
16+
</body>
17+
18+
</html>

‎auth-local/package.json

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"name": "login-locally",
3+
"version": "1.0.0",
4+
"description": "Run any static files server inside this directory.",
5+
"scripts": {
6+
"start": "npx http-server . -p 5000"
7+
},
8+
"keywords": [],
9+
"author": "",
10+
"license": "ISC"
11+
}

0 commit comments

Comments
 (0)