이학주

Modify folder name and Add css in category page

...@@ -6,7 +6,7 @@ var logger = require('morgan'); ...@@ -6,7 +6,7 @@ var logger = require('morgan');
6 6
7 var indexRouter = require('./routes/index'); 7 var indexRouter = require('./routes/index');
8 var usersRouter = require('./routes/users'); 8 var usersRouter = require('./routes/users');
9 -var selectRouter = require('./routes/select'); 9 +var categoryRouter = require('./routes/category');
10 var app = express(); 10 var app = express();
11 var bodyParser = require('body-parser'); 11 var bodyParser = require('body-parser');
12 // view engine setup 12 // view engine setup
...@@ -20,7 +20,7 @@ app.use(cookieParser()); ...@@ -20,7 +20,7 @@ app.use(cookieParser());
20 app.use(express.static(path.join(__dirname, '/static'))); //정적파일 위치 20 app.use(express.static(path.join(__dirname, '/static'))); //정적파일 위치
21 app.use('/', indexRouter); 21 app.use('/', indexRouter);
22 app.use('/users', usersRouter); 22 app.use('/users', usersRouter);
23 -app.use('/select', selectRouter); 23 +app.use('/category', categoryRouter);
24 app.use(bodyParser.urlencoded({ extended: false })); 24 app.use(bodyParser.urlencoded({ extended: false }));
25 25
26 // catch 404 and forward to error handler 26 // catch 404 and forward to error handler
......
...@@ -6,3 +6,9 @@ body { ...@@ -6,3 +6,9 @@ body {
6 a { 6 a {
7 color: #00B7FF; 7 color: #00B7FF;
8 } 8 }
9 +.title{
10 + vertical-align: middle;
11 + text-align: center;
12 + font: "serif";
13 +
14 +}
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -37,7 +37,7 @@ router.post('/', function(req, res) { ...@@ -37,7 +37,7 @@ router.post('/', function(req, res) {
37 console.log(xyList); 37 console.log(xyList);
38 } 38 }
39 }) 39 })
40 - res.render('select', { 'userLocation': req.body.userLocation }); 40 + res.render('category', { 'userLocation': req.body.userLocation });
41 }); 41 });
42 42
43 router.get('/food', function(req, res) { 43 router.get('/food', function(req, res) {
......
1 +doctype html
2 +head
3 + title #{si} #{dong}
4 + <div class ="title">
5 + h1(style = "text-align : center") 당신의 동네 : #{userLocation}
6 + </div>
7 + link(rel='stylesheet' href='https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css')
8 + style.
9 + p { margin:20px 0px; }
10 + .container
11 + .row
12 + .col-4
13 + .card
14 + .text-center
15 + .card-image
16 + img(src='/restaurant.jpg' style='width:auto; height:auto; max-width:350px; max-height: 200px;')
17 + .card-body
18 + h5.card-title 음식
19 + p.card-text(style = 'text-align: center;')
20 + | 주변 음식점의 수
21 + a.btn.btn-primary(href='/category/food') 검사!
22 + .col-4
23 + .card
24 + .text-center
25 + .card-image
26 + img(src='/school.jpg' style='width:auto; height:auto; max-width:350px; max-height: 200px;')
27 + .card-body
28 + h5.card-title 학군
29 + p.card-text
30 + | 주변 학교, 학원 환경
31 + a.btn.btn-primary(href='/category/school') 검사!
32 + .col-4
33 + .card
34 + .text-center
35 + .card-image
36 + img(src='/park.jpg' style='width:auto; height:auto; max-width:350px; max-height: 200px;')
37 + .card-body
38 + h5.card-title 공원
39 + p.card-text
40 + | 주변 공원
41 + a.btn.btn-primary(href='/category/park') 검사!
42 + .col-4
43 + .card
44 + .text-center
45 + .card-image
46 + img(src='/public_transport.jpg' style='width:auto; height:auto; max-width:350px; max-height: 200px;')
47 + .card-body
48 + h5.card-title 대중교통
49 + p.card-text
50 + | 대중교통 편리도
51 + a.btn.btn-primary(href='/category/transport') 검사!
52 + .col-4
53 + .card
54 + .text-center
55 + .card-image
56 + img(src='/safe.jpg' style='width:auto; height:auto; max-width:350px; max-height: 200px;')
57 + .card-body
58 + h5.card-title 안전
59 + p.card-text
60 + | 주변 경찰서, 범죄자 인근~~
61 + a.btn.btn-primary(href='/category/safe') 검사!
62 + .col-4
63 + .card
64 + .text-center
65 + .card-image
66 + img(src='/cultural_life.jpg' style='width:auto; height:auto; max-width:350px; max-height: 200px;')
67 + .card-body
68 + h5.card-title 여가
69 + p.card-text
70 + | 문화시설
71 + a.btn.btn-primary(href='/category/culture') 검사!
72 +
...@@ -5,7 +5,7 @@ html ...@@ -5,7 +5,7 @@ html
5 link(rel='stylesheet', href='stylesheets/style.css') 5 link(rel='stylesheet', href='stylesheets/style.css')
6 body 6 body
7 img.image(src='/logo.png') 7 img.image(src='/logo.png')
8 - form(action='/select' method='post' name='location') 8 + form(action='/category' method='post' name='location')
9 input(type="text" id='userLocation' name='userLocation' placeholder="당신의 동네 주소를 입력해주세요(시/구/동)" style="width: 300px; height: 30px;") 9 input(type="text" id='userLocation' name='userLocation' placeholder="당신의 동네 주소를 입력해주세요(시/구/동)" style="width: 300px; height: 30px;")
10 input(type="submit" value="검색") 10 input(type="submit" value="검색")
11 11
......
1 -doctype html
2 -html
3 - head
4 - title= title
5 - link(rel='stylesheet', href='stylesheets/style.css')
6 - body
7 - block content
8 - h1 당신의 동네 : #{userLocation}
9 - .row
10 - .col.s12.m7
11 - .card(style='background-color: skyblue; display: inline-block;')
12 - .card-image
13 - img(src='/restaurant.jpg' style='width:400px; height: 300px;')
14 - h1.card-title 맛집
15 - .card-content
16 - p
17 - | 주변 동네 맛집의 개수와 얼마나 다양한 음식점이 있는지
18 - .card-action
19 - a(href='/select/food') 검사!
20 -
21 - .card(style='background-color: skyblue; display: inline-block;')
22 - .card-image
23 - img(src='/school.jpg' style='width:400px; height: 300px;')
24 - h1.card-title 학군
25 - .card-content
26 - p
27 - | 주변 학교, 학원 환경
28 - .card-action
29 - a(href='/select/school') 검사!
30 -
31 - .card(style='background-color: skyblue; display: inline-block;')
32 - .card-image
33 - img(src='/park.jpg' style='width:400px; height: 300px;')
34 - h1.card-title 공원
35 - .card-content
36 - p
37 - | 주변 공원
38 - .card-action
39 - a(href='/select/park') 검사!
40 -
41 - .card(style='background-color: skyblue; display: inline-block;')
42 - .card-image
43 - img(src='/public_transport.jpg' style='width:400px; height: 300px;')
44 - h1.card-title 대중교통
45 - .card-content
46 - p
47 - | 대중교통 편리도
48 - .card-action
49 - a(href='/select/transport') 검사!
50 -
51 - .card(style='background-color: skyblue; display: inline-block;')
52 - .card-image
53 - img(src='/safe.jpg' style='width:400px; height: 300px;')
54 - h1.card-title 안전
55 - .card-content
56 - p
57 - | 주변 경찰서, 범죄자 인근~~
58 - .card-action
59 - a(href='/select/safe') 검사!
60 -
61 - .card(style='background-color: skyblue; display: inline-block;')
62 - .card-image
63 - img(src='/cultural_life.jpg' style='width:400px; height: 300px;')
64 - h1.card-title 여가
65 - .card-content
66 - p
67 - | 문화생활 시설
68 - .card-action
69 - a(href='/select/culture') 검사!
70 -