Merge branch 'feature/setting_basic' into 'develop'

setting basic router



See merge request !1

@@ -8,6 +8,7 @@
     "@testing-library/user-event": "^7.1.2",
     "@testing-library/user-event": "^7.1.2",
     "react": "^16.13.1",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
     "react-dom": "^16.13.1",
+    "react-router-dom": "^5.2.0",
     "react-scripts": "3.4.1"
     "react-scripts": "3.4.1"
   },
   },
   "scripts": {
   "scripts": {

-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
+import React, { Component } from "react";
+import { HashRouter, Route } from "react-router-dom";
+import ScrollToTop from "./ScrollToTop";
+import Home from "./home";
 
 
-function App() {
-  return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>src/App.js</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
-  );
+class App extends Component {
+  constructor(props) {
+    super(props);
+  }
+  render() {
+    return (
+      <HashRouter basename={process.env.PUBLIC_URL}>
+        <ScrollToTop>
+          <div className="App">
+            <Route exact path="/" component={Home} />
+          </div>
+        </ScrollToTop>
+      </HashRouter>
+    );
+  }
 }
 }
 
 
 export default App;
 export default App;

+import { Component } from "react";
+import { withRouter } from "react-router-dom";
+
+class ScrollToTop extends Component {
+  componentDidUpdate(prevProps) {
+    if (this.props.location !== prevProps.location) {
+      window.scrollTo(0, 0);
+    }
+  }
+
+  render() {
+    return this.props.children;
+  }
+}
+
+export default withRouter(ScrollToTop);

+import React, { Component } from "react";
+import logo from "./logo.svg";
+import "./App.css";
+export default class Home extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  render() {
+    return (
+      <div className="App">
+        <header className="App-header">
+          <img src={logo} className="App-logo" alt="logo" />
+          <p>
+            Edit <code>src/App.js</code> and save to reload.
+          </p>
+          <a
+            className="App-link"
+            href="https://reactjs.org"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Learn React
+          </a>
+        </header>
+      </div>
+    );
+  }
+}