backend/public/static/js/app.d7bc7e91d6675626d211.js

+webpackJsonp([1],{"7fcB":function(t,e){},Jcvg:function(t,e){},NHnr:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n("7+uW"),s={render:function(){var t=this.$createElement,e=this._self._c||t;return e("div",{attrs:{id:"app"}},[e("router-view")],1)},staticRenderFns:[]};var i=n("VU/8")({name:"App"},s,!1,function(t){n("gsu9")},null,null).exports,a=n("/ocq"),r={data:function(){return{id:"",pwd:"",flag:!1}},computed:{changeID:function(){this.id=""+this.id},changePWD:function(){this.pwd=""+this.pwd},logged_io:function(){return!this.flag}},methods:{login:function(){""!=this.id&&""!=this.pwd?(alert(this.id+"  login!!"),this.flag=!this.flag,this.id="",this.pwd=""):alert("ID/PASSWORD를 입력하세요")},logout:function(){this.flag=!this.flag}}},l={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("html",{attrs:{lang:"en"}},[t._m(0),t._v(" "),n("body",[n("header",{staticClass:"header"},[n("h1",[t._v("Majorbook")]),t._v(" "),n("div",{attrs:{align:"right"}},[t.logged_io?[t._v("\n          ID : "),n("input",{directives:[{name:"model",rawName:"v-model",value:t.id,expression:"id"}],attrs:{placeholder:"ID",type:"text",required:""},domProps:{value:t.id},on:{input:function(e){e.target.composing||(t.id=e.target.value)}}}),t._v("\n          PASSWORD : "),n("input",{directives:[{name:"model",rawName:"v-model",value:t.pwd,expression:"pwd"}],attrs:{placeholder:"password",type:"password",required:""},domProps:{value:t.pwd},on:{input:function(e){e.target.composing||(t.pwd=e.target.value)}}}),t._v(" "),n("button",{staticClass:"btn",on:{click:t.login}},[t._v("Login")]),t._v(" "),t._m(1)]:[n("button",{staticClass:"btn"},[t._v("거래현황")]),t._v(" "),n("button",{staticClass:"btn",on:{click:t.logout}},[t._v("Logout")])]],2)]),t._v(" "),n("nav",{staticClass:"nav"},[n("router-link",{attrs:{to:"/myPage"}},[t._v("my Page")]),t._v(" "),n("router-link",{attrs:{to:"/buy"}},[t._v("buy")]),t._v(" "),n("router-link",{attrs:{to:"/sell"}},[t._v("sell")]),t._v(" "),n("router-link",{attrs:{to:"/BookIndexPage"}},[t._v("전공서적보기")])],1),t._v(" "),t._m(2),t._v(" "),n("aside",{staticClass:"aside"},[t._v(" 이용방법\n    ")]),t._v(" "),n("footer",{staticClass:"footer"},[t._v("Implemented by 202-WebSysDesign")])])])},staticRenderFns:[function(){var t=this.$createElement,e=this._self._c||t;return e("head",[e("meta",{attrs:{charset:"UTF-8"}}),this._v(" "),e("meta",{attrs:{name:"viewport",content:"width=device-width, initial-scale=1.0"}}),this._v(" "),e("title",[this._v("Majorbook")])])},function(){var t=this.$createElement,e=this._self._c||t;return e("button",{staticClass:"btn"},[e("a",{attrs:{href:"/signup"}},[this._v("Sign up")])])},function(){var t=this.$createElement,e=this._self._c||t;return e("section",{staticClass:"section"},[e("img",{attrs:{src:n("ma8u")}})])}]};var c=n("VU/8")(r,l,!1,function(t){n("Xrvo")},null,null).exports,u={render:function(){this.$createElement;this._self._c;return this._m(0)},staticRenderFns:[function(){var t=this.$createElement,e=this._self._c||t;return e("html",{attrs:{lang:"en"}},[e("head",[e("meta",{attrs:{charset:"UTF-8"}}),this._v(" "),e("meta",{attrs:{name:"viewport",content:"width=device-width, initial-scale=1.0"}}),this._v(" "),e("title",[this._v("Majorbook-My Page")])]),this._v(" "),e("body",[e("h1",[this._v("My Page")]),this._v(" "),e("button",[this._v("수정하기")])])])}]},v=n("VU/8")(null,u,!1,null,null,null).exports,d={render:function(){var t=this.$createElement;return(this._self._c||t)("h1",[this._v(" buy")])},staticRenderFns:[]};var h=n("VU/8")({data:function(){return{name:"",univ:"",email:""}},computed:{},methods:{}},d,!1,function(t){n("Jcvg")},null,null).exports,_={render:function(){var t=this.$createElement;return(this._self._c||t)("h1",[this._v(" sell ")])},staticRenderFns:[]};var p=n("VU/8")({data:function(){return{name:"",univ:"",email:""}},computed:{},methods:{}},_,!1,function(t){n("7fcB")},null,null).exports,m=n("VU/8")(null,null,!1,null,null,null).exports,f={created:function(){var t=this;this.$http.get("/api/books").then(function(e){t.books=e.data})},data:function(){return{books:[]}},methods:{increaseSellCount:function(){this.book.sellcount+=1,this.$http.post("/api/books",this.book).then(function(t){console.log("Increase Buy count success")}).catch(function(t){console.log("Increase Buy count fail")})}}},g={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"books"},[n("h1",[t._v("서적 목록")]),t._v(" "),t._l(t.books,function(e){return n("div",{key:e.id,staticClass:"book"},[n("img",{staticClass:"cover",attrs:{src:e.cover}}),t._v(" "),n("div",[n("strong",[t._v("제목: "+t._s(e.name))]),t._v(" "),n("br"),t._v(" "),n("i",[t._v("작가: "+t._s(e.author))]),t._v(" "),n("br"),t._v("\n            출판사: "+t._s(e.publisher)+"\n            "),n("router-link",{attrs:{to:{name:"bookdetail",params:{id:e.id}}}},[t._v("더보기")]),t._v(" "),n("div",[n("button",{on:{click:function(t){e.buycount++}}},[t._v("구매")]),t._v(" 구매현황: "+t._s(e.buycount)+"\n                "),n("button",{on:{click:function(t){e.sellcount++}}},[t._v("판매")]),t._v(" 판매현황: "+t._s(e.sellcount)+"\n            ")]),t._v(" "),n("hr")],1)])})],2)},staticRenderFns:[]},b=n("VU/8")(f,g,!1,null,null,null).exports,k={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",[n("h1",[t._v("상세 내용")]),t._v(" "),n("img",{staticClass:"cover",attrs:{src:t.book.cover}}),t._v(" "),n("div",[n("strong",[t._v("제목: "+t._s(t.book.name))]),t._v(" "),n("br"),t._v(" "),n("i",[t._v("작가: "+t._s(t.book.author))]),t._v(" "),n("br"),t._v("\n        출판사: "+t._s(t.book.publisher)+"\n        "),n("p",[t._v(" 도서 소개: "+t._s(t.book.description)+" ")]),t._v(" "),n("router-link",{attrs:{to:{name:"bookindex"}}},[t._v("돌아가기")])],1)])},staticRenderFns:[]},y=n("VU/8")({created:function(){var t=this,e=this.$route.params.id;this.$http.get("/api/books/"+e).then(function(e){t.book=e.data[0]})},data:function(){return{book:{}}}},k,!1,null,null,null).exports;o.a.use(a.a);var w=new a.a({mode:"history",routes:[{path:"/",name:"home",component:c},{path:"/myPage",name:"myPage",component:v},{path:"/buy",name:"buy",component:h},{path:"/sell",name:"sell",component:p},{path:"/signup",name:"signup",component:m},{path:"/BookIndexPage",name:"bookindex",component:b},{path:"/BookIndexPage:id",name:"bookdetail",component:y}]}),x=n("mtWM"),$=n.n(x);o.a.prototype.$http=$.a,o.a.config.productionTip=!1,new o.a({el:"#app",router:w,components:{App:i},template:"<App/>"})},Xrvo:function(t,e){},gsu9:function(t,e){},ma8u:function(t,e,n){t.exports=n.p+"static/img/img1.e3d64af.jpg"}},["NHnr"]);
+//# sourceMappingURL=app.d7bc7e91d6675626d211.js.map
\ No newline at end of file

backend/public/static/js/manifest.2ae2e69a05c33dfc65f8.js.map

-{"version":3,"sources":["webpack:///webpack/bootstrap d1997dcbdac0e8e1cecf"],"names":["parentJsonpFunction","window","chunkIds","moreModules","executeModules","moduleId","chunkId","result","i","resolves","length","installedChunks","push","Object","prototype","hasOwnProperty","call","modules","shift","__webpack_require__","s","installedModules","2","exports","module","l","m","c","d","name","getter","o","defineProperty","configurable","enumerable","get","n","__esModule","object","property","p","oe","err","console","error"],"mappings":"aACA,IAAAA,EAAAC,OAAA,aACAA,OAAA,sBAAAC,EAAAC,EAAAC,GAIA,IADA,IAAAC,EAAAC,EAAAC,EAAAC,EAAA,EAAAC,KACQD,EAAAN,EAAAQ,OAAoBF,IAC5BF,EAAAJ,EAAAM,GACAG,EAAAL,IACAG,EAAAG,KAAAD,EAAAL,GAAA,IAEAK,EAAAL,GAAA,EAEA,IAAAD,KAAAF,EACAU,OAAAC,UAAAC,eAAAC,KAAAb,EAAAE,KACAY,EAAAZ,GAAAF,EAAAE,IAIA,IADAL,KAAAE,EAAAC,EAAAC,GACAK,EAAAC,QACAD,EAAAS,OAAAT,GAEA,GAAAL,EACA,IAAAI,EAAA,EAAYA,EAAAJ,EAAAM,OAA2BF,IACvCD,EAAAY,IAAAC,EAAAhB,EAAAI,IAGA,OAAAD,GAIA,IAAAc,KAGAV,GACAW,EAAA,GAIA,SAAAH,EAAAd,GAGA,GAAAgB,EAAAhB,GACA,OAAAgB,EAAAhB,GAAAkB,QAGA,IAAAC,EAAAH,EAAAhB,IACAG,EAAAH,EACAoB,GAAA,EACAF,YAUA,OANAN,EAAAZ,GAAAW,KAAAQ,EAAAD,QAAAC,IAAAD,QAAAJ,GAGAK,EAAAC,GAAA,EAGAD,EAAAD,QAKAJ,EAAAO,EAAAT,EAGAE,EAAAQ,EAAAN,EAGAF,EAAAS,EAAA,SAAAL,EAAAM,EAAAC,GACAX,EAAAY,EAAAR,EAAAM,IACAhB,OAAAmB,eAAAT,EAAAM,GACAI,cAAA,EACAC,YAAA,EACAC,IAAAL,KAMAX,EAAAiB,EAAA,SAAAZ,GACA,IAAAM,EAAAN,KAAAa,WACA,WAA2B,OAAAb,EAAA,SAC3B,WAAiC,OAAAA,GAEjC,OADAL,EAAAS,EAAAE,EAAA,IAAAA,GACAA,GAIAX,EAAAY,EAAA,SAAAO,EAAAC,GAAsD,OAAA1B,OAAAC,UAAAC,eAAAC,KAAAsB,EAAAC,IAGtDpB,EAAAqB,EAAA,IAGArB,EAAAsB,GAAA,SAAAC,GAA8D,MAApBC,QAAAC,MAAAF,GAAoBA","file":"static/js/manifest.2ae2e69a05c33dfc65f8.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t2: 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"/\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap d1997dcbdac0e8e1cecf"],"sourceRoot":""}
\ No newline at end of file
+{
+  "version": 3,
+  "sources": [
+    "webpack:///webpack/bootstrap 9a1e0d9f46f089fcbcf1"
+  ],
+  "names": [
+    "parentJsonpFunction",
+    "window",
+    "chunkIds",
+    "moreModules",
+    "executeModules",
+    "moduleId",
+    "chunkId",
+    "result",
+    "i",
+    "resolves",
+    "length",
+    "installedChunks",
+    "push",
+    "Object",
+    "prototype",
+    "hasOwnProperty",
+    "call",
+    "modules",
+    "shift",
+    "__webpack_require__",
+    "s",
+    "installedModules",
+    "2",
+    "exports",
+    "module",
+    "l",
+    "m",
+    "c",
+    "d",
+    "name",
+    "getter",
+    "o",
+    "defineProperty",
+    "configurable",
+    "enumerable",
+    "get",
+    "n",
+    "__esModule",
+    "object",
+    "property",
+    "p",
+    "oe",
+    "err",
+    "console",
+    "error"
+  ],
+  "mappings": "aACA,IAAAA,EAAAC,OAAA,aACAA,OAAA,sBAAAC,EAAAC,EAAAC,GAIA,IADA,IAAAC,EAAAC,EAAAC,EAAAC,EAAA,EAAAC,KACQD,EAAAN,EAAAQ,OAAoBF,IAC5BF,EAAAJ,EAAAM,GACAG,EAAAL,IACAG,EAAAG,KAAAD,EAAAL,GAAA,IAEAK,EAAAL,GAAA,EAEA,IAAAD,KAAAF,EACAU,OAAAC,UAAAC,eAAAC,KAAAb,EAAAE,KACAY,EAAAZ,GAAAF,EAAAE,IAIA,IADAL,KAAAE,EAAAC,EAAAC,GACAK,EAAAC,QACAD,EAAAS,OAAAT,GAEA,GAAAL,EACA,IAAAI,EAAA,EAAYA,EAAAJ,EAAAM,OAA2BF,IACvCD,EAAAY,IAAAC,EAAAhB,EAAAI,IAGA,OAAAD,GAIA,IAAAc,KAGAV,GACAW,EAAA,GAIA,SAAAH,EAAAd,GAGA,GAAAgB,EAAAhB,GACA,OAAAgB,EAAAhB,GAAAkB,QAGA,IAAAC,EAAAH,EAAAhB,IACAG,EAAAH,EACAoB,GAAA,EACAF,YAUA,OANAN,EAAAZ,GAAAW,KAAAQ,EAAAD,QAAAC,IAAAD,QAAAJ,GAGAK,EAAAC,GAAA,EAGAD,EAAAD,QAKAJ,EAAAO,EAAAT,EAGAE,EAAAQ,EAAAN,EAGAF,EAAAS,EAAA,SAAAL,EAAAM,EAAAC,GACAX,EAAAY,EAAAR,EAAAM,IACAhB,OAAAmB,eAAAT,EAAAM,GACAI,cAAA,EACAC,YAAA,EACAC,IAAAL,KAMAX,EAAAiB,EAAA,SAAAZ,GACA,IAAAM,EAAAN,KAAAa,WACA,WAA2B,OAAAb,EAAA,SAC3B,WAAiC,OAAAA,GAEjC,OADAL,EAAAS,EAAAE,EAAA,IAAAA,GACAA,GAIAX,EAAAY,EAAA,SAAAO,EAAAC,GAAsD,OAAA1B,OAAAC,UAAAC,eAAAC,KAAAsB,EAAAC,IAGtDpB,EAAAqB,EAAA,IAGArB,EAAAsB,GAAA,SAAAC,GAA8D,MAApBC,QAAAC,MAAAF,GAAoBA",
+  "file": "static/js/manifest.2ae2e69a05c33dfc65f8.js",
+  "sourcesContent": [
+    " \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t2: 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"/\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 9a1e0d9f46f089fcbcf1"
+  ],
+  "sourceRoot": ""
+}

backend/routes/books.js

@@ -3,6 +3,7 @@ var router = express.Router();
 var books = require('../data/books.json');
 var fs = require('fs');
 var path = require('path');
+var User = require('../models/user');
 
 router.get('/', function(req, res) {
     console.log("=======Book Index=======");

backend/routes/login.js

+const express = require("express");
+const router = express.Router();
+const User = require("../models/user");
+
+router.post("/signUp", function(req, res, next) {
+  var user = new User();
+  user.id = req.body.user.id;
+  user.password = req.body.user.password;
+  user.name = req.body.user.name;
+  user.email = req.body.user.email;
+  user.isLoggedIn = req.body.user.isLoggedIn;
+
+  user.save(function(err) {
+    if (err) {
+      console.error(err);
+      res.json({ result: 0 });
+      return;
+    }
+    res.json({ result: 1 });
+  });
+});
+
+router.post("/checkLogin", function(req, res, next) {
+  User.findOne(
+    { id: req.body.user.id, password: req.body.user.password },
+    function(err, user) {
+      if (err) return res.status(500).json({ error: err });
+      // User가 없으면 error
+      if (!user) return res.status(404).json({ error: "user not found" });
+      res.json(user);
+    }
+  );
+});
+
+module.exports = router;

frontend/config/index.js

@@ -10,15 +10,7 @@ module.exports = {
     // Paths
     assetsSubDirectory: 'static',
     assetsPublicPath: '/',
-    proxyTable: {
-      '/api': {
-          target: 'http://localhost:3000/api',
-          changeOrigin: true,
-          pathRewrite: {
-            '^/api': ''
-          }
-      }
-    },
+    proxyTable: {},
 
     // Various Dev Server settings
     host: 'localhost', // can be overwritten by process.env.HOST
@@ -46,12 +38,10 @@ module.exports = {
 
   build: {
     // Template for index.html
-    //index: path.resolve(__dirname, '../dist/index.html'),
-    index: path.resolve(__dirname, '../../backend/public/index.html'),
+    index: path.resolve(__dirname, '../dist/index.html'),
 
     // Paths
-    //assetsRoot: path.resolve(__dirname, '../dist'),
-    assetsRoot: path.resolve(__dirname, '../../backend/public'),
+    assetsRoot: path.resolve(__dirname, '../dist'),
     assetsSubDirectory: 'static',
     assetsPublicPath: '/',
 

frontend/index.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <title>majorbook</title>
+    <title>frontend</title>
   </head>
   <body>
     <div id="app"></div>

frontend/package.json

@@ -2,7 +2,7 @@
   "name": "frontend",
   "version": "1.0.0",
   "description": "A Vue.js project",
-  "author": "YongJae <sdc689@gmail.com>",
+  "author": "HyeonJu <hj950000@ajou.ac.kr>",
   "private": true,
   "scripts": {
     "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
@@ -11,7 +11,11 @@
   },
   "dependencies": {
     "axios": "^0.19.0",
+    "node-sass": "^4.13.0",
+    "eslint": "^6.7.0",
     "vue": "^2.5.2",
+    "vue-material": "^1.0.0-beta-11",
+    "vue-multiselect": "^2.1.6",
     "vue-router": "^3.0.1"
   },
   "devDependencies": {
@@ -26,7 +30,7 @@
     "babel-preset-stage-2": "^6.22.0",
     "chalk": "^2.0.1",
     "copy-webpack-plugin": "^4.0.1",
-    "css-loader": "^0.28.0",
+    "css-loader": "^0.28.11",
     "extract-text-webpack-plugin": "^3.0.0",
     "file-loader": "^1.1.4",
     "friendly-errors-webpack-plugin": "^1.6.1",
@@ -38,14 +42,17 @@
     "postcss-import": "^11.0.0",
     "postcss-loader": "^2.0.8",
     "postcss-url": "^7.2.1",
+    "prettier": "^1.19.1",
     "rimraf": "^2.6.0",
+    "sass-loader": "^7.3.1",
     "semver": "^5.3.0",
     "shelljs": "^0.7.6",
     "uglifyjs-webpack-plugin": "^1.1.1",
     "url-loader": "^0.5.8",
     "vue-loader": "^13.3.0",
-    "vue-style-loader": "^3.0.1",
+    "vue-style-loader": "^3.1.2",
     "vue-template-compiler": "^2.5.2",
+    "vuetify": "^2.1.11",
     "webpack": "^3.6.0",
     "webpack-bundle-analyzer": "^2.9.0",
     "webpack-dev-server": "^2.9.1",

frontend/src/App.vue

 <template>
-  <div id="app">
-    <img src="./assets/book-open-flat.png">
-    <router-view/>
+  <div id="app" class="page-container">
+    <md-app md-mode="fixed-last">
+      <md-app-toolbar class="md-large md-dense md-primary">
+        <div class="md-toolbar-row">
+          <span class="md-title">MajorBook </span>
+        </div>
+
+        <div style="flex:1">
+          <template v-if="logged_io">
+            ID :
+            <input v-model="id" placeholder="ID" type="text" required />
+            PASSWORD :
+            <input
+              v-model="pwd"
+              placeholder="password"
+              type="password"
+              required
+            />
+            <button v-on:click="login" class="btn">Login</button>
+            <md-button :href="signup" class="btn">Sign up</md-button>
+          </template>
+          <template v-else>
+            <button class="btn">거래현황</button>
+            <button v-on:click="logout" class="btn">Logout</button>
+          </template>
+        </div>
+
+        <div class="md-toolbar-row">
+          <md-tabs class="md-primary" style="margin: auto; height: 30px">
+            <md-tab id="tab-home" md-label="Home" to="/"> </md-tab>
+            <md-tab
+              id="tab-dashBoard"
+              md-label="Dashboard"
+              to="/dashBoard"
+            ></md-tab>
+            <md-tab id="tab-profile" md-label="Profile" to="/profile"></md-tab>
+            <md-tab
+              id="tab-list"
+              md-label="전공서적보기"
+              to="/BookSearchPage"
+            ></md-tab>
+          </md-tabs>
+        </div>
+      </md-app-toolbar>
+    </md-app>
+    <router-view />
   </div>
 </template>
 
 <script>
+import Vue from "vue";
+import VueMaterial from "vue-material";
+import "vue-material/dist/vue-material.min.css";
+
+Vue.use(VueMaterial);
+
 export default {
-  name: 'App'
-}
+  name: "App",
+  data() {
+    return {
+      id: "",
+      pwd: "",
+      flag: false,
+      url: {
+        bookIndex: "/api/books"
+      }
+    };
+  },
+  computed: {
+    changeID() {
+      this.id = `${this.id}`;
+    },
+    changePWD() {
+      this.pwd = `${this.pwd}`;
+    },
+    logged_io() {
+      if (!this.flag) return true;
+      else return false;
+    }
+  },
+  methods: {
+    login: function() {
+      if (this.id != "" && this.pwd != "") {
+        alert(this.id + "  login!!");
+        this.flag = !this.flag;
+        this.id = "";
+        this.pwd = "";
+      } else alert("ID/PASSWORD를 입력하세요");
+    },
+    logout: function() {
+      this.flag = !this.flag;
+    }
+  }
+};
 </script>
 
 <style>
 #app {
-  font-family: 'Avenir', Helvetica, Arial, sans-serif;
+  font-family: "Avenir", Helvetica, Arial, sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   text-align: center;
   color: #2c3e50;
-  margin-top: 60px;
+  height: 100%;
+}
+
+.btn {
+  color: #00b7ff;
+  background-color: #a6a6a6;
+  border-radius: 15%;
+}
+
+h1 {
+  text-align: left;
+  font-size: 35px;
+  color: #00b7ff;
+  text-decoration: none;
+}
+
+img {
+  height: 100%;
+  width: 100%;
 }
 </style>

frontend/src/components/BookSearchPage.vue

+<template>
+    <div>
+        <div class = 'select'>
+            <multiselect style="float: left; marginLeft: 20%; width: 20%;"
+                v-model="grade"
+                :options="option1">
+            </multiselect>
+            <multiselect style="float: left; marginLeft: 0.5%; width: 20%;"
+                v-model="major"
+                :options="option2">
+            </multiselect>
+            <multiselect style="float: left; marginLeft: 0.5%; width: 20%;"
+                v-model="type" 
+                :options="option3">
+            </multiselect>
+            <v-btn color = "#999" style="float: left; marginLeft: 1%; " v-on:click='Search'>검색</v-btn>
+        </div>
+        <div v-if = "SearchResult === true">
+            <div v-for="Book in Books" :key="Book.id">
+                <md-card style = "width: 50%; margin: 4px;marginTop:100px; display: inline-block; vertical-align: top;">
+                    <md-card-header>
+                        <md-card-header-text>
+                        <div class="md-title">{{Book.title}}<br><br></div>
+                        <div class="md-subhead" style = "text-align:left;font-weight: bold;"># 학년: {{Book.grade}}<br># 전공: {{Book.major}}<br>#  세부사항: {{Book.type}}
+                        <br># 매물: {{Book.stock}}
+                        </div>
+                        </md-card-header-text>
+                        <md-card-media md-medium>
+                        <img v-bind:src="Book.src">
+                        </md-card-media>
+                    </md-card-header>
+                    <md-card-actions>
+                        <md-button class="md-raised md-accent">Sell</md-button>
+                        <md-button class="md-raised md-primary">Buy Now</md-button>
+                    </md-card-actions>
+                </md-card>
+            </div>
+        </div>
+    </div>    
+</template>
+
+
+<script>
+import Vue from 'vue'
+import VueMaterial from 'vue-material'
+import Multiselect from 'vue-multiselect'
+import 'vue-material/dist/vue-material.min.css'
+import 'vue-material/dist/theme/default.css'
+Vue.use(VueMaterial)
+export default {
+    components: { Multiselect },
+    name: 'MaterialIcons',
+    data() {
+        return {
+            SearchResult : false,
+            grade: null,
+            major: null,
+            type: null,
+            option1: ['1학년','2학년','3학년','4학년'],
+            option2: ['소프트웨어학과','미디어학과','경제학과'],
+            option3: ['전공 필수', '전공 선택', '교양선택','기초과목'],
+
+            Books : [
+                {
+                    id : "1",
+                    title: 'C programming',
+                    grade : '1학년',
+                    major : '소프트웨어학과',
+                    type : '전공필수',
+                    stock : '4개',
+                    src : 'http://image.yes24.com/momo/TopCate1057/MidCate003/105623688.jpg',
+                },
+                {
+                    id : "2",
+                    title : '미시경제학 원론',
+                    grade : '2학년',
+                    major : '경제학과',
+                    type : '전공필수',
+                    stock : '3개',
+                    src : 'http://image.yes24.com/momo/TopCate1278/MidCate006/127759061.jpg'
+                },
+                {
+                    id : "3",
+                    title : '방송 시스템과 영상 제작',
+                    grade : '3학년',
+                    major : '미디어',
+                    type : '전공선택',
+                    stock : '10개',
+                    src : 'http://bimage.interpark.com/goods_image/9/1/3/0/211969130g.jpg'
+                },
+            ]
+            
+        };
+    },
+    methods:{
+        Search: function(){
+            if(this.grade !== null && this.major !== null && this.type !== null)
+            {   
+                this.SearchResult = true;
+                console.log(this.SearchResult);
+            }
+            else
+            {
+                alert("검색할 카테고리를 전부 입력해주세요")
+            }
+
+        }
+    }
+};
+</script>
+
+
+<style lang='css'>
+html,body {
+    text-align: center;
+    margin:0;
+    width:100%;
+    font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
+    justify-content: center;
+    
+}
+.select {
+
+    text-align: center;    
+}
+.button{
+    margin-top: 70px;
+}
+</style>
+<style src="vue-multiselect/dist/vue-multiselect.min.css">
+</style>
\ No newline at end of file

frontend/src/components/BookShowPage.vue

@@ -18,6 +18,7 @@ export default {
         var id = this.$route.params.id;
         this.$http.get(`/api/books/${id}`).then((response) => {
             this.book = response.data[0];
+            console.log(response)
         });
     },
     data: function() {

frontend/src/components/dashBoard.vue

+<template>
+  <!DOCTYPE html>
+  <html lang="en">
+    <head>
+      <meta charset="UTF-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+      <title>Majorbook</title>
+    </head>
+    <body>
+      <h1>my page 1</h1>
+      <button>수정하기</button>
+    </body>
+  </html>
+</template>

frontend/src/components/home.vue

+<template>
+  <div>
+    <div class="md-layout" style="display: block; color:#F6F6F6">
+      <div class="md-layout-item"><img src="../../static/img/img2.jpg" /></div>
+      <div class="md-layout-item" style="backgroundColor:#F2CB61; height:30px;">
+        이용방법
+      </div>
+      <div class="md-layout-item" style="backgroundColor:#353535;">
+        Implemented by 202-WebSysDesign
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Login from "./login/Login";
+
+export default {
+  data() {
+    return {};
+  },
+
+  components: {
+    Login
+  },
+
+  methods: {
+    checkisLoggedIn() {
+      // this.$http.get('/api/login/checkLogin', {
+      //   user: this.user
+      // })
+      //console.log(user.isLoggedIn);
+    },
+
+    gotoMyPage() {
+      if (this.checkisLoggedIn()) {
+        this.$router.push("/myPage");
+      }
+    },
+    gotoBuyPage() {
+      if (this.checkisLoggedIn()) {
+        this.$router.push("/buy");
+      }
+    },
+    gotoSellPage() {
+      if (this.checkisLoggedIn()) {
+        this.$router.push("/sell");
+      }
+    },
+    gotoBookIndexPage() {
+      if (this.checkisLoggedIn()) {
+        this.$router.push("/BookIndexPage");
+      }
+    }
+  }
+};
+</script>
+
+<style lang="css">
+html,
+body {
+  text-align: center;
+  /* margin:0; */
+  /* width:100%; */
+  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
+}
+
+.nav button {
+  color: #00b7ff;
+  text-align: center;
+  padding-right: 8%;
+  padding-left: 8%;
+  font-size: 18px;
+  text-decoration: none;
+}
+
+.nav {
+  background-color: #333;
+  overflow: hidden;
+}
+
+.header {
+  margin: 15px;
+  height: 12%;
+  font-size: 10px;
+}
+
+.btn {
+  color: #00b7ff;
+  background-color: #333;
+  border-radius: 15%;
+}
+
+h1 {
+  text-align: left;
+  font-size: 35px;
+}
+
+.section {
+  height: 500px;
+}
+
+img {
+  height: 100%;
+  width: 100%;
+}
+
+.aside {
+  height: 40px;
+  background-color: rgb(255, 220, 123);
+}
+
+.footer {
+  height: 20px;
+  color: white;
+  background-color: #333;
+}
+
+.myPage {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  height: 400px;
+}
+</style>

frontend/src/components/login/Login.vue

+<template>
+  <div id="login">
+    <div>Login</div>
+    <input v-model="user.id" placeholder="ID" /> <br />
+    <input v-model="user.password" type="password" placeholder="password" />
+    <button v-on:click="login">login</button>
+    <a v-bind:href="url.signUpUrl"> Sign up </a>
+  </div>
+</template>
+
+<script>
+export default {
+  data: function() {
+    return {
+      user: {
+        id: "",
+        password: ""
+      },
+      url: {
+        signUpUrl: "/login/signUp"
+      }
+    };
+  },
+  methods: {
+    login: function(event) {
+      console.log("login start");
+      this.$http
+        .post("/api/login/checkLogin", {
+          user: this.user
+        })
+
+        .then(
+          response => {
+            //로그인 성공
+            alert("success login");
+          },
+          error => {
+            // error 를 보여줌
+            alert(error.response.data.error);
+          }
+        )
+        .catch(error => {
+          alert(error);
+        });
+    }
+  }
+};
+</script>