Commit 70cb1c86 authored by baesangjune's avatar baesangjune
Browse files

Merge remote-tracking branch 'origin/cherry' into Sangjune

parents 046cacd3 f9bcb8f6
This diff is collapsed.
import { Pagination } from "react-bootstrap";
import React from 'react';
function Paginations(props) {
return (
<Pagination>
<Pagination.First onClick={() => props.handlePage(1)} />
{props.index === 1 ? <Pagination.Prev onClick={()=>props.handlePage(props.index)} /> : <Pagination.Prev onClick={()=>props.handlePage(props.index - 1)} />}
{props.index === props.endPage-1 ? <Pagination.Item onClick={()=>props.handlePage(props.index - 3)}>{props.index - 3}</Pagination.Item> : ""}
{props.index === props.endPage ? <Pagination.Item onClick={()=>props.handlePage(props.index - 4)}>{props.index - 4}</Pagination.Item> : ""}
{props.index === props.endPage ? <Pagination.Item onClick={()=>props.handlePage(props.index - 3)}>{props.index - 3}</Pagination.Item> : ""}
{props.index < 3 ? "" : <Pagination.Item onClick={()=>props.handlePage(props.index - 2)}>{props.index - 2}</Pagination.Item>}
{props.index === 1 ? "" : <Pagination.Item onClick={()=>props.handlePage(props.index - 1)}>{props.index - 1}</Pagination.Item>}
<Pagination.Item active>{props.index}</Pagination.Item>
{props.index === props.endPage ? "" : <Pagination.Item onClick={()=>props.handlePage(props.index + 1)}>{props.index + 1}</Pagination.Item>}
{props.index > props.endPage-2 ? "" : <Pagination.Item onClick={()=>props.handlePage(props.index + 2)}>{props.index + 2}</Pagination.Item>}
{props.index === 1 ? <Pagination.Item onClick={()=>props.handlePage(props.index + 3)}>{props.index + 3}</Pagination.Item> : ""}
{props.index === 1 ? <Pagination.Item onClick={()=>props.handlePage(props.index + 4)}>{props.index + 4}</Pagination.Item> : ""}
{props.index === 2 ? <Pagination.Item onClick={()=>props.handlePage(props.index + 3)}>{props.index + 3}</Pagination.Item> : ""}
{props.index === props.endPage ? "" : <Pagination.Next onClick={()=>props.handlePage(props.index + 1)} />}
<Pagination.Last onClick={() =>props.handlePage(props.endPage)} />
</Pagination>
)
}
export default Paginations
<<<<<<< HEAD
import React from 'react';
import { Modal, Container, Row, Col, Button, Badge, Card, Accordion, Carousel } from 'react-bootstrap';
......@@ -78,6 +79,101 @@ function Place(props) {
</Modal.Footer>
</Modal>
</>
=======
import axios from 'axios';
import React, { useEffect, useState } from 'react';
import { Modal, Container, Row, Col, Button, Badge, Card, Accordion, Carousel } from 'react-bootstrap';
function Place(props) {
const [reviews, setReviews] = useState([])
const getReview = () => {
axios.get(`/api/review/${props.search.name}`)
.then(res => {
setReviews(res.data)
})
.catch(err => {
console.log(err)
})
}
useEffect(() => {
getReview();
}, [])
return (
<Modal {...props}
size="xl"
keyboard="true"
variant="backdrop.in"
// show={lgShow}
// onHide={() => setLgShow(false)}
aria-labelledby="example-modal-sizes-title-lg">
<Modal.Header closeButton>
<Modal.Title id="contained-modal-title-vcenter" style={{ fontSize: '40px' }}>
{props.index + 1}. {props.search.name}
</Modal.Title>
</Modal.Header>
<Modal.Body className="show-grid">
<Container style={{ fontSize: '40px' }}>
{reviews.map((review, index) => {
return (
<Row className="mt-4">
<a href={review.link}>{review.title}</a>
<div>{review.summary}</div>
</Row>
)
})}
</Container>
{/* <Accordion defaultActiveKey="0">
<Accordion.Toggle as={Button} variant="link" eventKey="0">
<a className="mb-2">다음의 블로그 보기</a>
</Accordion.Toggle>
<Accordion.Collapse eventKey="0">
<Card.Body><div>주도 전역을 지배하는 한라산은 남한에서 가장 높은 산으로 높이는 1,947.3m이다. 한라산이라는 이름은 산이 높아 산정에 서면 은하수를 잡아당길 수 있다는 뜻이며, 부악·원산·선산·두무악·영주산·부라산·혈망봉·여장군 등으로도 불려왔다.</div></Card.Body>
</Accordion.Collapse>
<Row>
<Accordion.Toggle as={Button} variant="link" eventKey="1">
<a className="mb-2">네이버의 블로그 보기</a>
</Accordion.Toggle>
<Accordion.Collapse eventKey="1">
<Card.Body><div>한라산은 1966년 한라산 천연보호구역으로, 1970년 국립공원으로 지정되었다. 그리고 2002년에는 유네스코 생물권보전지역으로 지정되었으며 2007년에는 유네스코 세계자연유산으로 등재되었다. 2008년에는 물장오리오름 산정화구호 습지가 람사르 습지로 등록되어 보호 관리되고 있다</div></Card.Body>
</Accordion.Collapse>
</Row>
<Row>
<Accordion.Toggle as={Button} variant="link" eventKey="2">
<a className="mb-2">구글의 블로그 보기</a>
</Accordion.Toggle>
<Accordion.Collapse eventKey="2">
<Card.Body><div>한라산은 제주도에 있는 해발 1,947.06m, 면적 약 1,820km²의 화산으로, 제주도의 면적 대부분을 차지하고 있다. 정상에 백록담이라는 화산호가 있는데, 백록담이라는 이름은 흰 사슴이 물을 먹는 곳이라는 뜻에서 왔다고 전해진다.</div></Card.Body>
</Accordion.Collapse>
</Row>
</Accordion>
<Row style={{ color: 'white' }}>
<a href="https://www.daum.net/" className="mb-2">다음</a><a href="https://www.naver.com/" className="mb-2">네이버</a><a href="https://www.google.com/" className="mb-2">구글</a>
</Row>
// </Container>
<Carousel>
<Carousel.Item interval={1000}>
<h3>다음 블로그</h3>
<div>주도 전역을 지배하는 한라산은 남한에서 가장 높은 산으로 높이는 1,947.3m이다. 한라산이라는 이름은 산이 높아 산정에 서면 은하수를 잡아당길 수 있다는 뜻이며, 부악·원산·선산·두무악·영주산·부라산·혈망봉·여장군 등으로도 불려왔다.</div>
</Carousel.Item>
<Carousel.Item interval={1000}>
<h3>네이버 블로그</h3>
<div>한라산은 1966년 한라산 천연보호구역으로, 1970년 국립공원으로 지정되었다. 그리고 2002년에는 유네스코 생물권보전지역으로 지정되었으며 2007년에는 유네스코 세계자연유산으로 등재되었다. 2008년에는 물장오리오름 산정화구호 습지가 람사르 습지로 등록되어 보호 관리되고 있다</div>
</Carousel.Item>
<Carousel.Item interval={1000}>
<h3>구글 블로그</h3>
<div>한라산은 제주도에 있는 해발 1,947.06m, 면적 약 1,820km²의 화산으로, 제주도의 면적 대부분을 차지하고 있다. 정상에 백록담이라는 화산호가 있는데, 백록담이라는 이름은 흰 사슴이 물을 먹는 곳이라는 뜻에서 왔다고 전해진다.</div>
</Carousel.Item>
</Carousel> */}
</Modal.Body>
<Modal.Footer>
<Button block onClick={props.onHide}>Close</Button>
</Modal.Footer>
</Modal>
>>>>>>> origin/cherry
);
}
......
import React, { useState } from 'react';
import React, { useState, useEffect } from 'react';
import { Link, Redirect } from 'react-router-dom';
import ohuh from './ohuh-sm.PNG';
import Place from './Components/Place';
import { Container, Form, Row, Col, Card, Image, InputGroup, FormControl, Button, Pagination } from 'react-bootstrap';
<<<<<<< HEAD
import Paginations from './pagination.js';
=======
import Paginations from './Components/Paginations';
>>>>>>> origin/cherry
function Search(props) {
const endPage = 10;
const [state, setState] = useState(false);
const [index, setIndex] = useState(1);
<<<<<<< HEAD
const [showSet, setShowSet] = useState([false,false,false,false]);
=======
const [showSet, setShowSet] = useState([false, false, false, false]);
>>>>>>> origin/cherry
const [search, setSearch] = useState(props.location.state.id);
const [mobile, setMobile] = useState();
useEffect(() => {
if (window.innerWidth < 960) {
setMobile(true)
} else {
setMobile(false)
}
}, []);
const places = [{
name: "한라산(hallasan)",
......@@ -439,17 +456,27 @@ function Search(props) {
return page
}
<<<<<<< HEAD
// function handleShow(){
// setShow(true)
// }
=======
>>>>>>> origin/cherry
const pagePlace = paginate(places, index)
return (
<Container >
<<<<<<< HEAD
<Link to="/" className="d-flex justify-content-center"><Image src={ohuh} /></Link>
<Row className="mb-2" className="d-flex justify-content-center">
<Form style={{width:"90vw"}} onSubmit={handleSubmit}>
=======
<Link to="/" className="d-flex justify-content-center"><Image src={ohuh} /></Link>
<Row className="mb-2" className="d-flex justify-content-center">
<Form style={{ width: "90vw" }} onSubmit={handleSubmit}>
>>>>>>> origin/cherry
<InputGroup size="lg">
<FormControl
placeholder="검색어를 입력하세요."
......@@ -468,6 +495,7 @@ function Search(props) {
{pagePlace.map((place, index) => {
return (
<Col key={index} md={6} >
<<<<<<< HEAD
<Card align="center" border="info" style={{margin:"3%"}}>
<Card.Title style={{margin:"3%", fontSize:'200%', fontWeight:'bold'}} >{place.name}</Card.Title>
<Card.Img variant="top" style={{padding:"5%" ,width:"100%", height:"340px"}} src={place.img} />
......@@ -480,6 +508,20 @@ function Search(props) {
setShowSet(showArr)
} }>{place.name} 자세히 살펴보기</Button>
<Place search={place} index={index} show={showSet[index]} onHide={() => setShowSet([false,false,false,false])} />
=======
<Card align="center" border="info" style={{ margin: "3%" }}>
<Card.Title style={{ margin: "3%", fontSize: '200%', fontWeight: 'bold' }} >{place.name}</Card.Title>
<Card.Img variant="top" style={{ padding: "5%", width: "100%", height: "340px" }} src={place.img} />
<Card.Body >
<Card.Text style={{ overflow: 'auto', fontSize: '25px', width: '100%', height: "80px" }} >
{place.address} </Card.Text>
<Button variant="primary" onClick={() => {
const showArr = [false, false, false, false]
showArr[index] = true
setShowSet(showArr)
}}>{place.name} 자세히 살펴보기</Button>
<Place search={place} index={index} show={showSet[index]} onHide={() => setShowSet([false, false, false, false])} />
>>>>>>> origin/cherry
</Card.Body>
</Card>
</Col>
......@@ -492,7 +534,11 @@ function Search(props) {
<Paginations index={index} endPage={endPage} handlePage={handlePage}></Paginations>
</Row>
</Container>
<<<<<<< HEAD
=======
>>>>>>> origin/cherry
);
}
......
......@@ -4,6 +4,7 @@ import './index.css';
import 'bootstrap/dist/css/bootstrap.min.css';
import App from './App';
import Search from './Search';
import axios from 'axios';
import reportWebVitals from './reportWebVitals';
import {
BrowserRouter as Router,
......@@ -17,13 +18,17 @@ axios.defaults.validateStatus = function (status){
return status < 500; //default
}
axios.defaults.validateStatus = function (status) {
return status < 500; // default
}
ReactDOM.render(
<React.StrictMode>
<Router>
<Switch>
<Route exact path="/" component={App} />
<Route path="/search" component={Search} />
<Redirect path="/search/:id" to="/search" />
<Redirect path="/search/:search" to="/search" />
</Switch>
</Router>
</React.StrictMode>,
......
const config = {
env: process.env.NODE_ENV || 'development',
port: process.env.PORT || 3001,
jwtSecret: process.env.JWT_SECRET || 'My_Secret_Key',
mongoDbUri: process.env.MONGODB_URI || 'mongodb://localhost/search_page'
}
export default config
\ No newline at end of file
import Review from '../models/Review.js'
import cheerio from "cheerio";
import express from 'express';
import request from 'request-promise'
import jschardet from 'jschardet'
import iconv from 'iconv'
import fs from 'fs'
const Iconv = iconv.Iconv
const signup = async (req, res) => {
res.send("안녕하세요")
}
const search = async (req, res) => {
console.log(req.params.search)
console.log("req", req)
const url = "https://www.google.com/search?q=%ED%95%9C%EB%9D%BC%EC%82%B0%20site%3Atistory.com&oq=tistory&aqs=chrome..69i57j0l4j69i60l3.1746j0j4&sourceid=chrome&ie=UTF-8&ved=2ahUKEwis_bSFz4buAhWVdXAKHU0tBaoQ2wF6BAgIEAE&ei=T1D1X-yZD5XrwQPN2pTQCg"
request(url)
.then(anyToUtf8)
.then((html) => {
// fs.writeFileSync("googlez.txt", '\ufeff' + html, { encoding: 'utf8' });
let $ = cheerio.load(html, null, false);
let places = []
$('.kCrYT').each(function (i) {
places[i] = {
title: $(this).find('h3').text(),
link: $(this).find('a').attr('href'),
summary: $(this).find('.s3v9rd ').text(),
}
})
// console.log(places)
res.send(places)
})
function anyToUtf8(str) {
const { encoding } = jschardet.detect(str);
console.log("source encoding = " + encoding);
const iconv = new Iconv(encoding, "utf-8//translit//ignore");
return iconv.convert(str).toString();
}
// try {
// const newPlace = await new Place({
// name: req.params.search,
// address,
// img,
// })
// }
}
export default { signup, search }
\ No newline at end of file
import mongoose from 'mongoose'
const { String, ObjectId } = mongoose.Schema.Types
const { String } = mongoose.Schema.Types
const PlaceSchema = new mongoose.Schema({
name: {
......@@ -17,14 +17,14 @@ const PlaceSchema = new mongoose.Schema({
required: true,
default: "https://t1.daumcdn.net/thumb/R600x0/?fname=http%3A%2F%2Ft1.daumcdn.net%2Fqna%2Fimage%2F4b035cdf8372d67108f7e8d339660479dfb41bbd",
},
search: {
type: Array,
required: true,
},
time: {
type: Array,
required: true,
},
review: {
type: ObjectId,
ref: 'Review'
}
}, {
timestamps: true
})
......
......@@ -7,15 +7,14 @@ const ReviewSchema = new mongoose.Schema({
type: String,
required: true,
},
address: {
content: {
type: String,
required: true,
unique: true,
},
imag: {
type: String,
keyword: {
type: Array,
required: true,
default: "https://t1.daumcdn.net/thumb/R600x0/?fname=http%3A%2F%2Ft1.daumcdn.net%2Fqna%2Fimage%2F4b035cdf8372d67108f7e8d339660479dfb41bbd",
},
time: {
type: Array,
......
import express from 'express'
import review from '../controllers/review.controller.js'
const router = express.Router()
router.route('/api/review/:search')
.post(review.signup)
.get(review.search)
export default router
\ No newline at end of file
import express from 'express'
import connectDb from './utils/connectDb.js'
import placeRouter from './routes/place.routes.js'
import reviewRouter from './routes/review.routes.js'
connectDb()
const app = express()
app.use(express.json())
app.use(placeRouter)
app.use(reviewRouter)
app.get('/', (req, res) => {
console.log("/ req.body", req.body)
res.json({ message: "http://localhost3001/ 에 연결됨" })
})
app.listen(3001, () => {
console.log('Server is listening on port 3001')
......
......@@ -8,7 +8,7 @@ async function connectDb() {
return
}
const db = await mongoose.connect(config.mongoDburi, {
const db = await mongoose.connect(config.mongoDbUri, {
useNewUrlParser: true,
useUnifiedTopology: true,
useFindAndModify: false,
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment