지도 띄우기 구현

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "private": true,
   "scripts": {
-    "start": "node ./bin/www"
+    "start": "nodemon ./bin/www"
   },
   "dependencies": {
     "cookie-parser": "~1.4.4",
@@ -14,6 +14,7 @@
     "google-auth-library": "^7.0.4",
     "http-errors": "~1.6.3",
     "morgan": "~1.9.1",
+    "nodemon": "^2.0.7",
     "session-file-store": "^1.5.0"
   }
 }

-var express = require('express');
+var express = require("express");
 var router = express.Router();
-var {OAuth2Client} = require('google-auth-library');
-var CLIENT_ID = "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com"
-var client= new OAuth2Client(CLIENT_ID);
-var session =require('express-session');
-var FileStore=require('session-file-store')(session);
-router.use(session({
-    secret: '209',  // 암호화
+var { OAuth2Client } = require("google-auth-library");
+var CLIENT_ID =
+  "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com";
+var client = new OAuth2Client(CLIENT_ID);
+var session = require("express-session");
+var FileStore = require("session-file-store")(session);
+router.use(
+  session({
+    secret: "209", // 암호화
     resave: false,
     saveUninitialized: true,
-    store: new FileStore()
-}))
+    store: new FileStore(),
+  })
+);
 
 /* GET home page. */
-router.get('/', function(req, res, next) {
-  res.render('index', { d: "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com" });
+router.get("/", function (req, res, next) {
+  res.render("index", {
+    d: "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com",
+  });
 });
-router.get('/index', function(req, res, next) {
-  res.render('index', { d: "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com" });
+router.get("/index", function (req, res, next) {
+  res.render("index", {
+    d: "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com",
+  });
 });
 
-router.post('/index', (req, res) => {
-  let token=req.body.token;
+router.post("/index", (req, res) => {
+  let token = req.body.token;
   async function verify() {
     const ticket = await client.verifyIdToken({
       idToken: token,
-      audience: CLIENT_ID,  // Specify the CLIENT_ID of the app that accesses the backend
+      audience: CLIENT_ID, // Specify the CLIENT_ID of the app that accesses the backend
     });
   }
   verify()
-      .then(()=>{
-        res.cookie('session-token', token);
-        res.send('success')
-      })
-      .catch(console.error);
+    .then(() => {
+      res.cookie("session-token", token);
+      res.send("success");
+    })
+    .catch(console.error);
 });
 
-router.get('/login', checkAuthenticated, (req,res )=>{
-  let user=req.user;
-  req.session.user=user;
-  res.render('login', {user:req.session.user})
+router.get("/login", checkAuthenticated, (req, res) => {
+  let user = req.user;
+  req.session.user = user;
+  res.render("login", { user: req.session.user });
 });
 
-router.post('/login' ,(req, res)=>{
-
-    console.log(req.body.nickname);
-    console.log(req.body.age);
-    console.log(req.body.gender);
-    return res.render('login', {user:req.session.user})
+router.post("/login", (req, res) => {
+  console.log(req.body.nickname);
+  console.log(req.body.age);
+  console.log(req.body.gender);
+  return res.render("login", { user: req.session.user });
 });
 module.exports = router;
 
-
-
-function checkAuthenticated(req, res, next){
-
-  let token = req.cookies['session-token'];
+function checkAuthenticated(req, res, next) {
+  let token = req.cookies["session-token"];
 
   let user = {};
   async function verify() {
     const ticket = await client.verifyIdToken({
       idToken: token,
-      audience: CLIENT_ID,  // Specify the CLIENT_ID of the app that accesses the backend
+      audience: CLIENT_ID, // Specify the CLIENT_ID of the app that accesses the backend
     });
     const payload = ticket.getPayload();
     user.name = payload.name;
@@ -70,12 +73,15 @@ function checkAuthenticated(req, res, next){
     console.log(user.name);
   }
   verify()
-      .then(()=>{
-        req.user = user;
-        next();
-      })
-      .catch(err=>{
-        res.redirect('/index')
-      })
+    .then(() => {
+      req.user = user;
+      next();
+    })
+    .catch((err) => {
+      res.redirect("/index");
+    });
+}
 
-}
\ No newline at end of file
+router.get("/map", (req, res) => {
+  res.render("map");
+});

+{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"},"__lastAccess":1620820123092,"user":{"name":"‍김대철[학생](소프트웨어융합대학 컴퓨터공학과)","email":"kdc9619@khu.ac.kr","picture":"https://lh3.googleusercontent.com/a/AATXAJyP14ipRboJZ8T5-oNS3sRp4CG8wKCEwVABQ5G_=s96-c"}}
\ No newline at end of file

+<!DOCTYPE html>
+<html>
+  <head>
+    <title>KaKao Map</title>
+    <link rel="stylesheet" href="/stylesheets/style.css" />
+  </head>
+  <body>
+    <div id="map" style="width: 100%; height: 575px"></div>
+
+    <script
+      type="text/javascript"
+      src="//dapi.kakao.com/v2/maps/sdk.js?appkey=68cbccbcd6f0fef0a213e62ad37393ee"
+    ></script>
+    <script>
+      const mapContainer = document.getElementById("map"),
+        mapOption = {
+          center: new kakao.maps.LatLng(37.2477502, 127.078164),
+          level: 3,
+        };
+
+      const map = new kakao.maps.Map(mapContainer, mapOption);
+    </script>
+  </body>
+</html>