문학주 4주차 과제

.gitignore

@@ -3,6 +3,7 @@
 # README.md
 # /assets
 # */node_modules
+node_modules/   
 
 # dependencies
 

4week/class/src/App.css

@@ -1,32 +1,22 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 40vmin;
-}
-
-.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);
-  }
-}
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+}
+
+.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: #09d3ac;
+}

4week/class/src/App.js

@@ -1,42 +1,32 @@
-import React, { Component } from 'react';
-import logo from './logo.svg';
-import './App.css';
-import 'bootstrap/dist/css/bootstrap.min.css';//bootstrap css를 사용하기 위해서 불러옵니다.
-import Navbar from './component/navbar/Navbar.js';
-import MainView from './container/MainView.js';
-import ContentView from './component/contentView/ContentView.js';
-import {Switch, Route } from 'react-router-dom'//router를 사용하기 위해서 react router dom 불러옵니다.
-import Search from "./container/Search.js";
-
-//router를 감싸고 있는 함수형 컴포넌트
-const Main =()=>(//라우팅할때 url이 중복되는것을 막기 위해서 switch 사용
-		<Switch>
-      {/* 
-          "/" 을 가지는 /serach, /view/:id로 이동을 하면 "/"이 포함되어있기 때문에 MainView또한 렌더링이 됩니다.
-          이것을 막기 위해서 exact속성을 추가 합니다.
-      */}
-			<Route exact path="/" component={MainView}></Route>
-      {/*
-          "/view/:id"에 url이 이동했을때 ContentView 컴포넌트를 렌더링합니다.
-          여기에서 ":id" 이 부분은 url에 변화가 필요할때 사용하는 방식 입니다.
-          ":이름"" 이렇게 설정하면 url을 /view/123, /view/555 라고 해도 ContetnView 컴포넌트를 렌더링하게됩니다.
-      */}
-			<Route  path="/view/:id" component={ContentView}></Route>
-      <Route path="/search" component={Search}></Route>
-		</Switch>
-	)
-
-class App extends Component {
-  render() { 
-    return (
-      <div className="App">
-        {/* 네이게이션바 컴포넌트*/}
-        <Navbar />
-        {/* 라우터를 가지고 있는 컴포넌트*/}
-        <Main />
-      </div>
-    );
-  }
-}
-
-export default App;
+import React, { Component } from "react";
+import AddTodo from "./containers/AddTodo";
+import TodoList from "./containers/TodoList";
+import { connect } from "react-redux";
+import { addTodo } from "./modules/actions";
+
+class App extends Component {
+
+  render() {
+    return (
+      <div>
+        <AddTodo addTodo={this.props.addTodo} todos={this.props.todos} />
+        <TodoList todos={this.props.todos} />
+      </div> 
+    );
+  } 
+}
+const mapDispatchToProps = dispatch => {
+  return {
+    addTodo: (todo,todos) => {
+      dispatch(addTodo(todo,todos));
+    } 
+  };
+};
+
+const mapStateToProps = state => {
+  return { todos: state.todos };
+};
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(App);

4week/class/src/App.test.js

@@ -1,9 +1,9 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import App from './App';
-
-it('renders without crashing', () => {
-  const div = document.createElement('div');
-  ReactDOM.render(<App />, div);
-  ReactDOM.unmountComponentAtNode(div);
-});
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+it('renders without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<App />, div);
+  ReactDOM.unmountComponentAtNode(div);
+});