김민규 / rest_stop_list

Go to a project
Toggle navigation Toggle navigation pinning
Mingyu
ec58223c 1 parent 09e0ba5b

Login/signup page

Inline Side-by-side
Showing 14 changed files with 255 additions and 356 deletions
...@@ -12,6 +12,8 @@ var lpgRouter = require('./routes/lpg') ...@@ -12,6 +12,8 @@ var lpgRouter = require('./routes/lpg')
12 var weatherRouter = require('./routes/weather') 12 var weatherRouter = require('./routes/weather')
13 var menuRouter = require('./routes/menu') 13 var menuRouter = require('./routes/menu')
14 var app = express(); 14 var app = express();
15 +var router = express.Router();
16 +
15 17
16 // get port 18 // get port
17 var port = process.env.PORT || 3000; 19 var port = process.env.PORT || 3000;
...@@ -41,6 +43,8 @@ app.use('/lpg',lpgRouter) ...@@ -41,6 +43,8 @@ app.use('/lpg',lpgRouter)
41 app.use('/signup',sign_upRouter); // sign up page route 43 app.use('/signup',sign_upRouter); // sign up page route
42 app.use('/', indexRouter); // main page route 44 app.use('/', indexRouter); // main page route
43 45
46 +
47 +
44 //모든 router 처리가 끝난 후 404 오류 페이지 처리 48 //모든 router 처리가 끝난 후 404 오류 페이지 처리
45 var errorHandler = expressErrorHandler({ 49 var errorHandler = expressErrorHandler({
46 static: { 50 static: {
......
1 -<!DOCTYPE html>
2 -<html lang="en">
3 - <head>
4 - <meta charset="utf-8" />
5 - <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
6 - <meta name="description" content="" />
7 - <meta name="author" content="" />
8 - <title>Modern Business - Start Bootstrap Template</title>
9 - <!-- Favicon-->
10 - <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
11 - <!-- Bootstrap icons-->
12 - <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" />
13 - <!-- Core theme CSS (includes Bootstrap)-->
14 - <link href="css/styles.css" rel="stylesheet" />
15 - </head>
16 - <body class="d-flex flex-column h-100">
17 - <main class="flex-shrink-0">
18 - <!-- Navigation-->
19 - <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
20 - <div class="container px-5">
21 - <a class="navbar-brand" href="/">휴게소 정보</a>
22 - <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
23 - <div class="collapse navbar-collapse" id="navbarSupportedContent">
24 - <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
25 - <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
26 - <li class="nav-item"><a class="nav-link" href="/menu">휴게소 메뉴</a></li>
27 - <li class="nav-item"><a class="nav-link" href="/weather">날씨</a></li>
28 - <li class="nav-item"><a class="nav-link" href="/lpg">LPG</a></li>
29 - <li class="nav-item"><a class="nav-link" href="faq.html">FAQ</a></li>
30 - <li class="nav-item dropdown">
31 - <a class="nav-link dropdown-toggle" id="navbarDropdownBlog" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Blog</a>
32 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownBlog">
33 - <li><a class="dropdown-item" href="blog-home.html">Blog Home</a></li>
34 - <li><a class="dropdown-item" href="blog-post.html">Blog Post</a></li>
35 - </ul>
36 - </li>
37 - <li class="nav-item dropdown">
38 - <a class="nav-link dropdown-toggle" id="navbarDropdownPortfolio" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Portfolio</a>
39 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownPortfolio">
40 - <li><a class="dropdown-item" href="portfolio-overview.html">Portfolio Overview</a></li>
41 - <li><a class="dropdown-item" href="portfolio-item.html">Portfolio Item</a></li>
42 - </ul>
43 - </li>
44 - </ul>
45 - </div>
46 - </div>
47 - </nav>
48 - <!-- Page Content-->
49 - <section class="py-5">
50 - <div class="container px-5 my-5">
51 - <div class="text-center mb-5">
52 - <h1 class="fw-bolder">Frequently Asked Questions</h1>
53 - <p class="lead fw-normal text-muted mb-0">How can we help you?</p>
54 - </div>
55 - <div class="row gx-5">
56 - <div class="col-xl-8">
57 - <!-- FAQ Accordion 1-->
58 - <h2 class="fw-bolder mb-3">Account &amp; Billing</h2>
59 - <div class="accordion mb-5" id="accordionExample">
60 - <div class="accordion-item">
61 - <h3 class="accordion-header" id="headingOne"><button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">Accordion Item #1</button></h3>
62 - <div class="accordion-collapse collapse show" id="collapseOne" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
63 - <div class="accordion-body">
64 - <strong>This is the first item's accordion body.</strong>
65 - It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
66 - <code>.accordion-body</code>
67 - , though the transition does limit overflow.
68 - </div>
69 - </div>
70 - </div>
71 - <div class="accordion-item">
72 - <h3 class="accordion-header" id="headingTwo"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">Accordion Item #2</button></h3>
73 - <div class="accordion-collapse collapse" id="collapseTwo" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
74 - <div class="accordion-body">
75 - <strong>This is the second item's accordion body.</strong>
76 - It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
77 - <code>.accordion-body</code>
78 - , though the transition does limit overflow.
79 - </div>
80 - </div>
81 - </div>
82 - <div class="accordion-item">
83 - <h3 class="accordion-header" id="headingThree"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">Accordion Item #3</button></h3>
84 - <div class="accordion-collapse collapse" id="collapseThree" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
85 - <div class="accordion-body">
86 - <strong>This is the third item's accordion body.</strong>
87 - It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
88 - <code>.accordion-body</code>
89 - , though the transition does limit overflow.
90 - </div>
91 - </div>
92 - </div>
93 - </div>
94 - <!-- FAQ Accordion 2-->
95 - <h2 class="fw-bolder mb-3">Website Issues</h2>
96 - <div class="accordion mb-5 mb-xl-0" id="accordionExample2">
97 - <div class="accordion-item">
98 - <h3 class="accordion-header" id="headingOne"><button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">Accordion Item #1</button></h3>
99 - <div class="accordion-collapse collapse show" id="collapseOne" aria-labelledby="headingOne" data-bs-parent="#accordionExample2">
100 - <div class="accordion-body">
101 - <strong>This is the first item's accordion body.</strong>
102 - It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
103 - <code>.accordion-body</code>
104 - , though the transition does limit overflow.
105 - </div>
106 - </div>
107 - </div>
108 - <div class="accordion-item">
109 - <h3 class="accordion-header" id="headingTwo"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">Accordion Item #2</button></h3>
110 - <div class="accordion-collapse collapse" id="collapseTwo" aria-labelledby="headingTwo" data-bs-parent="#accordionExample2">
111 - <div class="accordion-body">
112 - <strong>This is the second item's accordion body.</strong>
113 - It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
114 - <code>.accordion-body</code>
115 - , though the transition does limit overflow.
116 - </div>
117 - </div>
118 - </div>
119 - <div class="accordion-item">
120 - <h3 class="accordion-header" id="headingThree"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">Accordion Item #3</button></h3>
121 - <div class="accordion-collapse collapse" id="collapseThree" aria-labelledby="headingThree" data-bs-parent="#accordionExample2">
122 - <div class="accordion-body">
123 - <strong>This is the third item's accordion body.</strong>
124 - It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the
125 - <code>.accordion-body</code>
126 - , though the transition does limit overflow.
127 - </div>
128 - </div>
129 - </div>
130 - </div>
131 - </div>
132 - <div class="col-xl-4">
133 - <div class="card border-0 bg-light mt-xl-5">
134 - <div class="card-body p-4 py-lg-5">
135 - <div class="d-flex align-items-center justify-content-center">
136 - <div class="text-center">
137 - <div class="h6 fw-bolder">Have more questions?</div>
138 - <p class="text-muted mb-4">
139 - Contact us at
140 - <br />
141 - <a href="#!">support@domain.com</a>
142 - </p>
143 - <div class="h6 fw-bolder">Follow us</div>
144 - <a class="fs-5 px-2 link-dark" href="#!"><i class="bi-twitter"></i></a>
145 - <a class="fs-5 px-2 link-dark" href="#!"><i class="bi-facebook"></i></a>
146 - <a class="fs-5 px-2 link-dark" href="#!"><i class="bi-linkedin"></i></a>
147 - <a class="fs-5 px-2 link-dark" href="#!"><i class="bi-youtube"></i></a>
148 - </div>
149 - </div>
150 - </div>
151 - </div>
152 - </div>
153 - </div>
154 - </div>
155 - </section>
156 - </main>
157 - <!-- Footer-->
158 - <footer class="bg-dark py-4 mt-auto">
159 - <div class="container px-5">
160 - <div class="row align-items-center justify-content-between flex-column flex-sm-row">
161 - <div class="col-auto"><div class="small m-0 text-white">Copyright &copy; Your Website 2022</div></div>
162 - <div class="col-auto">
163 - <a class="link-light small" href="#!">Privacy</a>
164 - <span class="text-white mx-1">&middot;</span>
165 - <a class="link-light small" href="#!">Terms</a>
166 - <span class="text-white mx-1">&middot;</span>
167 - <a class="link-light small" href="#!">Contact</a>
168 - </div>
169 - </div>
170 - </div>
171 - </footer>
172 - <!-- Bootstrap core JS-->
173 - <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
174 - <!-- Core theme JS-->
175 - <script src="js/scripts.js"></script>
176 - </body>
177 -</html>
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 -<html> 2 +<html lang="en">
3 - <head> 3 +
4 - <meta charset="UTF-8"> 4 +<head>
5 - <tilte>로그인 테스트</tilte> 5 + <meta charset="utf-8" />
6 - </head> 6 + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7 - <body> 7 + <meta name="description" content="" />
8 + <meta name="author" content="" />
9 + <title>Modern Business - Start Bootstrap Template</title>
10 + <!-- Favicon-->
11 + <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
12 + <!-- Bootstrap icons-->
13 + <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" />
14 + <!-- Core theme CSS (includes Bootstrap)-->
15 + <link href="css/styles.css" rel="stylesheet" />
16 +</head>
17 +
18 +<body class="d-flex flex-column">
19 + <main class="flex-shrink-0">
20 + <!-- Navigation-->
21 + <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
22 + <div class="container px-5">
23 + <a class="navbar-brand" href="/">휴게소 정보</a>
24 + <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
25 + data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
26 + aria-expanded="false" aria-label="Toggle navigation"><span
27 + class="navbar-toggler-icon"></span></button>
28 + <div class="collapse navbar-collapse" id="navbarSupportedContent">
29 + <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
30 + <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
31 + <li class="nav-item"><a class="nav-link" href="/menu">휴게소 메뉴</a></li>
32 + <li class="nav-item"><a class="nav-link" href="/weather">날씨</a></li>
33 + <li class="nav-item"><a class="nav-link" href="/lpg">LPG</a></li>
34 + <li class="nav-item"><a class="nav-link" href="faq.html">FAQ</a></li>
35 + <li class="nav-item dropdown">
36 + <a class="nav-link dropdown-toggle" id="navbarDropdownBlog" href="#" role="button"
37 + data-bs-toggle="dropdown" aria-expanded="false">Blog</a>
38 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownBlog">
39 + <li><a class="dropdown-item" href="blog-home.html">Blog Home</a></li>
40 + <li><a class="dropdown-item" href="blog-post.html">Blog Post</a></li>
41 + </ul>
42 + </li>
43 + <li class="nav-item dropdown">
44 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button"
45 + data-bs-toggle="dropdown" aria-expanded="false">Login</a>
46 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
47 + <li><a class="dropdown-item" href="login.html">Login</a></li>
48 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
49 + </ul>
50 + </li>
51 + </ul>
52 + </div>
53 + </div>
54 + </nav>
55 + <!-- Header-->
56 + <header class="py-5">
57 + <div class="container px-5">
58 + <div class="row justify-content-center">
59 + <div class="col-lg-8 col-xxl-6">
60 + <div class="text-center my-5">
8 <h1>로그인</h1> 61 <h1>로그인</h1>
9 <br> 62 <br>
10 - <form method="post" action="/process/login/rest_list"> 63 + <form method="post" action="/login/process">
11 <table> 64 <table>
12 <tr> 65 <tr>
13 <td><label>아이디</label></td> 66 <td><label>아이디</label></td>
...@@ -20,5 +73,34 @@ ...@@ -20,5 +73,34 @@
20 </table> 73 </table>
21 <input type="submit" value="전송" name=""> 74 <input type="submit" value="전송" name="">
22 </form> 75 </form>
23 - </body> 76 + </div>
77 + </div>
78 + </div>
79 + </div>
80 + </header>
81 + <!-- About section one-->
82 + </main>
83 + <!-- Footer-->
84 + <footer class="bg-dark py-4 mt-auto">
85 + <div class="container px-5">
86 + <div class="row align-items-center justify-content-between flex-column flex-sm-row">
87 + <div class="col-auto">
88 + <div class="small m-0 text-white">Copyright &copy; Your Website 2022</div>
89 + </div>
90 + <div class="col-auto">
91 + <a class="link-light small" href="#!">Privacy</a>
92 + <span class="text-white mx-1">&middot;</span>
93 + <a class="link-light small" href="#!">Terms</a>
94 + <span class="text-white mx-1">&middot;</span>
95 + <a class="link-light small" href="#!">Contact</a>
96 + </div>
97 + </div>
98 + </div>
99 + </footer>
100 + <!-- Bootstrap core JS-->
101 + <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
102 + <!-- Core theme JS-->
103 + <script src="js/scripts.js"></script>
104 +</body>
105 +
24 </html> 106 </html>
...\ No newline at end of file ...\ No newline at end of file
......
1 -<!DOCTYPE html>
2 -<html lang="ko">
3 - <head>
4 - <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@500&display=swap" rel="stylesheet">
5 - </head>
6 - <body>
7 -
8 - <style>
9 - *{
10 - font-family: 'Noto Sans KR', sans-serif;
11 - list-style: none;
12 - text-decoration: none;
13 - border-collapse: collapse;
14 - margin: 0px;
15 - padding: 0px;
16 - }
17 -
18 - .headbar{
19 - display:flex;
20 - width:1535px;
21 - height:50px;
22 - margin-top:20px;
23 - }
24 -
25 - .title{
26 - margin-left: 200px;
27 - }
28 -
29 - .title span{
30 - margin-left: 10px
31 - }
32 -
33 - .button {
34 - margin-top: 8px;
35 - margin-left: 600px;;
36 - }
37 - .button span{
38 - margin-left: 20px;
39 - }
40 -
41 - .intro{
42 - position:fixed;
43 - width: 1535px;
44 - height:290px;
45 - background-color: #40E0D0;
46 -
47 - }
48 -
49 - .des{
50 - margin-top:120px;
51 - margin-left: 230px;
52 - }
53 -
54 - .bar{
55 - margin-bottom:15px;
56 - }
57 -
58 - .icon{
59 - position:fixed;
60 - top: 270px;
61 - margin-left: 910px;
62 - }
63 - .icon span{
64 - border:4px solid white;
65 - border-radius:30%;
66 - padding-top: 20px;
67 - padding-bottom: 20px;
68 - padding-left: 20px;
69 - padding-right: 20px;
70 - margin-left:5px;
71 - }
72 - </style>
73 -
74 -
75 -
76 - <div class="wrap">
77 - <div class="headbar">
78 - <div class ="title">
79 - <span style="font-size: 22px;"><b>✧ 휴게소의 모든 것 ✧</b></span>
80 - <span style="color:#0A9696">Everything Of Rest Area</span>
81 - </div>
82 - <div class = "button">
83 - <span><a href="https://www.naver.com/" style = "color: #0A9696;">Log in</a></span>
84 - <span><a href="https://www.google.co.kr" style = "color: #0A9696;">Sign up</a></span>
85 - </div>
86 - </div>
87 -
88 -
89 - <div class="intro" style="background: #40E0D0">
90 - <div class="des">
91 - <div class="bar">
92 - <hr size="6" width= "200px" color="white">
93 - </div>
94 - <div style="color:white; font-size: 32px;"><b>당신이 방문할 휴게소의 모든 정보,</b></div>
95 - <div style="color: white; font-size:40px;"><b> 휴게소의 모든 것</b></div>
96 - </div>
97 -
98 - <div class="icon">
99 - <span style="color:white; font-size:20px;"><b>날씨</b></span>
100 - <span style="color:white; font-size:20px;"><b>메뉴</b></span>
101 - <span style="color:white; font-size:20px;"><b>LPG</b></span>
102 - </div>
103 - </div>
104 - </div>
105 -</body>
106 -</html>
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html lang="en">
3 +
4 +<head>
5 + <meta charset="utf-8" />
6 + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7 + <meta name="description" content="" />
8 + <meta name="author" content="" />
9 + <title>Modern Business - Start Bootstrap Template</title>
10 + <!-- Favicon-->
11 + <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
12 + <!-- Bootstrap icons-->
13 + <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" />
14 + <!-- Core theme CSS (includes Bootstrap)-->
15 + <link href="css/styles.css" rel="stylesheet" />
16 +</head>
17 +
18 +<body class="d-flex flex-column">
19 + <main class="flex-shrink-0">
20 + <!-- Navigation-->
21 + <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
22 + <div class="container px-5">
23 + <a class="navbar-brand" href="/">휴게소 정보</a>
24 + <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
25 + data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
26 + aria-expanded="false" aria-label="Toggle navigation"><span
27 + class="navbar-toggler-icon"></span></button>
28 + <div class="collapse navbar-collapse" id="navbarSupportedContent">
29 + <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
30 + <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
31 + <li class="nav-item"><a class="nav-link" href="/menu">휴게소 메뉴</a></li>
32 + <li class="nav-item"><a class="nav-link" href="/weather">날씨</a></li>
33 + <li class="nav-item"><a class="nav-link" href="/lpg">LPG</a></li>
34 + <li class="nav-item"><a class="nav-link" href="faq.html">FAQ</a></li>
35 + <li class="nav-item dropdown">
36 + <a class="nav-link dropdown-toggle" id="navbarDropdownBlog" href="#" role="button"
37 + data-bs-toggle="dropdown" aria-expanded="false">Blog</a>
38 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownBlog">
39 + <li><a class="dropdown-item" href="blog-home.html">Blog Home</a></li>
40 + <li><a class="dropdown-item" href="blog-post.html">Blog Post</a></li>
41 + </ul>
42 + </li>
43 + <li class="nav-item dropdown">
44 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button"
45 + data-bs-toggle="dropdown" aria-expanded="false">Login</a>
46 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
47 + <li><a class="dropdown-item" href="login.html">Login</a></li>
48 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
49 + </ul>
50 + </li>
51 + </ul>
52 + </div>
53 + </div>
54 + </nav>
55 + <!-- Header-->
56 + <header class="py-5">
57 + <div class="container px-5">
58 + <div class="row justify-content-center">
59 + <div class="col-lg-8 col-xxl-6">
60 + <div class="text-center my-5">
61 + <h1>로그인</h1>
62 + <br>
63 + <form method="post" action="/login/process">
64 + <table>
65 + <tr>
66 + <td><label>이름</label></td>
67 + <td><input type="text" name="name"></td>
68 + </tr>
69 + <tr>
70 + <td><label>아이디</label></td>
71 + <td><input type="text" name="id"></td>
72 + </tr>
73 + <tr>
74 + <td><label>비밀번호</label></td>
75 + <td><input type="text" name="password"></td>
76 + </tr>
77 + </table>
78 + <input type="submit" value="전송" name="">
79 + </form>
80 + </div>
81 + </div>
82 + </div>
83 + </div>
84 + </header>
85 + <!-- About section one-->
86 + </main>
87 + <!-- Footer-->
88 + <footer class="bg-dark py-4 mt-auto">
89 + <div class="container px-5">
90 + <div class="row align-items-center justify-content-between flex-column flex-sm-row">
91 + <div class="col-auto">
92 + <div class="small m-0 text-white">Copyright &copy; Your Website 2022</div>
93 + </div>
94 + <div class="col-auto">
95 + <a class="link-light small" href="#!">Privacy</a>
96 + <span class="text-white mx-1">&middot;</span>
97 + <a class="link-light small" href="#!">Terms</a>
98 + <span class="text-white mx-1">&middot;</span>
99 + <a class="link-light small" href="#!">Contact</a>
100 + </div>
101 + </div>
102 + </div>
103 + </footer>
104 + <!-- Bootstrap core JS-->
105 + <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
106 + <!-- Core theme JS-->
107 + <script src="js/scripts.js"></script>
108 +</body>
109 +
110 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 var express = require('express') 1 var express = require('express')
2 var router = express.Router() 2 var router = express.Router()
3 3
4 -/*
5 -//라우터 객체 참조
6 -var router = express.Router();
7 -
8 //라우팅 함수 등록 4 //라우팅 함수 등록
9 -router.route('/process/login/:name').post(function (req, res) {
10 - console.log('/process/login/:name 처리함');
11 5
12 - var paramName = req.params.name; 6 +router.get('/',function(req,res){
7 + res.render('login.html')
8 +});
9 +
10 +router.post('/process', function(req, res) {
11 + console.log('/process/login 처리함');
13 12
14 var paramId = req.body.id || req.query.id; 13 var paramId = req.body.id || req.query.id;
15 var paramPassword = req.body.password || req.query.password; 14 var paramPassword = req.body.password || req.query.password;
...@@ -17,17 +16,10 @@ router.route('/process/login/:name').post(function (req, res) { ...@@ -17,17 +16,10 @@ router.route('/process/login/:name').post(function (req, res) {
17 16
18 res.writeHead('200', { 'Content-Type': 'text/html;charset=utf8' }); 17 res.writeHead('200', { 'Content-Type': 'text/html;charset=utf8' });
19 res.write('<h1>Result form Express Server</h1>'); 18 res.write('<h1>Result form Express Server</h1>');
20 - res.write('<div><p>Param name : ' + paramName + '</p></div>');
21 res.write('<div><p>Param id : ' + paramId + '</p></div>'); 19 res.write('<div><p>Param id : ' + paramId + '</p></div>');
22 res.write('<div><p>Param password : ' + paramPassword + '</p></div>'); 20 res.write('<div><p>Param password : ' + paramPassword + '</p></div>');
23 - res.write("<br><br><a href ='/login3.html'>로그인 페이지로 돌아가기</a>"); 21 + res.write("<br><br><a href ='/login.html'>로그인 페이지로 돌아가기</a>");
24 res.end(); 22 res.end();
25 }); 23 });
26 -*/
27 -router.get('/',function(req,res){
28 - res.render('login.html')
29 -})
30 -
31 -
32 24
33 module.exports = router 25 module.exports = router
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -2,7 +2,25 @@ var express = require('express') ...@@ -2,7 +2,25 @@ var express = require('express')
2 var router = express.Router() 2 var router = express.Router()
3 3
4 router.get('/',function(req,res){ 4 router.get('/',function(req,res){
5 - res.render('sign_up.html') 5 + res.render('views/signup.html')
6 -}) 6 +});
7 +
8 +
9 +router.post('/process', function(req, res) {
10 + console.log('/signup/process 처리함');
11 +
12 + var paramName = req.body.name || req.query.name;
13 + var paramId = req.body.id || req.query.id;
14 + var paramPassword = req.body.password || req.query.password;
15 + //GET, POST 모두 고려해서 둘 다 검사
16 +
17 + res.writeHead('200', { 'Content-Type': 'text/html;charset=utf8' });
18 + res.write('<h1>Result form Express Server</h1>');
19 + res.write('<div><p>Param name : ' + paramName + '</p></div>');
20 + res.write('<div><p>Param id : ' + paramId + '</p></div>');
21 + res.write('<div><p>Param password : ' + paramPassword + '</p></div>');
22 + res.write("<br><br><a href ='/login.html'>로그인 페이지로 돌아가기</a>");
23 + res.end();
24 +});
7 25
8 module.exports = router 26 module.exports = router
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -35,10 +35,10 @@ ...@@ -35,10 +35,10 @@
35 </ul> 35 </ul>
36 </li> 36 </li>
37 <li class="nav-item dropdown"> 37 <li class="nav-item dropdown">
38 - <a class="nav-link dropdown-toggle" id="navbarDropdownPortfolio" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Portfolio</a> 38 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Login</a>
39 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownPortfolio"> 39 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
40 - <li><a class="dropdown-item" href="portfolio-overview.html">Portfolio Overview</a></li> 40 + <li><a class="dropdown-item" href="login.html">Login</a></li>
41 - <li><a class="dropdown-item" href="portfolio-item.html">Portfolio Item</a></li> 41 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
42 </ul> 42 </ul>
43 </li> 43 </li>
44 </ul> 44 </ul>
......
...@@ -35,10 +35,10 @@ ...@@ -35,10 +35,10 @@
35 </ul> 35 </ul>
36 </li> 36 </li>
37 <li class="nav-item dropdown"> 37 <li class="nav-item dropdown">
38 - <a class="nav-link dropdown-toggle" id="navbarDropdownPortfolio" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Portfolio</a> 38 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Login</a>
39 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownPortfolio"> 39 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
40 - <li><a class="dropdown-item" href="portfolio-overview.html">Portfolio Overview</a></li> 40 + <li><a class="dropdown-item" href="login.html">Login</a></li>
41 - <li><a class="dropdown-item" href="portfolio-item.html">Portfolio Item</a></li> 41 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
42 </ul> 42 </ul>
43 </li> 43 </li>
44 </ul> 44 </ul>
......
...@@ -35,10 +35,10 @@ ...@@ -35,10 +35,10 @@
35 </ul> 35 </ul>
36 </li> 36 </li>
37 <li class="nav-item dropdown"> 37 <li class="nav-item dropdown">
38 - <a class="nav-link dropdown-toggle" id="navbarDropdownPortfolio" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Portfolio</a> 38 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Login</a>
39 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownPortfolio"> 39 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
40 - <li><a class="dropdown-item" href="portfolio-overview.html">Portfolio Overview</a></li> 40 + <li><a class="dropdown-item" href="login.html">Login</a></li>
41 - <li><a class="dropdown-item" href="portfolio-item.html">Portfolio Item</a></li> 41 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
42 </ul> 42 </ul>
43 </li> 43 </li>
44 </ul> 44 </ul>
......
1 -<!DOCTYPE html>
2 -<html>
3 - <head>
4 - <meta charset="UTF-8">
5 - <tilte>로그인 테스트</tilte>
6 - </head>
7 - <body>
8 - <h1>로그인</h1>
9 - <br>
10 - <form method="post" action="/process/login/rest_list">
11 - <table>
12 - <tr>
13 - <td><label>아이디</label></td>
14 - <td><input type="text" name="id"></td>
15 - </tr>
16 - <tr>
17 - <td><label>비밀번호</label></td>
18 - <td><input type="text" name="password"></td>
19 - </tr>
20 - </table>
21 - <input type="submit" value="전송" name="">
22 - </form>
23 - </body>
24 -</html>
...\ No newline at end of file ...\ No newline at end of file
...@@ -35,10 +35,10 @@ ...@@ -35,10 +35,10 @@
35 </ul> 35 </ul>
36 </li> 36 </li>
37 <li class="nav-item dropdown"> 37 <li class="nav-item dropdown">
38 - <a class="nav-link dropdown-toggle" id="navbarDropdownPortfolio" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Portfolio</a> 38 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Login</a>
39 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownPortfolio"> 39 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
40 - <li><a class="dropdown-item" href="portfolio-overview.html">Portfolio Overview</a></li> 40 + <li><a class="dropdown-item" href="login.html">Login</a></li>
41 - <li><a class="dropdown-item" href="portfolio-item.html">Portfolio Item</a></li> 41 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
42 </ul> 42 </ul>
43 </li> 43 </li>
44 </ul> 44 </ul>
......
...@@ -35,10 +35,10 @@ ...@@ -35,10 +35,10 @@
35 </ul> 35 </ul>
36 </li> 36 </li>
37 <li class="nav-item dropdown"> 37 <li class="nav-item dropdown">
38 - <a class="nav-link dropdown-toggle" id="navbarDropdownPortfolio" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Portfolio</a> 38 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Login</a>
39 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownPortfolio"> 39 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
40 - <li><a class="dropdown-item" href="portfolio-overview.html">Portfolio Overview</a></li> 40 + <li><a class="dropdown-item" href="login.html">Login</a></li>
41 - <li><a class="dropdown-item" href="portfolio-item.html">Portfolio Item</a></li> 41 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
42 </ul> 42 </ul>
43 </li> 43 </li>
44 </ul> 44 </ul>
......
...@@ -35,10 +35,10 @@ ...@@ -35,10 +35,10 @@
35 </ul> 35 </ul>
36 </li> 36 </li>
37 <li class="nav-item dropdown"> 37 <li class="nav-item dropdown">
38 - <a class="nav-link dropdown-toggle" id="navbarDropdownPortfolio" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Portfolio</a> 38 + <a class="nav-link dropdown-toggle" id="navbarDropdownLogin" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Login</a>
39 - <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownPortfolio"> 39 + <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownLogin">
40 - <li><a class="dropdown-item" href="portfolio-overview.html">Portfolio Overview</a></li> 40 + <li><a class="dropdown-item" href="login.html">Login</a></li>
41 - <li><a class="dropdown-item" href="portfolio-item.html">Portfolio Item</a></li> 41 + <li><a class="dropdown-item" href="signup.html">Sign-up</a></li>
42 </ul> 42 </ul>
43 </li> 43 </li>
44 </ul> 44 </ul>
......