어느덧 9주차가 끝났다.
지금까지 수업을 진행하면서, 가장 중요한 건 아마 자바스크립트, 리액트, 리덕스 가 아닐까 생각이 든다.
특히나 가장 기본이 되면서도, '잘' 알고 있어야 하는 3가지인 것 같다.
그래서 위 3가지는 매일매일 조금씩 시간을 내서라도 복습 및 공부를 해보려고 한다.
특히 리덕스의 경우, 저번주에 많이 코드를 쳐보기도하고, 공부도 했지만 시간이 지날수록 머릿속에서 희미해져가는 기분이 들었다.
그래서 지금 WIL을 쓰면서라도 한 번 더 머릿속에 남기기위해서 기록을 해보려고 한다.
리덕스, 이해가 안된다면 A = B, C = D 처럼 대입을 해보자
가령 TodoList의 경우, Input의 추가버튼을 통해서, 내가 원하는 Todo를 넣는다고 생각을 해보자
-
const todos = useSelector((state) => state.todos) 를 통해서, 리덕스를 끌어다 쓸 준비를 하자.
-
다음 연결통로, 연결 수단으로 dispatch를 사용해볼 예정인데
const dispatch = useDispatch() 를 입력을 해두자 -
여기서부터가 중요하다.
리덕스 사용 전코드
setTodos((prev) => [...prev, newTodo])
리덕스 코드
dispatch({
type:"ADD_TODO",
payload:newTodo,
})
위 2개의 코드는 같은 의미를 지닌다.
- 다음 리덕스 코드인 todos.js로 넘어가서 Reducer를 작성해보자
const todos = (state = initialState, action) =>{
switch(action.type){
case 'ADD_TODO':
return [...state, action.payload]
}
}이렇게 4번까지 작성하면, todo를 추가하는 기능을, 리덕스를 통해서 할 수 있게 된다.
무엇보다 반복이 중요한 것 같다. 처음에는 정말 이해가 안됬지만, 훌륭하신 튜터님의 설명으로 점차 내 것으로 만들어가는 중이다.
