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

.gitignore

+node_modules
\ No newline at end of file

client/.eslintcache

-[{"C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\index.js":"1","C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\App.js":"2","C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\reportWebVitals.js":"3","C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\MainRouter.jsx":"4","C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\home\\Main.jsx":"5","C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\home\\Home.jsx":"6"},{"size":628,"mtime":1609072355713,"results":"7","hashOfConfig":"8"},{"size":251,"mtime":1609072355700,"results":"9","hashOfConfig":"8"},{"size":375,"mtime":1609072355927,"results":"10","hashOfConfig":"8"},{"size":521,"mtime":1609072355706,"results":"11","hashOfConfig":"8"},{"size":5084,"mtime":1609072355709,"results":"12","hashOfConfig":"8"},{"size":1611,"mtime":1609074956748,"results":"13","hashOfConfig":"8"},{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"zqc0qw",{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"20","messages":"21","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"22","messages":"23","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"24","messages":"25","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\index.js",[],"C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\App.js",[],"C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\reportWebVitals.js",[],"C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\MainRouter.jsx",["26"],"C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\home\\Main.jsx",["27","28","29"],"C:\\Users\\Korea\\Desktop\\2020winter\\search-page\\client\\src\\home\\Home.jsx",["30","31"],{"ruleId":"32","severity":1,"message":"33","line":3,"column":8,"nodeType":"34","messageId":"35","endLine":3,"endColumn":12},{"ruleId":"32","severity":1,"message":"36","line":6,"column":10,"nodeType":"34","messageId":"35","endLine":6,"endColumn":18},{"ruleId":"32","severity":1,"message":"37","line":8,"column":8,"nodeType":"34","messageId":"35","endLine":8,"endColumn":11},{"ruleId":"32","severity":1,"message":"38","line":21,"column":11,"nodeType":"34","messageId":"35","endLine":21,"endColumn":22},{"ruleId":"32","severity":1,"message":"39","line":7,"column":8,"nodeType":"34","messageId":"35","endLine":7,"endColumn":11},{"ruleId":"32","severity":1,"message":"37","line":8,"column":8,"nodeType":"34","messageId":"35","endLine":8,"endColumn":11},"no-unused-vars","'Home' is defined but never used.","Identifier","unusedVar","'Redirect' is defined but never used.","'Col' is defined but never used.","'clickSubmit' is assigned a value but never used.","'Row' is defined but never used."]
+[{"C:\\Users\\sag06\\Desktop\\project\\search-page\\client\\src\\Search.js":"1","C:\\Users\\sag06\\Desktop\\project\\search-page\\client\\src\\Components\\Place.js":"2","C:\\Users\\sag06\\Desktop\\project\\search-page\\client\\src\\App.js":"3"},{"size":45798,"mtime":1609291728121,"results":"4","hashOfConfig":"5"},{"size":2147,"mtime":1609148535437,"results":"6","hashOfConfig":"5"},{"size":1359,"mtime":1609244671772,"results":"7","hashOfConfig":"5"},{"filePath":"8","messages":"9","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1n20xnc",{"filePath":"10","messages":"11","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"12"},{"filePath":"13","messages":"14","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\sag06\\Desktop\\project\\search-page\\client\\src\\Search.js",[],"C:\\Users\\sag06\\Desktop\\project\\search-page\\client\\src\\Components\\Place.js",["15"],"import React from 'react';\r\nimport { Modal, Container, Row, Col, Button } from 'react-bootstrap';\r\n\r\nfunction Place(props) {\r\n  return (\r\n    <Modal {...props}\r\n      size=\"lg\"\r\n      // show={lgShow}\r\n      // onHide={() => setLgShow(false)}\r\n      aria-labelledby=\"example-modal-sizes-title-lg\">\r\n      <Modal.Header closeButton>\r\n        <Modal.Title id=\"contained-modal-title-vcenter\">\r\n          {props.search.name} \r\n          </Modal.Title>\r\n      </Modal.Header>\r\n      <Modal.Body className=\"show-grid\">\r\n        <Container>\r\n          <Row className=\"mt-4\">\r\n            <div>주도 전역을 지배하는 한라산은 남한에서 가장 높은 산으로 높이는 1,947.3m이다. 한라산이라는 이름은 산이 높아 산정에 서면 은하수를 잡아당길 수 있다는 뜻이며, 부악·원산·선산·두무악·영주산·부라산·혈망봉·여장군 등으로도 불려왔다.</div>\r\n            <a href=\"https://www.daum.net\">다음의 블로그</a>\r\n          </Row>\r\n          <Row className=\"mt-4\">\r\n            <div>한라산은 1966년 한라산 천연보호구역으로, 1970년 국립공원으로 지정되었다. 그리고 2002년에는 유네스코 생물권보전지역으로 지정되었으며 2007년에는 유네스코 세계자연유산으로 등재되었다. 2008년에는 물장오리오름 산정화구호 습지가 람사르 습지로 등록되어 보호 관리되고 있다</div>\r\n            <a href=\"https://www.naver.com/\">네이버의 블로그</a>\r\n          </Row>\r\n          <Row className=\"mt-4\">\r\n            <div>한라산은 제주도에 있는 해발 1,947.06m, 면적 약 1,820km²의 화산으로, 제주도의 면적 대부분을 차지하고 있다. 정상에 백록담이라는 화산호가 있는데, 백록담이라는 이름은 흰 사슴이 물을 먹는 곳이라는 뜻에서 왔다고 전해진다.</div>\r\n            <a href=\"https://www.google.com/\">구글의 블로그</a></Row>\r\n        </Container>\r\n      </Modal.Body>\r\n      <Modal.Footer>\r\n        <Button onClick={props.onHide}>Close</Button>\r\n      </Modal.Footer>\r\n    </Modal>\r\n  );\r\n}\r\n\r\nexport default Place;","C:\\Users\\sag06\\Desktop\\project\\search-page\\client\\src\\App.js",["16","17"],{"ruleId":"18","severity":1,"message":"19","line":2,"column":33,"nodeType":"20","messageId":"21","endLine":2,"endColumn":36},{"ruleId":"18","severity":1,"message":"22","line":1,"column":17,"nodeType":"20","messageId":"21","endLine":1,"endColumn":26},{"ruleId":"18","severity":1,"message":"23","line":2,"column":10,"nodeType":"20","messageId":"21","endLine":2,"endColumn":14},"no-unused-vars","'Col' is defined but never used.","Identifier","unusedVar","'useEffect' is defined but never used.","'Link' is defined but never used."]
\ No newline at end of file

client/README.md

-# Getting Started with Create React App
+ㅋ# Getting Started with Create React App
 
 This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
 
@@ -6,7 +6,7 @@ This project was bootstrapped with [Create React App](https://github.com/faceboo
 
 In the project directory, you can run:
 
-### `npm start`
+### `yarn start`
 
 Runs the app in the development mode.\
 Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
@@ -14,12 +14,12 @@ Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
 The page will reload if you make edits.\
 You will also see any lint errors in the console.
 
-### `npm test`
+### `yarn test`
 
 Launches the test runner in the interactive watch mode.\
 See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
 
-### `npm run build`
+### `yarn build`
 
 Builds the app for production to the `build` folder.\
 It correctly bundles React in production mode and optimizes the build for the best performance.
@@ -29,7 +29,7 @@ Your app is ready to be deployed!
 
 See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
 
-### `npm run eject`
+### `yarn eject`
 
 **Note: this is a one-way operation. Once you `eject`, you can’t go back!**
 
@@ -65,6 +65,6 @@ This section has moved here: [https://facebook.github.io/create-react-app/docs/a
 
 This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
 
-### `npm run build` fails to minify
+### `yarn build` fails to minify
 
 This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)

client/src/App.css

+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

client/src/App.js

-import React from 'react';
-import { BrowserRouter } from 'react-router-dom'
-import MainRouter from './MainRouter';
+import React, { useEffect, useState } from 'react';
+import { Link, Redirect } from 'react-router-dom';
+import ohuh from './ohuh.PNG';
+import { Container, Row, Form, Image, InputGroup, Button } from 'react-bootstrap';
 
 function App() {
-  return (
+  const [state, setState] = useState(false);
+  const [search, setSearch] = useState("");
+
+  if (state !== false) {
+    return <Redirect to={{
+      pathname: `/search/${search}`,
+      state: { id: search },
+    }} />;
+  }
+
+  const handleChange = (e) => {
+    setSearch(e.target.value);
+  }
 
-    <BrowserRouter>
-      <MainRouter />
-    </BrowserRouter>
+  const handleSubmit = () => {
+    setState(true);
+  }
 
+
+
+  return (
+    <Container className="vh-100">
+      <Row className="d-flex justify-content-md-center">
+        <Image src={ohuh} />
+      </Row>
+      <Row className="d-flex justify-content-md-center">
+        <Form className="vw-100" onSubmit={handleSubmit}>
+          <InputGroup>
+            <Form.Control
+              size="lg"
+              placeholder="검색어를 입력하세요."
+              aria-label="Large"
+              aria-describedby="inputGroup-sizing-sm"
+              onChange={handleChange}
+            />
+            <InputGroup.Append>
+              <Button type='submit' variant="outline-secondary">검색</Button>
+            </InputGroup.Append>
+          </InputGroup>
+        </Form>
+      </Row>
+    </Container>
   );
 }
 

client/src/App.test.js

-import React from 'react';
-import { render } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
 import App from './App';
 
 test('renders learn react link', () => {
-  const { getByText } = render(<App />);
-  const linkElement = getByText(/learn react/i);
+  render(<App />);
+  const linkElement = screen.getByText(/learn react/i);
   expect(linkElement).toBeInTheDocument();
 });

client/src/Components/Place.js

+import React from 'react';
+import { Modal, Container, Row, Col, Button } from 'react-bootstrap';
+
+function Place(props) {
+  return (
+    <Modal {...props}
+      size="lg"
+      // show={lgShow}
+      // onHide={() => setLgShow(false)}
+      aria-labelledby="example-modal-sizes-title-lg">
+      <Modal.Header closeButton>
+        <Modal.Title id="contained-modal-title-vcenter">
+          {props.search.name} 
+          </Modal.Title>
+      </Modal.Header>
+      <Modal.Body className="show-grid">
+        <Container>
+          <Row className="mt-4">
+            <div>주도 전역을 지배하는 한라산은 남한에서 가장 높은 산으로 높이는 1,947.3m이다. 한라산이라는 이름은 산이 높아 산정에 서면 은하수를 잡아당길 수 있다는 뜻이며, 부악·원산·선산·두무악·영주산·부라산·혈망봉·여장군 등으로도 불려왔다.</div>
+            <a href="https://www.daum.net">다음의 블로그</a>
+          </Row>
+          <Row className="mt-4">
+            <div>한라산은 1966년 한라산 천연보호구역으로, 1970년 국립공원으로 지정되었다. 그리고 2002년에는 유네스코 생물권보전지역으로 지정되었으며 2007년에는 유네스코 세계자연유산으로 등재되었다. 2008년에는 물장오리오름 산정화구호 습지가 람사르 습지로 등록되어 보호 관리되고 있다</div>
+            <a href="https://www.naver.com/">네이버의 블로그</a>
+          </Row>
+          <Row className="mt-4">
+            <div>한라산은 제주도에 있는 해발 1,947.06m, 면적 약 1,820km²의 화산으로, 제주도의 면적 대부분을 차지하고 있다. 정상에 백록담이라는 화산호가 있는데, 백록담이라는 이름은 흰 사슴이 물을 먹는 곳이라는 뜻에서 왔다고 전해진다.</div>
+            <a href="https://www.google.com/">구글의 블로그</a></Row>
+        </Container>
+      </Modal.Body>
+      <Modal.Footer>
+        <Button onClick={props.onHide}>Close</Button>
+      </Modal.Footer>
+    </Modal>
+  );
+}
+
+export default Place;
\ No newline at end of file

client/src/index.js

 import React from 'react';
 import ReactDOM from 'react-dom';
-// import './index.css';
+import './index.css';
+import 'bootstrap/dist/css/bootstrap.min.css';
 import App from './App';
+import Search from './Search';
 import reportWebVitals from './reportWebVitals';
-import 'bootstrap/dist/css/bootstrap.min.css';
-// import '@fortawesome/fontawesome-free/css/all.css'
+import {
+  BrowserRouter as Router,
+  Switch,
+  Route,
+  Redirect,
+} from "react-router-dom";
 
 ReactDOM.render(
-  //<React.StrictMode>
-    <App />,
-  //</React.StrictMode>,
+  <React.StrictMode>
+    <Router>
+      <Switch>
+        <Route exact path="/" component={App} />
+        <Route path="/search" component={Search} />
+        <Redirect path="/search/:id" to="/search" />
+      </Switch>
+    </Router>
+  </React.StrictMode>,
   document.getElementById('root')
 );
 

server/server.js

+import express from 'express'
+
+const app = express()
+
+app.get('/', (req, res) => {
+    res.send('Hello')
+})
+
+app.get('/home', (req, res) => {
+    res.send('Home page')
+})
+
+app.put('/signin', (req, res) => {
+    res.send('Sign in')
+})
+
+app.listen(3001, () => {
+    console.log('Server is listening on port 3001')
+})
\ No newline at end of file