[Practice Session] Regarding NewTodo and TodoList

[ByungHeeCha]

In addition to practice session I did last week, I wanted to add feature that if I submit NewTodo, TodoList adds contents of submitted NewTodo. I searched internet for an advice, but most of the blogs(?) used Redux and React. Is there a way I can add this feature only using React.

저번 실습에 한것을 복습하는 마음으로 NewTodo를 submit하면 TodoList에 NewTodo 내용이 업데이트 되는 기능을 추가하려 했습니다. 어떻게 해야할지 잘 몰라서 인터넷을 검색해 보았지만, 대부분의 답들은 Redux와 React 둘다 쓰고 있었습니다. 혹시 React 만으로 이 기능을 추가할 수 있는 방법이 있을까요? React만으로 구현하기엔 어려운 점이 많나요?

[kyunggeunlee]

Though I don't think it is utterly impossible, it would be very difficult to implement such a behavior only with React. As we mentioned in the last practice session, a React application is composed of a tree of components. If you can't use props for state communication between two different components, Redux is a de facto standard way to share states between different components We are going to handle Redux in tomorrow's practice session.

방법이 아주 없는 것은 아니겠지만, React만으로 구현하기에는 어려운 점이 많습니다. 실습 수업 때 말씀드린 것처럼 React 컴포넌트들은 하나의 트리 구조를 가지기 때문에, 서로 부모-자식 간에 props를 사용하는 것이 아니라면 컴포넌트 간의 state 공유는 Redux를 쓰는 것이 사실상 표준입니다. Redux 내용은 내일 수업 때 다룰 예정입니다.

[ktaebum]

Supplement: there are 2 ways to implement that. First, you can implement submitHandler in TodoList component and pass it to NewTodo by property. Next, you can use React.Context API, which can be regarded as global (state) variable. https://reactjs.org/docs/context.html#contextconsumer