Skip to content

[2주차] 함초롬 미션 제출합니다. #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 12 commits into
base: chorom-ham
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
48 changes: 16 additions & 32 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,32 +1,16 @@
# react-todo
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

README.md도 작성해주세요 😂

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

앗 넵!


## 실행 방법

```
npm install
npm run start
```

- npm install : 필요한 모든 패키지를 설치합니다. 처음 1번만 실행하면 됩니다.
- npm run start : react 어플리케이션을 브라우저에서 실행합니다.

## 미션 설명

### 프로그램 실행 결과

[확인하기](https://react-todo.greatsumini.now.sh/)

### 프로그래밍 요구 사항

1. 제공되지 않은 component 파일은 생성하지 않는다.
2. 모든 스타일링은 styled-components를 이용해서한다.
3. 프로그램 실행결과와 스타일이 같지 않아도 된다. 언뜻 보기에 비슷한 정도로만 따라해보자!

### 미션 저장소 및 진행 요구 사항

- 미션은 이 저장소를 fork/clone해 시작한다.
- clone된 폴더의 README.md의 내용을 모두 지운다.
- 프로그램 실행 결과 페이지를 보고, 만들어야 할 기능들을 README.md에 정리해본다.
- 각 Component별로 props, state를 정리해 추가한다.
- 각 Component 작성을 완료할 때마다 git에 commit한다.
- [스터디 과제제출](https://github.com/CEOS-Developers/react-profile/blob/master/docs/how-to-submit/README.md) 문서를 참고해 미션을 제출한다.
<h2>Todo 컴포넌트</h2>
state로 todoList[] 배열 가지고 있음

<h2>TodoCard 컴포넌트</h2>
props: index, text, onClick // Todo에서 해당 정보를 가져온다

<h2>TodoInput 컴포넌트</h2>
기본태그 대신 스타일 태그를 사용하자.
폼의 onSubmit 속성으로 this.props.onSubmit(e.target.todo.value)을 사용해 상위 컴포넌트인 Todo컴포넌트의 onSubmit 함수를 호출한다.

<h2>추가로 알게된 것</h2>
<ul>
<li> 화살표 함수 </li>
<li> map 메서드 </li>
<li> 빈 배열 선언 </li>

Loading