diff --git a/.gitignore b/.gitignore
index a8c3a9efb..49ced0b5a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -3,6 +3,7 @@
# README.md
# /assets
# */node_modules
+node_modules/
# dependencies
diff --git a/4week/class/src/App.css b/4week/class/src/App.css
old mode 100644
new mode 100755
index 92f956e80..c9fe3d57a
--- a/4week/class/src/App.css
+++ b/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;
+}
diff --git a/4week/class/src/App.js b/4week/class/src/App.js
old mode 100644
new mode 100755
index e3694889d..6515862c4
--- a/4week/class/src/App.js
+++ b/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 사용
-
- {/*
- "/" 을 가지는 /serach, /view/:id로 이동을 하면 "/"이 포함되어있기 때문에 MainView또한 렌더링이 됩니다.
- 이것을 막기 위해서 exact속성을 추가 합니다.
- */}
-
- )
-
-class App extends Component {
- render() {
- return (
-
- {/* 네이게이션바 컴포넌트*/}
-
- );
- }
-}
-
-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 (
+
+ );
+ }
+}
+const mapDispatchToProps = dispatch => {
+ return {
+ addTodo: (todo,todos) => {
+ dispatch(addTodo(todo,todos));
+ }
+ };
+};
+
+const mapStateToProps = state => {
+ return { todos: state.todos };
+};
+export default connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(App);
\ No newline at end of file
diff --git a/4week/class/src/App.test.js b/4week/class/src/App.test.js
old mode 100644
new mode 100755
index a754b201b..821c6d3f6
--- a/4week/class/src/App.test.js
+++ b/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(
- {props.children}
- )
- }
-
-const FullContentLink = (props) => {
- return (
- {props.children}
- )
- }
-
-class Content extends Component {
- constructor(props) {
- super(props);
-
- this.state = {
- isShow: false
- };
- }
-
- onHover = () => {
- this.setState({isShow:true})
- }
-
- onUnHover = () => {
- this.setState({isShow:false})
- }
-
- onChangeFullContent = () => {
- this.props.onClick(this.props.content)
- }
-
- displayImg = () => {
- let imgSrc = "https://img.youtube.com/vi/"+this.props.content.id+"/0.jpg"
- let imgComponent = ({this.state.isShow?(
{this.props.content.name}
):""}
this.onHover()} onMouseLeave={() => this.onUnHover()}>
- {this.props.onClick?
- ({this.displayImg()} ):
- ({this.displayImg()} )}
-
- );
- }
-}
-Content.propTypes = {
- onClick : PropTypes.func,
- content: PropTypes.object
-}
-
-export default Content;
diff --git a/4week/class/src/component/contentList/ContentList.css b/4week/class/src/component/contentList/ContentList.css
deleted file mode 100644
index ba6aaf482..000000000
--- a/4week/class/src/component/contentList/ContentList.css
+++ /dev/null
@@ -1,16 +0,0 @@
-/*.col-md-3 {
- flex :0 0 23% !important;
- max-width: 23% !important;
-}
-*/
-.contentList {
- margin-top:20px;
- width:100%;
- margin-right:0px;
- margin-left:0px;
-}
-
-.row {
- margin-right:0px;
- margin-left:0px;
-}
\ No newline at end of file
diff --git a/4week/class/src/component/contentList/ContentList.js b/4week/class/src/component/contentList/ContentList.js
deleted file mode 100644
index 58e796c2d..000000000
--- a/4week/class/src/component/contentList/ContentList.js
+++ /dev/null
@@ -1,68 +0,0 @@
-import React, { Component } from 'react';
-import './ContentList.css';
-import Content from "../content/Content.js"
-import PropTypes from "prop-types";
-
-//콘텐츠의 리스트를 보여주는 컴포넌트
-class ContentList extends Component {
-
- //한줄에 4개의 콘텐츠를 출력 하기 위해서 컴포넌트를 구성해주는 함수
- listRender() {
- console.log(this.props.contents)
- var count = Math.ceil(this.props.contents.length/4)//현재 콘텐츠를 한줄에 4개씩 보여주면 몇줄이 나오는지를 구함
- let component = [] //컴포넌트를 담을 배열 선언
-
- for(let i =0;i
- {
- //위에서 4개의 데이터를 뽑아서 저장해 가지고 있던 배열을 map을 이용해서 4개의 콘텐츠를 그려준다.
- dataPerRow.map((item,index) => {
- return (
- // 반복문 안에서 jsx를 사용할때는 반드시 key를 써줘야 한다.
- // col-md-3은 한 줄을 12등분 했을때 3칸만큼을 차지 하겠다는 의미이다.
-
- {/*
- 콘텐츠를 표현해주는 content component를 선언하는데 이때 onClick이벤트를 props로 넘겨준다.
- 이 이벤트는 콘텐츠를 눌렀을때 상단의 실행되는 플레이어를 변경하는 이벤트 이다.
- */}
-
-
- )
- })
- }
-
- )
- }
-
- return component
- }
- render() {
-
-
- return (
-
- {/*
- 리스트를 렌더링해주는 함수를 실행 시킨다.
- */}
- {this.listRender()}
-
- );
- }
-}
-
-ContentList.propTypes = {
- contents: PropTypes.array,
- onClick: PropTypes.func
-}
-
-export default ContentList;
diff --git a/4week/class/src/component/contentView/ContentView.css b/4week/class/src/component/contentView/ContentView.css
deleted file mode 100644
index 16cfcd367..000000000
--- a/4week/class/src/component/contentView/ContentView.css
+++ /dev/null
@@ -1 +0,0 @@
-.content-view-iframe { height:55vw; }
\ No newline at end of file
diff --git a/4week/class/src/component/contentView/ContentView.js b/4week/class/src/component/contentView/ContentView.js
deleted file mode 100644
index 97050ec30..000000000
--- a/4week/class/src/component/contentView/ContentView.js
+++ /dev/null
@@ -1,27 +0,0 @@
-import React, { Component } from 'react';
-import "./ContentView.css";
-
-//영상 리스트를 눌렀을때 플레이어 화면만 보여주고 싶을때 사용하는 컴포넌트
-class ContentView extends Component {
- render() {
-
- return (
-
- {/*
- 유튜브를 실행 시키기 위해서는 iframe을 사용해야 하는데, 유튜브 api로 실행 시킬 주소를 받아와서
- iframe으로 실행 시킨다.
- */}
- VIDEO
-
- );
- }
-}
-
-export default ContentView;
diff --git a/4week/class/src/component/fullcontent/FullContent.css b/4week/class/src/component/fullcontent/FullContent.css
deleted file mode 100644
index 894b70feb..000000000
--- a/4week/class/src/component/fullcontent/FullContent.css
+++ /dev/null
@@ -1 +0,0 @@
-.my-iframe {display:block;border:none;height:40vw;width:100%;}
\ No newline at end of file
diff --git a/4week/class/src/component/fullcontent/FullContent.js b/4week/class/src/component/fullcontent/FullContent.js
deleted file mode 100644
index 0c28939fe..000000000
--- a/4week/class/src/component/fullcontent/FullContent.js
+++ /dev/null
@@ -1,30 +0,0 @@
-import React, { Component } from 'react';
-import "./FullContent.css";
-import PropTypes from "prop-types";
-
-//홈화면에서 영상을 실행시키는 컴포넌트
-class FullContent extends Component {
- render() {
- return (
-
- {/*
- 유튜브를 실행 시키기 위해서는 iframe을 사용해야 하는데, 유튜브 api로 실행 시킬 주소를 받아와서
- iframe으로 실행 시킨다.
- */}
- VIDEO
-
- );
- }
-}
-
-FullContent.propTypes = {
- content: PropTypes.object
-}
-
-export default FullContent;
diff --git a/4week/class/src/component/navbar/Navbar.css b/4week/class/src/component/navbar/Navbar.css
deleted file mode 100644
index 0b579e53c..000000000
--- a/4week/class/src/component/navbar/Navbar.css
+++ /dev/null
@@ -1,9 +0,0 @@
-.bg-dark-trans {
- background-color: rgba(0,0,0,0.3);
-}
-
-.logo {
- font-size:23px;
- font-weight:bold;
- color: red !important;
-}
\ No newline at end of file
diff --git a/4week/class/src/component/navbar/Navbar.js b/4week/class/src/component/navbar/Navbar.js
deleted file mode 100644
index 8b8d3bb4c..000000000
--- a/4week/class/src/component/navbar/Navbar.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import React, { Component } from 'react';
-import { Link, NavLink } from 'react-router-dom';//화면 이동을 위해 Link를 react-router-dom에서 불러옴
-import './Navbar.css';
-
-//상단 메뉴를 가지고 있는 컴포넌트
-class Navbar extends Component {
- render() {
- return (
-
-
- YOUFLIX
-
-
-
-
-
-
- {/*
- Link 컴포넌트를 이용해 url을 "/"로 변경하고 홈 화면을 렌더링
- */}
-
-
- {/*
- Link 컴포넌트를 이용해 url을 "/"로 변경하고 홈 화면을 렌더링
- */}
-
-
-
-
+ {this.props.todo.todo}
+ removeTodo(id)}>x
+
+ )
+ }
+}
+
+export default connect(
+ state => ({}),
+ dispatch => ({
+ globalActions: bindActionCreators(globalActions, dispatch),
+ }),
+)(Todo)
\ No newline at end of file
diff --git a/4week/class/src/container/MainView.js b/4week/class/src/container/MainView.js
deleted file mode 100644
index ad627ae60..000000000
--- a/4week/class/src/container/MainView.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import React, { Component } from 'react';
-import './MainView.css';
-import ConetntList from "../component/contentList/ContentList.js";
-import FullContent from '../component/fullcontent/FullContent.js';
-import axios from 'axios';
-
-class MainView extends Component {
- constructor(props) {
- super(props);
- this.state = {
- fullContent: {},// 메인화면에 가장 큰 영상 플레이어 콘텐츠를 가지는 state
- contents : [] // 하단의 리스트에 들어갈 콘텐츠를 가지는 state
- };
- }
-
-// 서버로 부터 받은 데이터를 내가 원하는 형태로 변경 하는 함수
-// {id: , name: } 형식으로 모든 데이터들을 변환
- setContents = (data) => {
- let list = []
- data.items.forEach((item, index) => {
- list.push({id:item.id,name:item.snippet.title})
- })
- return list
- }
-
-//컴포넌트 렌더링이 완료된 후 유튜브에서 데이터 불러옴
- componentDidMount() {
- this.fetchYoutube()
- }
-
-//메인화면에서 영상을 실행하는 플레이어를 제어하는 함수
-//이 함수를 이용해서 영상을 변경 한다.
- handleFullContentChange = (content) => {
- this.setState({
- fullContent:content
- })
- }
-
-//유튜브에 ajax 통신을 해서 데이터를 불러 오는 함수
- fetchYoutube = () => {
- //axios를 이용해서 유튜브에 영상 목록을 달라고 요청
- axios.get('https://www.googleapis.com/youtube/v3/videos?part=snippet&chart=mostPopular&key=AIzaSyC-v1sIG2Wn3YnoD_7_bBS4zPDceDLKmLY&maxResults=21')
- .then(({data}) => {//유튜브로 부터 요청한 데이터를 전달 받으면 then으로 데이터를 받음
- //디스트럭쳐링을 통해서 유튜브로부터 받은 데이터중에서 data만 가져옴
-
- const list = this.setContents(data)//받아온 데이터를 내가 원하는 형태로 가공
-
- this.setState({// 가공한 데이터로 지금 바로 실행할 데이터와, 목록에 보여줄 데이터를 state에 저장
- contents:list.slice(1,list.length),//slice 함수는 배열형 데이터를 첫번째인자부터 두번째인자 전까지를 반환해주는 함수 입니다.
- fullContent:list[0]//가져온 데이터중 첫번째 데이터를 화면에서 실행 시킵니다.
- })
- })
- }
-
- render() {
- return (
-
- {/*
- 영상을 실행 시키는 컴포넌트
- */}
-
- {/*
- 실행할 영상 리스트를 출력하는 컴포넌트
- */}
-
- );
- }
-}
-
-export default MainView;
diff --git a/4week/class/src/container/Search.js b/4week/class/src/container/Search.js
deleted file mode 100644
index 967df467e..000000000
--- a/4week/class/src/container/Search.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import React, { Component} from "react"
-import ContentList from "../component/contentList/ContentList.js";
-import axios from "axios";
-
-class Search extends Component {
- constructor(props) {
- super(props);
-
- this.state = {
- contents : [],
- keyword: ""
- };
- }
-
- handleInputChange = (e) => {
- this.setState({keyword:e.target.value})
- }
-
- setContents = (data) => {
- let list = []
- data.items.forEach((item, index) => {
- if(item.id.videoId) {
- list.push({id:item.id.videoId,name:item.snippet.title})
- }
- })
- return list
- }
-
- handleSubmit = (e) => {
- this.fetchSearch(this.state.keyword)
- e.preventDefault();
- }
-
- fetchSearch = (keyword) => {
- let maxResults = 30
- let token = 'AIzaSyC-v1sIG2Wn3YnoD_7_bBS4zPDceDLKmLY'//본인의 토큰을 발급 받아서 입력
- axios.get('https://www.googleapis.com/youtube/v3/search?q='+keyword+'&part=snippet&key='+token+'&maxResults='+maxResults)
- .then(({data}) => {
- const list = this.setContents(data)
- this.setState({contents:list})
- })
- }
-
- render() {
- return (
-
- );
- }
- }
-
- export default Search;
\ No newline at end of file
diff --git a/4week/class/src/containers/AddTodo.js b/4week/class/src/containers/AddTodo.js
new file mode 100755
index 000000000..50cf26bc6
--- /dev/null
+++ b/4week/class/src/containers/AddTodo.js
@@ -0,0 +1,46 @@
+import React, { Component } from "react";
+
+
+export default class AddTodo extends Component {
+ state = {
+ todo: ""
+ };
+ handleChange = e => {
+ this.setState({ todo: e.target.value });
+ };
+ handleSubmit = e => {
+ e.preventDefault();
+ const text = this.state.todo;
+ const todos =this.props.todos;
+
+ console.log(todos);
+ this.props.addTodo(text,todos);
+
+ this.setState({ todo: "" });
+
+
+
+ };
+
+ handleDelete = e => {
+ console.log('ss');
+ }
+
+ render() {
+ return (
+
+ );
+ }
+}
\ No newline at end of file
diff --git a/4week/class/src/containers/TodoList.js b/4week/class/src/containers/TodoList.js
new file mode 100755
index 000000000..21b8589f7
--- /dev/null
+++ b/4week/class/src/containers/TodoList.js
@@ -0,0 +1,15 @@
+import React from "react";
+import Todo from "../components/Todo";
+
+export default function TodoList({ todos }) {
+ return (
+
+
+ {todos.map((todo, index) => (
+ // index를 key값으로 주어서는 안됨
+
+
-
- ),document.getElementById('root'));
-
-// If you want your app to work offline and load faster, you can change
-// unregister() to register() below. Note this comes with some pitfalls.
-// Learn more about service workers: http://bit.ly/CRA-PWA
-serviceWorker.unregister();
+import React from 'react';
+import ReactDOM from 'react-dom';
+import './index.css';
+import App from './App';
+import * as serviceWorker from './serviceWorker';
+import {Provider} from "react-redux";
+import store from "./modules/store";
+
+ReactDOM.render(
+
+ ,
+ document.getElementById('root')
+ );
+
+// If you want your app to work offline and load faster, you can change
+// unregister() to register() below. Note this comes with some pitfalls.
+// Learn more about service workers: https://bit.ly/CRA-PWA
+serviceWorker.unregister();
diff --git a/4week/class/src/logo.svg b/4week/class/src/logo.svg
old mode 100644
new mode 100755
index 6b60c1042..2e5df0d3a
--- a/4week/class/src/logo.svg
+++ b/4week/class/src/logo.svg
@@ -1,7 +1 @@
-
-
-
-
+React App
+
+
+ You need to enable JavaScript to run this app.
+
+
+
+
diff --git a/memo/public/logo192.png b/memo/public/logo192.png
new file mode 100644
index 000000000..fa313abf5
Binary files /dev/null and b/memo/public/logo192.png differ
diff --git a/memo/public/logo512.png b/memo/public/logo512.png
new file mode 100644
index 000000000..bd5d4b5e2
Binary files /dev/null and b/memo/public/logo512.png differ
diff --git a/memo/public/manifest.json b/memo/public/manifest.json
new file mode 100644
index 000000000..080d6c77a
--- /dev/null
+++ b/memo/public/manifest.json
@@ -0,0 +1,25 @@
+{
+ "short_name": "React App",
+ "name": "Create React App Sample",
+ "icons": [
+ {
+ "src": "favicon.ico",
+ "sizes": "64x64 32x32 24x24 16x16",
+ "type": "image/x-icon"
+ },
+ {
+ "src": "logo192.png",
+ "type": "image/png",
+ "sizes": "192x192"
+ },
+ {
+ "src": "logo512.png",
+ "type": "image/png",
+ "sizes": "512x512"
+ }
+ ],
+ "start_url": ".",
+ "display": "standalone",
+ "theme_color": "#000000",
+ "background_color": "#ffffff"
+}
diff --git a/memo/public/robots.txt b/memo/public/robots.txt
new file mode 100644
index 000000000..01b0f9a10
--- /dev/null
+++ b/memo/public/robots.txt
@@ -0,0 +1,2 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
diff --git a/memo/src/App.css b/memo/src/App.css
new file mode 100644
index 000000000..afc388571
--- /dev/null
+++ b/memo/src/App.css
@@ -0,0 +1,22 @@
+.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;
+}
diff --git a/memo/src/App.js b/memo/src/App.js
new file mode 100644
index 000000000..935c7228c
--- /dev/null
+++ b/memo/src/App.js
@@ -0,0 +1,32 @@
+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 (
+
+ );
+ }
+}
+const mapDispatchToProps = dispatch => {
+ return {
+ addTodo: (todo,todos) => {
+ dispatch(addTodo(todo,todos));
+ }
+ };
+};
+
+const mapStateToProps = state => {
+ return { todos: state.todos };
+};
+export default connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(App);
\ No newline at end of file
diff --git a/memo/src/App.test.js b/memo/src/App.test.js
new file mode 100644
index 000000000..a754b201b
--- /dev/null
+++ b/memo/src/App.test.js
@@ -0,0 +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(
+ {this.props.todo.todo}
+ removeTodo(id)}>x
+
+ )
+ }
+}
+
+export default connect(
+ state => ({}),
+ dispatch => ({
+ globalActions: bindActionCreators(globalActions, dispatch),
+ }),
+)(Todo)
\ No newline at end of file
diff --git a/memo/src/containers/AddTodo.js b/memo/src/containers/AddTodo.js
new file mode 100644
index 000000000..672d33499
--- /dev/null
+++ b/memo/src/containers/AddTodo.js
@@ -0,0 +1,40 @@
+import React, { Component } from "react";
+
+
+export default class AddTodo extends Component {
+ state = {
+ todo: ""
+ };
+ handleChange = e => {
+ this.setState({ todo: e.target.value });
+ };
+ handleSubmit = e => {
+ e.preventDefault();
+ const text = this.state.todo;
+ const todos =this.props.todos;
+
+ console.log(todos);
+ this.props.addTodo(text,todos);
+
+ this.setState({ todo: "" });
+
+
+
+ };
+
+
+ render() {
+ return (
+
+
+
+ );
+ }
+}
\ No newline at end of file
diff --git a/memo/src/containers/TodoList.js b/memo/src/containers/TodoList.js
new file mode 100644
index 000000000..e0557e6e9
--- /dev/null
+++ b/memo/src/containers/TodoList.js
@@ -0,0 +1,14 @@
+import React from "react";
+import Todo from "../components/Todo";
+
+export default function TodoList({ todos }) {
+ return (
+
+
+ {todos.map((todo, id) => (
+
+
+ ,
+document.getElementById('root')
+);
+
+// If you want your app to work offline and load faster, you can change
+// unregister() to register() below. Note this comes with some pitfalls.
+// Learn more about service workers: https://bit.ly/CRA-PWA
+serviceWorker.unregister();
\ No newline at end of file
diff --git a/memo/src/logo.svg b/memo/src/logo.svg
new file mode 100644
index 000000000..2e5df0d3a
--- /dev/null
+++ b/memo/src/logo.svg
@@ -0,0 +1 @@
+React App
+
+
+ You need to enable JavaScript to run this app.
+
+
+
+
diff --git a/redux_hakgu/public/logo192.png b/redux_hakgu/public/logo192.png
new file mode 100644
index 000000000..fa313abf5
Binary files /dev/null and b/redux_hakgu/public/logo192.png differ
diff --git a/redux_hakgu/public/logo512.png b/redux_hakgu/public/logo512.png
new file mode 100644
index 000000000..bd5d4b5e2
Binary files /dev/null and b/redux_hakgu/public/logo512.png differ
diff --git a/redux_hakgu/public/manifest.json b/redux_hakgu/public/manifest.json
new file mode 100644
index 000000000..080d6c77a
--- /dev/null
+++ b/redux_hakgu/public/manifest.json
@@ -0,0 +1,25 @@
+{
+ "short_name": "React App",
+ "name": "Create React App Sample",
+ "icons": [
+ {
+ "src": "favicon.ico",
+ "sizes": "64x64 32x32 24x24 16x16",
+ "type": "image/x-icon"
+ },
+ {
+ "src": "logo192.png",
+ "type": "image/png",
+ "sizes": "192x192"
+ },
+ {
+ "src": "logo512.png",
+ "type": "image/png",
+ "sizes": "512x512"
+ }
+ ],
+ "start_url": ".",
+ "display": "standalone",
+ "theme_color": "#000000",
+ "background_color": "#ffffff"
+}
diff --git a/redux_hakgu/public/robots.txt b/redux_hakgu/public/robots.txt
new file mode 100644
index 000000000..01b0f9a10
--- /dev/null
+++ b/redux_hakgu/public/robots.txt
@@ -0,0 +1,2 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
diff --git a/redux_hakgu/src/App.css b/redux_hakgu/src/App.css
new file mode 100644
index 000000000..afc388571
--- /dev/null
+++ b/redux_hakgu/src/App.css
@@ -0,0 +1,22 @@
+.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;
+}
diff --git a/redux_hakgu/src/App.js b/redux_hakgu/src/App.js
new file mode 100644
index 000000000..ce9cbd294
--- /dev/null
+++ b/redux_hakgu/src/App.js
@@ -0,0 +1,26 @@
+import React from 'react';
+import logo from './logo.svg';
+import './App.css';
+
+function App() {
+ return (
+
+ );
+}
+
+export default App;
diff --git a/redux_hakgu/src/App.test.js b/redux_hakgu/src/App.test.js
new file mode 100644
index 000000000..a754b201b
--- /dev/null
+++ b/redux_hakgu/src/App.test.js
@@ -0,0 +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(
+
+, document.getElementById('root'));
+
+// If you want your app to work offline and load faster, you can change
+// unregister() to register() below. Note this comes with some pitfalls.
+// Learn more about service workers: https://bit.ly/CRA-PWA
+serviceWorker.unregister();
diff --git a/redux_hakgu/src/logo.svg b/redux_hakgu/src/logo.svg
new file mode 100644
index 000000000..2e5df0d3a
--- /dev/null
+++ b/redux_hakgu/src/logo.svg
@@ -0,0 +1 @@
+