Merge branch 'master' of https://github.com/kevink1113/ImCloud_Play_1 …

…into master

.eslintcache

@@ -1 +1 @@
-[{"/Users/gangsang-won/Documents/imcloud_play_1/src/index.js":"1","/Users/gangsang-won/Documents/imcloud_play_1/src/reportWebVitals.js":"2","/Users/gangsang-won/Documents/imcloud_play_1/src/StyleView.js":"3","/Users/gangsang-won/Documents/imcloud_play_1/src/StyleStat.js":"4"},{"size":571,"mtime":1610527408906,"results":"5","hashOfConfig":"6"},{"size":362,"mtime":1610526051093,"results":"7","hashOfConfig":"6"},{"size":860,"mtime":1610529366171,"results":"8","hashOfConfig":"6"},{"size":527,"mtime":1610527759170,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"ces8gc",{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"14"},{"filePath":"15","messages":"16","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"17","messages":"18","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/gangsang-won/Documents/imcloud_play_1/src/index.js",[],"/Users/gangsang-won/Documents/imcloud_play_1/src/reportWebVitals.js",[],["19","20"],"/Users/gangsang-won/Documents/imcloud_play_1/src/StyleView.js",["21"],"/Users/gangsang-won/Documents/imcloud_play_1/src/StyleStat.js",[],{"ruleId":"22","replacedBy":"23"},{"ruleId":"24","replacedBy":"25"},{"ruleId":"26","severity":1,"message":"27","line":8,"column":9,"nodeType":"28","endLine":8,"endColumn":33},"no-native-reassign",["29"],"no-negated-in-lhs",["30"],"jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","JSXOpeningElement","no-global-assign","no-unsafe-negation"]
+[{"/Users/gangsang-won/Documents/imcloud_play_1/src/index.js":"1","/Users/gangsang-won/Documents/imcloud_play_1/src/reportWebVitals.js":"2","/Users/gangsang-won/Documents/imcloud_play_1/src/StyleView.js":"3","/Users/gangsang-won/Documents/imcloud_play_1/src/StyleStat.js":"4","/Users/gangsang-won/Documents/imcloud_play_1/src/mainpage/MainPage.js":"5","/Users/gangsang-won/Documents/imcloud_play_1/src/mainpage/MainPage2.js":"6","/Users/gangsang-won/Documents/imcloud_play_1/src/mainpage/StartButton.js":"7"},{"size":907,"mtime":1610589445918,"results":"8","hashOfConfig":"9"},{"size":362,"mtime":1610526051093,"results":"10","hashOfConfig":"9"},{"size":860,"mtime":1610529366171,"results":"11","hashOfConfig":"9"},{"size":527,"mtime":1610527759170,"results":"12","hashOfConfig":"9"},{"size":678,"mtime":1610589445919,"results":"13","hashOfConfig":"9"},{"size":380,"mtime":1610589445919,"results":"14","hashOfConfig":"9"},{"size":290,"mtime":1610589445920,"results":"15","hashOfConfig":"9"},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"ces8gc",{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"20"},{"filePath":"21","messages":"22","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"23","messages":"24","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"25","messages":"26","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"27","messages":"28","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"29","messages":"30","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/gangsang-won/Documents/imcloud_play_1/src/index.js",[],"/Users/gangsang-won/Documents/imcloud_play_1/src/reportWebVitals.js",[],["31","32"],"/Users/gangsang-won/Documents/imcloud_play_1/src/StyleView.js",["33"],"/Users/gangsang-won/Documents/imcloud_play_1/src/StyleStat.js",[],"/Users/gangsang-won/Documents/imcloud_play_1/src/mainpage/MainPage.js",[],"/Users/gangsang-won/Documents/imcloud_play_1/src/mainpage/MainPage2.js",[],"/Users/gangsang-won/Documents/imcloud_play_1/src/mainpage/StartButton.js",[],{"ruleId":"34","replacedBy":"35"},{"ruleId":"36","replacedBy":"37"},{"ruleId":"38","severity":1,"message":"39","line":8,"column":9,"nodeType":"40","endLine":8,"endColumn":33},"no-native-reassign",["41"],"no-negated-in-lhs",["42"],"jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","JSXOpeningElement","no-global-assign","no-unsafe-negation"]

.gitignore

@@ -1,5 +1,8 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
+package-lock.json
+package.json
+
 # dependencies
 /node_modules
 /.pnp

package.json

@@ -6,6 +6,7 @@
     "@testing-library/jest-dom": "^5.11.9",
     "@testing-library/react": "^11.2.3",
     "@testing-library/user-event": "^12.6.0",
+    "node": "^15.4.0",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-router-dom": "^5.2.0",

src/index.js

@@ -1,16 +1,33 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import StyleView from './StyleView';
-import StyleStat from './StyleStat';
-import reportWebVitals from './reportWebVitals';
+import React from "react";
+import ReactDOM from "react-dom";
+import "./index.css";
+import StyleView from "./StyleView";
+import StyleStat from "./StyleStat";
+import reportWebVitals from "./reportWebVitals";
+import MainPage from "./mainpage/MainPage";
+import { BrowserRouter, Route } from "react-router-dom";
+
+function App() {
+  return (
+    <div>
+      {/*  시작페이지 */}
+      <Route exact path="/">
+        <MainPage />
+      </Route>
+      {/*  결과 */}
+      <Route path="/result">
+        <StyleView />
+        <StyleStat />
+      </Route>
+    </div>
+  );
+}
 
 ReactDOM.render(
-  <React.StrictMode>
-    <StyleView/>
-    <StyleStat/>
-  </React.StrictMode>,
-  document.getElementById('root')
+  <BrowserRouter>
+    <App />
+  </BrowserRouter>,
+  document.getElementById("root")
 );
 
 // If you want to start measuring performance in your app, pass a function

src/mainpage/MainC.css

@@ -0,0 +1,19 @@
+* {
+    background-color: rgb(241, 234, 224);
+  }
+
+  #mainPage_title {
+    text-align: center;
+  }
+
+  #mainPage_cont {
+    text-align: center;
+    margin: 0.5em;
+    padding: 140px;
+    padding-top: 80px;
+  }
+
+
+  #startBt {
+    text-align: center;
+  }

src/mainpage/MainPage.js

@@ -0,0 +1,26 @@
+import './MainC.css';
+import React, {Component} from 'react';
+import MainPage2 from "./MainPage2";
+import StartButton from "./StartButton";
+
+class App extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      mainTitle : 'Lorem ipsum dolor sit amet',
+      mainContents : ' consectetur adipiscing elitPellentesque nec leo neque. Pellentesque sed est mattis, rhoncus elit eu',
+      startB : '시작'
+    }
+  }
+
+  render() { 
+    return (
+      <div>       
+        <MainPage2 title={this.state.mainTitle} cont={this.state.mainContents} />
+        <StartButton start = {this.state.startB}></StartButton>
+      </div>
+    );
+  }
+}
+
+export default App;

src/mainpage/MainPage2.js

@@ -0,0 +1,15 @@
+import React, { Component } from 'react';
+import './MainC.css';
+
+class MainPage2 extends Component {
+    render() {
+        return(
+            <div id = "mainPage_background">
+                <h2 id ="mainPage_title"> {this.props.title} </h2> <br/>
+                <div id = "mainPage_cont">{this.props.cont}</div>
+            </div>
+        );
+    }
+}
+
+export default MainPage2;

src/mainpage/StartButton.js

@@ -0,0 +1,14 @@
+import React, {Component} from 'react';
+import './MainC.css';
+
+class StartButton extends Component {
+    render() {
+        return(
+           <div id = "startBt">
+                <a href = "/result"> {this.props.start} </a>
+           </div>
+        );
+    }
+}
+
+export default StartButton;