Api module, proxy

육현진
Commit cb102ed8ab2501245f2bec42d6b96390e59b200b cb102ed8 1 parent 2d1a4936
Showing 6 changed files with 164 additions and 10 deletions
client/.eslintcache
client/src/App.js
client/src/setupProxy.js
package-lock.json
package.json
server.js
--- a/client/.eslintcache
View file @cb102ed
+++ b/client/.eslintcache
View file @cb102ed
--- a/client/src/App.js
View file @cb102ed
+++ b/client/src/App.js
View file @cb102ed
@@ -45,6 +45,23 @@ const students = [
 }]
 class App extends Component{
+
+  state = {
+    students: ""
+  }
+
+  componentDidMount() {
+    this.callApi()
+      .then(res => this.setState({students: res}))
+      .catch(err => console.log(err));
+  }
+
+  callApi=async()=>{
+    const response = await fetch('/api/students');
+    const body = await response.json();
+    return body;
+  }
+
   render(){
     const {classes}= this.props;
@@ -54,6 +71,7 @@ class App extends Component{
           <Table className={classes.table}>
           <TableHead>
+            <TableRow>
             <TableCell>코드번호</TableCell>
             <TableCell>이름</TableCell>
             <TableCell>학번</TableCell>
@@ -63,11 +81,13 @@ class App extends Component{
             <TableCell>과제</TableCell>
             <TableCell>출석</TableCell>
             <TableCell>학점</TableCell>
+            </TableRow>
           </TableHead>
             <TableBody>
             {
-            students.map(c=>{
+            this.state.students ?
+            this.state.students.map(c=>{
               return (
                 <Student
                   key={c.st_Code}
@@ -82,7 +102,7 @@ class App extends Component{
                   st_Score={c.st_Score}
                   />
               );
-            })
+            }) : ""
           } 
             </TableBody>
--- a/client/src/setupProxy.js 0 → 100644
View file @cb102ed
+++ b/client/src/setupProxy.js 0 → 100644
View file @cb102ed
+const proxy = require("http-proxy-middleware");
+
+module.exports = function(app) {
+  app.use(proxy("/api/students", { target: "http://localhost:5000" }));
+};
\ No newline at end of file
--- a/package-lock.json
View file @cb102ed
+++ b/package-lock.json
View file @cb102ed
 {
-    "name": "Student",
+    "name": "student_management",
     "version": "1.0.0",
     "lockfileVersion": 1,
     "requires": true,
     "dependencies": {
+        "@types/http-proxy": {
+            "version": "1.17.4",
+            "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.4.tgz",
+            "integrity": "sha512-IrSHl2u6AWXduUaDLqYpt45tLVCtYv7o4Z0s1KghBCDgIIS9oW5K1H8mZG/A2CfeLdEa7rTd1ACOiHBc1EMT2Q==",
+            "requires": {
+                "@types/node": "*"
+            }
+        },
+        "@types/node": {
+            "version": "14.14.10",
+            "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.10.tgz",
+            "integrity": "sha512-J32dgx2hw8vXrSbu4ZlVhn1Nm3GbeCFNw2FWL8S5QKucHGY0cyNwjdQdO+KMBZ4wpmC7KhLCiNsdk1RFRIYUQQ=="
+        },
         "accepts": {
             "version": "1.3.7",
             "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.7.tgz",
@@ -50,6 +63,14 @@
                 "type-is": "~1.6.17"
             }
         },
+        "braces": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+            "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+            "requires": {
+                "fill-range": "^7.0.1"
+            }
+        },
         "bytes": {
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz",
@@ -220,6 +241,11 @@
             "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
             "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
         },
+        "eventemitter3": {
+            "version": "4.0.7",
+            "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
+            "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw=="
+        },
         "express": {
             "version": "4.17.1",
             "resolved": "https://registry.npmjs.org/express/-/express-4.17.1.tgz",
@@ -257,6 +283,14 @@
                 "vary": "~1.1.2"
             }
         },
+        "fill-range": {
+            "version": "7.0.1",
+            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+            "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+            "requires": {
+                "to-regex-range": "^5.0.1"
+            }
+        },
         "finalhandler": {
             "version": "1.1.2",
             "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz",
@@ -280,6 +314,11 @@
                 "locate-path": "^3.0.0"
             }
         },
+        "follow-redirects": {
+            "version": "1.13.0",
+            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.0.tgz",
+            "integrity": "sha512-aq6gF1BEKje4a9i9+5jimNFIpq4Q1WiwBToeRK5NvZBd/TRsmW8BsJfOEGkr76TbOyPVD3OVDN910EcUNtRYEA=="
+        },
         "forwarded": {
             "version": "0.1.2",
             "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
@@ -335,6 +374,28 @@
                 "toidentifier": "1.0.0"
             }
         },
+        "http-proxy": {
+            "version": "1.18.1",
+            "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
+            "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
+            "requires": {
+                "eventemitter3": "^4.0.0",
+                "follow-redirects": "^1.0.0",
+                "requires-port": "^1.0.0"
+            }
+        },
+        "http-proxy-middleware": {
+            "version": "1.0.6",
+            "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-1.0.6.tgz",
+            "integrity": "sha512-NyL6ZB6cVni7pl+/IT2W0ni5ME00xR0sN27AQZZrpKn1b+qRh+mLbBxIq9Cq1oGfmTc7BUq4HB77mxwCaxAYNg==",
+            "requires": {
+                "@types/http-proxy": "^1.17.4",
+                "http-proxy": "^1.18.1",
+                "is-glob": "^4.0.1",
+                "lodash": "^4.17.20",
+                "micromatch": "^4.0.2"
+            }
+        },
         "iconv-lite": {
             "version": "0.4.24",
             "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@@ -368,12 +429,30 @@
                 "has": "^1.0.3"
             }
         },
+        "is-extglob": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+            "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+        },
         "is-fullwidth-code-point": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
             "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
             "dev": true
         },
+        "is-glob": {
+            "version": "4.0.1",
+            "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
+            "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
+            "requires": {
+                "is-extglob": "^2.1.1"
+            }
+        },
+        "is-number": {
+            "version": "7.0.0",
+            "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+            "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng=="
+        },
         "json-parse-better-errors": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
@@ -393,8 +472,7 @@
         "lodash": {
             "version": "4.17.20",
             "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz",
-            "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==",
+            "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA=="
-            "dev": true
         },
         "media-typer": {
             "version": "0.3.0",
@@ -411,6 +489,15 @@
             "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
             "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
         },
+        "micromatch": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.2.tgz",
+            "integrity": "sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==",
+            "requires": {
+                "braces": "^3.0.1",
+                "picomatch": "^2.0.5"
+            }
+        },
         "mime": {
             "version": "1.6.0",
             "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
@@ -515,6 +602,11 @@
             "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
             "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
         },
+        "picomatch": {
+            "version": "2.2.2",
+            "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",
+            "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg=="
+        },
         "pify": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
@@ -574,6 +666,11 @@
             "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
             "dev": true
         },
+        "requires-port": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+            "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
+        },
         "resolve": {
             "version": "1.19.0",
             "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.19.0.tgz",
@@ -730,6 +827,14 @@
                 "has-flag": "^3.0.0"
             }
         },
+        "to-regex-range": {
+            "version": "5.0.1",
+            "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+            "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+            "requires": {
+                "is-number": "^7.0.0"
+            }
+        },
         "toidentifier": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
--- a/package.json
View file @cb102ed
+++ b/package.json
View file @cb102ed
 {
-    "name": "Student",
+    "name": "student_management",
     "version": "1.0.0",
     "scripts": {
         "client": "cd client && npm start",
         "server": "nodemon server.js",
-        "dev": "concurrently --kill-others-on-fail \"yarn server\" \"yarn client\""
+        "dev": "concurrently --kill-others-on-fail \"npm run server\" \"npm run client\""
     },
     "dependencies": {
         "body-parser": "^1.19.0",
-        "express": "4.17.1"
+        "express": "4.17.1",
+        "http-proxy-middleware": "^1.0.6"
     },
     "devDependencies": {
         "concurrently": "^5.3.0"
--- a/server.js
View file @cb102ed
+++ b/server.js
View file @cb102ed
@@ -6,8 +6,31 @@ const port = process.env.process || 5000;
 app.use(bodyparser.json());
 app.use(bodyparser.urlencoded({ extended: true}));
-app.get('/api/hello', (req, res)=>{
+app.get('/api/students', (req, res)=>{
-    res.send({message: 'Hello Express!'});
+    res.send([
+        {
+            'st_Code': 6666,
+            'st_Name': '육현진',
+            'st_Id': 2018102210,
+            'st_Major':'컴퓨터공학과',
+            'st_Midscore': 100,
+            'st_Finalscore': 100,
+            'st_Assignscore': 100,
+            'st_Attendscore': 100,
+            'st_Score':'A+'
+          },
+          {
+            'st_Code': 1111,
+            'st_Name': '김창동',
+            'st_Id': 2020021120,
+            'st_Major':'컴퓨터공학과',
+            'st_Midscore': 79,
+            'st_Finalscore': 85,
+            'st_Assignscore': 100,
+            'st_Attendscore': 90,
+            'st_Score':'A0'
+          }
+    ]);
 });
 app.listen(port, () => console.log(`Listening on port ${port}`));
\ No newline at end of file