Merge branch 'main-page' into 'master'

Main page

complete main page

See merge request !1

-[{"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\reportWebVitals.js":"1","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\Landing.js":"2","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Header.js":"3","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\index.js":"4","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Button.js":"5"},{"size":362,"mtime":1606827597211,"results":"6","hashOfConfig":"7"},{"size":0,"mtime":1607082038941,"results":"8","hashOfConfig":"7"},{"size":213,"mtime":1607081885405,"results":"9","hashOfConfig":"7"},{"size":287,"mtime":1607081544438,"results":"10","hashOfConfig":"7"},{"size":356,"mtime":1607081873376,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"dlgyj4",{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"20","messages":"21","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\reportWebVitals.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\Landing.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Header.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\index.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Button.js",[]]
\ No newline at end of file
+[{"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\reportWebVitals.js":"1","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\Landing.js":"2","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Header.js":"3","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\index.js":"4","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Button.js":"5","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\App.js":"6","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\Main.js":"7","C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\AnalysisPose.js":"8"},{"size":362,"mtime":1606827597211,"results":"9","hashOfConfig":"10"},{"size":0,"mtime":1607082038941,"results":"11","hashOfConfig":"10"},{"size":746,"mtime":1607265954632,"results":"12","hashOfConfig":"10"},{"size":287,"mtime":1607081544438,"results":"13","hashOfConfig":"10"},{"size":353,"mtime":1607264649923,"results":"14","hashOfConfig":"10"},{"size":570,"mtime":1607264613644,"results":"15","hashOfConfig":"10"},{"size":3214,"mtime":1607500306215,"results":"16","hashOfConfig":"10"},{"size":5932,"mtime":1607499647762,"results":"17","hashOfConfig":"10"},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"dlgyj4",{"filePath":"20","messages":"21","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"22","messages":"23","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"24","messages":"25","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"26"},{"filePath":"27","messages":"28","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"29","messages":"30","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"31","messages":"32","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"33","messages":"34","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\reportWebVitals.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\Landing.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Header.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\index.js",[],["35","36"],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\components\\Button.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\App.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\Main.js",[],"C:\\Users\\mylit\\Documents\\OSW-HW\\Straight-Up\\straight-up\\src\\AnalysisPose.js",[],{"ruleId":"37","replacedBy":"38"},{"ruleId":"39","replacedBy":"40"},"no-native-reassign",["41"],"no-negated-in-lhs",["42"],"no-global-assign","no-unsafe-negation"]
\ No newline at end of file

@@ -13,6 +13,7 @@
 
 # misc
 .DS_Store
+.env
 .env.local
 .env.development.local
 .env.test.local

@@ -6,6 +6,15 @@
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
+    "axios": "^0.21.0",
+    "body-parser": "^1.19.0",
+    "dot": "^1.1.3",
+    "dotenv": "^8.2.0",
+    "env": "0.0.2",
+    "express": "^4.17.1",
+    "http-proxy-middleware": "^1.0.6",
+    "moment": "^2.29.1",
+    "multer": "^1.4.2",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-router-dom": "^5.2.0",
@@ -13,7 +22,9 @@
     "web-vitals": "^0.2.4"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "start": "npm-run-all --parallel start:**",
+    "start:client": "react-scripts start",
+    "start:server": "node ./server/app.js",
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
@@ -35,5 +46,8 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "npm-run-all": "^4.1.5"
   }
 }

+const express = require('express');
+const bodyParser = require('body-parser')
+const app = express();
+const api = require('./routes/index');
+
+app.use(bodyParser.json());
+app.use('/api', api);
+
+const port = 3001;
+app.listen(port, () => console.log(`Listening on port ${port}`));
\ No newline at end of file

+const express = require('express');
+const router = express.Router();
+
+router.get('/', (req, res) => res.json({data:'this is index.'}));
+
+module.exports = router
\ No newline at end of file

+//두 좌표 사이의 거리를 반환하는 함수
+function distance(x1, y1, x2, y2) {
+    var x = Math.abs(x1 - x2);
+    var y = Math.abs(y1 - y2);
+    var result = Math.hypot(x, y);
+    return result;
+}
+
+//두 길이의 차이를 %비로 반환하는 함수
+function difference(d1, d2) {
+    if (d1 > d2) {
+        return (1 - (d2 / d1)) * 100;
+    } else if (d1 < d2) {
+        return (1 - (d1 / d2)) * 100;
+    } else if (d1 === d2) {
+        return 0;
+    }
+}
+
+//객체와 방향정보를 받아 자세정보를 반환하는 함수
+const checkStraight = (resData, position) => { //resData: API로 받은 JSON 객체, position: 사진의 방향정보
+    var trust_value = []; //17개의 신체부위 좌표에 대한 신뢰도를 저장할 배열
+    var x_position = []; //17개의 신체부위의 X좌표값을 저장할 배열
+    var y_position = []; //17개의 신체부위의 Y좌표값을 저장할 배열
+    const neck_maximum_angle = (180 * 30) / Math.PI; //어깨-귀 각도가 30도 이상일 경우 > 거북목
+    const back_minimum_angle = (180 * 70) / Math.PI; //엉덩이-어깨 각도가 70도 이하일 경우 > 굽은등
+    let ear = 3;
+    let shoulder = 5;
+    let hip = 11;
+    for (let i = 0; i < 49; i += 3) {
+        x_position.push(resData[i]);
+        y_position.push(resData[i + 1]);
+        trust_value.push(resData[i + 2]);
+    }
+    if (position === 'front') { //정면 사진일 경우
+        //사용할 데이터의 신뢰도가 0.4 미만이면 실행하지 않음
+        if (trust_value[ear] < 0.4) {
+            return 'error_low_trust_value (keypoint:left_ear:4)'
+        }
+        if (trust_value[ear + 1] < 0.4) {
+            return 'error_low_trust_value (keypoint:right_ear:5)'
+        }
+        if (trust_value[shoulder] < 0.4) {
+            return 'error_low_trust_value (keypoint:left_shoulder:6)'
+        }
+        if (trust_value[shoulder + 1] < 0.4) {
+            return 'error_low_trust_value (keypoint:right_shoulder_7)'
+        }
+
+        //왼쪽귀(4)-왼쪽어깨(6) 거리와 오른쪽귀(5)-오른쪽어깨(7) 거리가 30% 이상 차이날 경우 > 좌우편향
+        var d_left = distance(x_position[ear], y_position[ear], x_position[shoulder], y_position[shoulder]);
+        var d_right = distance(x_position[ear + 1], y_position[ear + 1], x_position[shoulder + 1], y_position[shoulder + 1]);
+        var gap = difference(d_left, d_right);
+
+        if (gap >= 20) { //기운 각도가 20도를 넘을 경우
+            if (d_left > d_right) { //오른쪽으로 기울인 경우
+                return 'leaning right by ' + gap + 'percent.';
+            } else if (d_left < d_right) { //왼쪽으로 기울인 경우
+                return 'leaning left by ' + gap + 'percent.';
+            }
+        } else { //기운 각도가 20도 미만인 경우
+            return 'okay';
+        }
+
+
+    }
+    else {
+        if (position === 'right') {
+            ear++;
+            shoulder++;
+            hip++;
+        }
+        if (trust_value[hip] < 0.4) { //사용할 데이터의 신뢰도가 0.4 미만이면 실행하지 않음
+            return `error_low_trust_value (keypoint:${position}hip)`;
+        }
+        if (trust_value[shoulder] < 0.4) {
+            return `error_low_trust_value (keypoint:${position}shoulder)`;
+        }
+        if (trust_value[ear] < 0.4) {
+            return `error_low_trust_value (keypoint:${position}ear)`;
+        }
+        //엉덩이(12)-어깨(6) 각도가 70도 이하일 경우 > 굽은등
+
+        var back_d1 = Math.abs(x_position[hip] - x_position[shoulder]);
+        var back_d2 = Math.abs(y_position[hip] - y_position[shoulder]);
+        var back_angle = Math.atan(back_d2 / back_d1);
+        var back_angle_rad = (180 * back_angle) / Math.PI; //라디안 > 육십분법 변환
+        if (back_angle_rad <= back_minimum_angle) {
+            return 'bent_back';
+        }
+        //어깨(6)-귀(4) 각도가 30도 이상일 경우 > 거북목
+        var neck_d1 = Math.abs(y_position[ear] - y_position[shoulder]);
+        var neck_d2 = Math.abs(x_position[ear] - x_position[shoulder]);
+        var neck_angle = Math.atan(neck_d2 / neck_d1);
+        var neck_angle_rad = (180 * neck_angle) / Math.PI; //라디안 > 육십분법 변환
+        if (neck_angle_rad >= neck_maximum_angle) {
+            return 'bent_neck';
+        }
+        //굽은등, 거북목 모두 없을 경우
+        return 'okay';
+    }
+}
+
+export default checkStraight;
\ No newline at end of file

 import React from 'react';
 import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
 import Landing from './Landing';
+import Main from './Main';
 
 
 class App extends React.Component {
@@ -9,6 +10,7 @@ class App extends React.Component {
             <Router>
                 <Switch>
                     <Route exact path="/landing" component={Landing} />
+                    <Route exact path="/main" component={Main} />
                     <Redirect path="*" to="/landing" /> 
                 </Switch>
             </Router>

+import React, { useState } from 'react'
+import Header from './components/Header';
+import checkStraight from './AnalysisPose';
+import './style/Main.css';
+require('dotenv').config();
+
+const axios = require('axios');
+const API_KEY = "1f14e860f7f53f39a4dfe0a2a919a8c7";
+//process.env.api_key;
+let imageFormData = new FormData();
+
+export default function Main() {
+    const [imgBase64, setImgBase64] = useState("");
+    const [img, setImage] = useState(null);
+    const handleChangeFile = (event) => {
+        let reader = new FileReader();
+        reader.onloadend = () => {
+            const base64 = reader.result;
+            if (base64) {
+                setImgBase64(base64.toString());
+            }
+        }
+        if (event.target.files[0]) {
+            reader.readAsDataURL(event.target.files[0]); // 1. 파일을 읽어 버퍼에 저장합니다.
+            setImage(event.target.files[0]); // 파일 상태 업데이트
+        }
+    }
+
+    const analysisImage = () => {
+        imageFormData.append('file', img);
+        axios({
+            method: 'post',
+            url: "https://cors-anywhere.herokuapp.com/https://cv-api.kakaobrain.com/pose",
+            headers: {
+                'Authorization': `KakaoAK ${API_KEY}`,
+                'Content-Type': 'multipart/form-data',
+                'X-Requested-With': '*'
+            },
+            data: imageFormData
+        }).then(function (response) {
+            const resdata = response.data[0].keypoints;
+            console.log(resdata[0]);
+            const result = checkStraight(resdata, 'front');
+            console.log(result);
+
+            // console.log(resdata[0] === )
+        }).catch(function (error) {
+            if (error.response) {
+                // 요청이 이루어졌으며 서버가 2xx의 범위를 벗어나는 상태 코드로 응답했습니다.
+                console.log(error.response.data);
+                console.log(error.response.status);
+                console.log(error.response.headers);
+            }
+            else if (error.request) {
+                // 요청이 이루어 졌으나 응답을 받지 못했습니다.
+                // `error.request`는 브라우저의 XMLHttpRequest 인스턴스 또는
+                // Node.js의 http.ClientRequest 인스턴스입니다.
+                console.log(error.request);
+            }
+            else {
+                // 오류를 발생시킨 요청을 설정하는 중에 문제가 발생했습니다.
+                console.log('Error', error.message);
+            }
+            console.log(error.config);
+        });
+    }
+    return (
+        <div>
+            <Header />
+            <span>This is Main Page</span>
+            <div className="Image-Preview-Container" style={{ "backgroundColor": "#efefef", "width": "400px", "height": "400px" }}>
+                <img className="Image-Preview" alt="preview" src={imgBase64}></img>
+            </div>
+            <div className="Image_input">
+                <input type="file" name="file" onChange={handleChangeFile} />
+                <button type="button" onClick={analysisImage} >Submit</button>
+            </div>
+        </div>
+    )
+}

@@ -5,10 +5,9 @@ import "../style/Landing.css";
 const Button = () => {
     return (
         <div className="mainBtnContainer">
-            <Link to='./main'>
+            <Link to="/main">
                 <button className="startBtn">Get Started!</button>
             </Link>
-
         </div>
     )
 }

 import React from 'react'
-
+import { Link } from 'react-router-dom';
+import logo from '../style/Logo.JPG';
 const Header = () => {
     return (
-        <div className="Header">
-            <img src="../style/Logo.jpg" alt="Logo"></img>
+        <div className="HeaderContainer"
+            style={{
+                display: 'inline-block',
+                width: '100vw',
+                height: '100px',
+                background: '#2f3640'
+            }}
+        >
+
+            <div className="logo">
+                <Link to="/landing">
+                    <img
+                        src={logo}
+                        width='100px'
+                        height='100px'
+                        alt="Logo"></img>
+                </Link>
+            </div>
+
+
         </div>
     )
 }

+const proxy = require('http-proxy-middleware');
+
+module.exports = function (app) {
+    app.use(
+        proxy('/api', {
+            target: 'http://localhost:3001/'
+        })
+    );
+};
\ No newline at end of file

@@ -17,6 +17,7 @@ body {
     width: 100vw;
     height: 100vh;
 }
+/*
 .Landingbg:after {
     content: '';
     position: absolute;
@@ -28,7 +29,7 @@ body {
     background: rgba(0,0,0,0.001);
     box-shadow: inset 100px 100px 250px #000000, inset -100px -100px 250px #000000;
 }
-
+*/
 .mainTextContainer{
     text-align: center;
     position: relative;
@@ -60,5 +61,5 @@ body {
 }
 
 .startBtn:hover {
-    opacity: 0.5;
+    opacity: 0.8;
 }
\ No newline at end of file

+.Image-Preview{
+    width: 400px;
+    height: 400px;
+}
\ No newline at end of file

@@ -1700,6 +1700,13 @@
   resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-5.1.1.tgz#3c9ee980f1a10d6021ae6632ca3e79ca2ec4fb50"
   integrity sha512-giAlZwstKbmvMk1OO7WXSj4OZ0keXAcl2TQq4LWHiiPH2ByaH7WeUzng+Qej8UPxxv+8lRTuouo0iaNDBuzIBA==
 
+"@types/http-proxy@^1.17.4":
+  version "1.17.4"
+  resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.4.tgz#e7c92e3dbe3e13aa799440ff42e6d3a17a9d045b"
+  integrity sha512-IrSHl2u6AWXduUaDLqYpt45tLVCtYv7o4Z0s1KghBCDgIIS9oW5K1H8mZG/A2CfeLdEa7rTd1ACOiHBc1EMT2Q==
+  dependencies:
+    "@types/node" "*"
+
 "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0", "@types/istanbul-lib-coverage@^2.0.1":
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz#4ba8ddb720221f432e443bd5f9117fd22cfd4762"
@@ -2467,6 +2474,13 @@ axe-core@^4.0.2:
   resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.1.1.tgz#70a7855888e287f7add66002211a423937063eaf"
   integrity sha512-5Kgy8Cz6LPC9DJcNb3yjAXTu3XihQgEdnIg50c//zOC/MyLP0Clg+Y8Sh9ZjjnvBrDZU4DgXS9C3T9r4/scGZQ==
 
+axios@^0.21.0:
+  version "0.21.0"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.0.tgz#26df088803a2350dff2c27f96fef99fe49442aca"
+  integrity sha512-fmkJBknJKoZwem3/IKSSLpkdNXZeBu5Q7GA/aRsr2btgrptmSCxi2oFjZHqGdK9DoTil9PIHlPIZw2EcRJXRvw==
+  dependencies:
+    follow-redirects "^1.10.0"
+
 axobject-query@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"
@@ -2718,7 +2732,7 @@ bn.js@^5.0.0, bn.js@^5.1.1:
   resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-5.1.3.tgz#beca005408f642ebebea80b042b4d18d2ac0ee6b"
   integrity sha512-GkTiFpjFtUzU9CbMeJ5iazkCzGL3jrhzerzZIuqLABjbwRaFt33I9tUdSNryIptM+RxDet6OKm2WnLXzW51KsQ==
 
-body-parser@1.19.0:
+body-parser@1.19.0, body-parser@^1.19.0:
   version "1.19.0"
   resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.19.0.tgz#96b2709e57c9c4e09a6fd66a8fd979844f69f08a"
   integrity sha512-dhEPs72UPbDnAQJ9ZKMNTP6ptJaionhP5cBb541nXPlW60Jepo9RV/a4fX4XWW9CuFNK22krhrj1+rgzifNCsw==
@@ -3541,7 +3555,7 @@ cross-spawn@7.0.3, cross-spawn@^7.0.0, cross-spawn@^7.0.2:
     shebang-command "^2.0.0"
     which "^2.0.1"
 
-cross-spawn@^6.0.0:
+cross-spawn@^6.0.0, cross-spawn@^6.0.5:
   version "6.0.5"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
   integrity sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==
@@ -4145,7 +4159,7 @@ dotenv-expand@5.1.0:
   resolved "https://registry.yarnpkg.com/dotenv-expand/-/dotenv-expand-5.1.0.tgz#3fbaf020bfd794884072ea26b1e9791d45a629f0"
   integrity sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==
 
-dotenv@8.2.0:
+dotenv@8.2.0, dotenv@^8.2.0:
   version "8.2.0"
   resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-8.2.0.tgz#97e619259ada750eea3e4ea3e26bceea5424b16a"
   integrity sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==
@@ -4997,7 +5011,7 @@ flush-write-stream@^1.0.0:
     inherits "^2.0.3"
     readable-stream "^2.3.6"
 
-follow-redirects@^1.0.0:
+follow-redirects@^1.0.0, follow-redirects@^1.10.0:
   version "1.13.0"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.0.tgz#b42e8d93a2a7eea5ed88633676d6597bc8e384db"
   integrity sha512-aq6gF1BEKje4a9i9+5jimNFIpq4Q1WiwBToeRK5NvZBd/TRsmW8BsJfOEGkr76TbOyPVD3OVDN910EcUNtRYEA==
@@ -5563,7 +5577,18 @@ http-proxy-middleware@0.19.1:
     lodash "^4.17.11"
     micromatch "^3.1.10"
 
-http-proxy@^1.17.0:
+http-proxy-middleware@^1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-1.0.6.tgz#0618557722f450375d3796d701a8ac5407b3b94e"
+  integrity sha512-NyL6ZB6cVni7pl+/IT2W0ni5ME00xR0sN27AQZZrpKn1b+qRh+mLbBxIq9Cq1oGfmTc7BUq4HB77mxwCaxAYNg==
+  dependencies:
+    "@types/http-proxy" "^1.17.4"
+    http-proxy "^1.18.1"
+    is-glob "^4.0.1"
+    lodash "^4.17.20"
+    micromatch "^4.0.2"
+
+http-proxy@^1.17.0, http-proxy@^1.18.1:
   version "1.18.1"
   resolved "https://registry.yarnpkg.com/http-proxy/-/http-proxy-1.18.1.tgz#401541f0534884bbf95260334e72f88ee3976549"
   integrity sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==
@@ -6827,6 +6852,16 @@ load-json-file@^2.0.0:
     pify "^2.0.0"
     strip-bom "^3.0.0"
 
+load-json-file@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-4.0.0.tgz#2f5f45ab91e33216234fd53adab668eb4ec0993b"
+  integrity sha1-L19Fq5HjMhYjT9U62rZo607AmTs=
+  dependencies:
+    graceful-fs "^4.1.2"
+    parse-json "^4.0.0"
+    pify "^3.0.0"
+    strip-bom "^3.0.0"
+
 loader-runner@^2.4.0:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.4.0.tgz#ed47066bfe534d7e84c4c7b9998c2a75607d9357"
@@ -7041,6 +7076,11 @@ memory-fs@^0.5.0:
     errno "^0.1.3"
     readable-stream "^2.0.1"
 
+memorystream@^0.3.1:
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/memorystream/-/memorystream-0.3.1.tgz#86d7090b30ce455d63fbae12dda51a47ddcaf9b2"
+  integrity sha1-htcJCzDORV1j+64S3aUaR93K+bI=
+
 merge-descriptors@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz#b00aaa556dd8b44568150ec9d1b953f3f90cbb61"
@@ -7460,6 +7500,21 @@ normalize-url@^3.0.0:
   resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-3.3.0.tgz#b2e1c4dc4f7c6d57743df733a4f5978d18650559"
   integrity sha512-U+JJi7duF1o+u2pynbp2zXDW2/PADgC30f0GsHZtRh+HOcXHnw137TrNlyxxRvWW5fjKd3bcLHPxofWuCjaeZg==
 
+npm-run-all@^4.1.5:
+  version "4.1.5"
+  resolved "https://registry.yarnpkg.com/npm-run-all/-/npm-run-all-4.1.5.tgz#04476202a15ee0e2e214080861bff12a51d98fba"
+  integrity sha512-Oo82gJDAVcaMdi3nuoKFavkIHBRVqQ1qvMb+9LHk/cF4P6B2m8aP04hGf7oL6wZ9BuGwX1onlLhpuoofSyoQDQ==
+  dependencies:
+    ansi-styles "^3.2.1"
+    chalk "^2.4.1"
+    cross-spawn "^6.0.5"
+    memorystream "^0.3.1"
+    minimatch "^3.0.4"
+    pidtree "^0.3.0"
+    read-pkg "^3.0.0"
+    shell-quote "^1.6.1"
+    string.prototype.padend "^3.0.0"
+
 npm-run-path@^2.0.0:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-2.0.2.tgz#35a9232dfa35d7067b4cb2ddf2357b1871536c5f"
@@ -7912,6 +7967,13 @@ path-type@^2.0.0:
   dependencies:
     pify "^2.0.0"
 
+path-type@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/path-type/-/path-type-3.0.0.tgz#cef31dc8e0a1a3bb0d105c0cd97cf3bf47f4e36f"
+  integrity sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==
+  dependencies:
+    pify "^3.0.0"
+
 path-type@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
@@ -7938,11 +8000,21 @@ picomatch@^2.0.4, picomatch@^2.0.5, picomatch@^2.2.1, picomatch@^2.2.2:
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"
   integrity sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==
 
+pidtree@^0.3.0:
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/pidtree/-/pidtree-0.3.1.tgz#ef09ac2cc0533df1f3250ccf2c4d366b0d12114a"
+  integrity sha512-qQbW94hLHEqCg7nhby4yRC7G2+jYHY4Rguc2bjw7Uug4GIJuu1tvf2uHaZv5Q8zdt+WKJ6qK1FOI6amaWUo5FA==
+
 pify@^2.0.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
   integrity sha1-7RQaasBDqEnqWISY59yosVMw6Qw=
 
+pify@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176"
+  integrity sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=
+
 pify@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/pify/-/pify-4.0.1.tgz#4b2cd25c50d598735c50292224fd8c6df41e3231"
@@ -9115,6 +9187,15 @@ read-pkg@^2.0.0:
     normalize-package-data "^2.3.2"
     path-type "^2.0.0"
 
+read-pkg@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/read-pkg/-/read-pkg-3.0.0.tgz#9cbc686978fee65d16c00e2b19c237fcf6e38389"
+  integrity sha1-nLxoaXj+5l0WwA4rGcI3/Pbjg4k=
+  dependencies:
+    load-json-file "^4.0.0"
+    normalize-package-data "^2.3.2"
+    path-type "^3.0.0"
+
 read-pkg@^5.2.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/read-pkg/-/read-pkg-5.2.0.tgz#7bf295438ca5a33e56cd30e053b34ee7250c93cc"
@@ -9792,7 +9873,7 @@ shebang-regex@^3.0.0:
   resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172"
   integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==
 
-shell-quote@1.7.2:
+shell-quote@1.7.2, shell-quote@^1.6.1:
   version "1.7.2"
   resolved "https://registry.yarnpkg.com/shell-quote/-/shell-quote-1.7.2.tgz#67a7d02c76c9da24f99d20808fcaded0e0e04be2"
   integrity sha512-mRz/m/JVscCrkMyPqHc/bczi3OQHkLTqXHEFu0zDhK/qfv3UcOA4SVmRCLmos4bhjr9ekVQubj/R7waKapmiQg==
@@ -10162,6 +10243,15 @@ string.prototype.matchall@^4.0.2:
     regexp.prototype.flags "^1.3.0"
     side-channel "^1.0.3"
 
+string.prototype.padend@^3.0.0:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/string.prototype.padend/-/string.prototype.padend-3.1.1.tgz#824c84265dbac46cade2b957b38b6a5d8d1683c5"
+  integrity sha512-eCzTASPnoCr5Ht+Vn1YXgm8SB015hHKgEIMu9Nr9bQmLhRBxKRfmzSj/IQsxDFc8JInJDDFA0qXwK+xxI7wDkg==
+  dependencies:
+    call-bind "^1.0.0"
+    define-properties "^1.1.3"
+    es-abstract "^1.18.0-next.1"
+
 string.prototype.trimend@^1.0.1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.3.tgz#a22bd53cca5c7cf44d7c9d5c732118873d6cd18b"