윤희찬
1 +{
2 + // IntelliSense를 사용하여 가능한 특성에 대해 알아보세요.
3 + // 기존 특성에 대한 설명을 보려면 가리킵니다.
4 + // 자세한 내용을 보려면 https://go.microsoft.com/fwlink/?linkid=830387을(를) 방문하세요.
5 + "version": "0.2.0",
6 + "configurations": [
7 + {
8 + "type": "pwa-chrome",
9 + "request": "launch",
10 + "name": "Launch Chrome against localhost",
11 + "url": "http://localhost:8080",
12 + "webRoot": "${workspaceFolder}"
13 + }
14 + ]
15 +}
...\ No newline at end of file ...\ No newline at end of file
...@@ -11,6 +11,7 @@ const path=require('path') ...@@ -11,6 +11,7 @@ const path=require('path')
11 11
12 app.set('views', __dirname + '/public') 12 app.set('views', __dirname + '/public')
13 app.set('view engine', 'ejs') 13 app.set('view engine', 'ejs')
14 +app.use(express.static(__dirname+'/public'))
14 15
15 app.use(bodyParser.urlencoded({extended:false})) 16 app.use(bodyParser.urlencoded({extended:false}))
16 app.use(bodyParser.json()) 17 app.use(bodyParser.json())
......
1 +body {
2 + padding-top: 15px;
3 + font-size: 12px
4 +}
5 +.main {
6 + max-width: 320px;
7 + margin: 0 auto;
8 +}
9 +.login-or {
10 + position: relative;
11 + font-size: 18px;
12 + color: #aaa;
13 + margin-top: 10px;
14 + margin-bottom: 10px;
15 + padding-top: 10px;
16 + padding-bottom: 10px;
17 +}
18 +.span-or {
19 + display: block;
20 + position: absolute;
21 + left: 50%;
22 + top: -2px;
23 + margin-left: -25px;
24 + background-color: #fff;
25 + width: 50px;
26 + text-align: center;
27 +}
28 +.hr-or {
29 + background-color: #cdcdcd;
30 + height: 1px;
31 + margin-top: 0px !important;
32 + margin-bottom: 0px !important;
33 +}
34 +h3 {
35 + text-align: center;
36 + line-height: 300%;
37 +}
...\ No newline at end of file ...\ No newline at end of file
...@@ -3,16 +3,36 @@ ...@@ -3,16 +3,36 @@
3 <head> 3 <head>
4 <meta charset="utf-8"> 4 <meta charset="utf-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 + <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
7 + <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
8 + <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
6 <title><%= title %></title> 9 <title><%= title %></title>
7 </head> 10 </head>
8 <body> 11 <body>
9 - <h1>로그인하기</h1> 12 + <div class="container">
10 - <form method="POST" action="/"> 13 + <div class="row">
11 - <label for="userId">아이디</label> 14 +
12 - <input type="text" id="userId" name="userId"><br> 15 + <div class="main">
16 +
17 + <h3>Login</h3>
18 +
19 + <form role="form" method="POST" action="/">
20 + <div class="form-group">
21 + <label for="userId">ID</label>
22 + <input type="text" class="form-control" id="userId" name="userId">
23 + </div>
24 + <div class="form-group">
13 <label for="password">비밀번호</label> 25 <label for="password">비밀번호</label>
14 - <input type="password" id="password" name="password"><br> 26 + <input type="password" class="form-control" id="password" name="password">
15 - <button>로그인</button> 27 + </div>
28 + <button type="submit" class="btn btn btn-primary">
29 + Enter
30 + </button>
16 </form> 31 </form>
32 +
33 + </div>
34 +
35 + </div>
36 + </div>
17 </body> 37 </body>
18 </html> 38 </html>
...\ No newline at end of file ...\ No newline at end of file
......