우아한테크코스 레벨2 과정을 시작하면서 하게 된 리액트 스터디가 내일이면 끝이 난다.💪 (레벨2 시작한지 얼마 되지도 않은 것 같은데 시간이 정말 빠르다. 레벨 2는 2주밖에 안남았... )
스터디를 하게 된 계기는
레벨 2에서 부터 미션을 리액트로 구현해야하는데, 리액트에 관해서 아는 것이 거의 없었기 때문에...😢
하루라도 빨리 리액트에 익숙해지기 위해서 마음에 맞는 사람들과 함께 시작하게 되었다.
진행방식은 매우 심플했다.
매주 월요일 아침에 정해진 주제에 대해서 조사해온 내용을 발표하는 형식이였다. 🙋♀️
주제를 정할때는 LMS상에 공개되어 있는 개념 키워드들을 나눠서 하게 되었는데, 제일 중요하게 생각 되는 건 생각해보기 키워드들이였다.
LMS에는 매 학습 키워드 마다 간단한 개념 설명과 생각해보기라는 질문들이 제공되었다.
생각하보기 질문들의 깊이가 꽤나 깊었고, 혼자서 생각해봤을때 '이...이게 맞는건가?'라는 의문이 드는 경우가 많았기 때문에 생각해보기의 질문에 대한 답변에 대한 의견을 나누는 시간이 길었다.
생각해보기의 질문에 답하기 위해서는, 해당 개념에 대한 이해가 필수적이였기 때문에 스터디를 준비할 때에는 답변을 하기 위해서 개념을 계속 가지치기 하면서 공부하게 되었다. 그래서 생각보다 시간도 오래걸리고 공부할때도 참고자료들이 거의 영어라 번역도 열심히 했어야 했다.
리액트 스터디에 준비해갔던 답변 중 하나를 소개할까한다.
예를 들어,
리덕스에서 3가지 원칙이 있는 이유는 무엇인가요?
라는 질문이 있었다.
이 질문에 답변하기 위해서는 꽤나 여러가지를 조사했어야 했다.
- 리덕스의 개념
- 리덕스의 3가지 원칙
- 3가지 원칙에서 파생되는 개념들
내가 적었던 답변을 적기 전에 리덕스의 3가지 원칙에 대해서 보고 가자면, 아래와 같다.
- Single Source of Truth
: 오직 단 한개의 store를 사용한다. - State is Read-only
: 상태는 직접 변경할 수 없고, 기존 상태를 건드리지 않고 새로운 상태를 업데이트 해야한다. - Changes are made with pure Functions
: Action 객체를 처리하는 함수인 reducer를 활용하여 순수 함수로 작성되어야 한다.
당장 해당 원칙들을 이해하기 위해서
store, state,read-only, 기존 상태를 건드리지 않고 업데이트 하는 방법, pure function,reducer, action 등 개념등을 파악해야한다.
그리곤 해당 원칙이 왜 redux에 필요하게 되었는지 생각해봐야 했다.
일단 내가 찾은 답변은 아래와 같다.
-
하나의 애플리케이션에서 store가 여러개 있다면 개발 도구를 활용하지 못한다.
-
상태가 읽기 전용인 이유는, 기존의 객체를 건들이지 않고 새로운 상태를 생성하여서, 업데이트를 할 경우 개발자 도구를 통해서 이전 상태로 돌리거나 앞으로 돌리는 등을 할 수 있다.
추가적으로 redux는 shallow equailty 검사를 진행하기 때문에 기존의 상태를 건들이지 말아야한다.
*redux에서 shallow equaility를 검사하는 이유는?
: shallow equaility checking은 단순히 같은 객체의 두가지의 다른 변수 참조들이 있는지 비교하는 것이고, deep equaility checking은 두 객체의 properties의 모든 value들을 확인해야한다. 각각의 property의 value를 비교할때마다 반복되는 순회 확인을 해야해서, 연산작업이 많이 들어가게 된다. 그래서, shallow equaility를 통한 겉핥기식 데이터 비교로 좋은 성능을 유지할 수 있게 한다.
- pure function이여야 하는 이유는 리덕스의 작동 원리에 있다.
- redux의 combineReducer는 reference가 바뀌는지 확인해야한다
- React-Redux의 connect 메서드는 component가 root state와 mapState Function으로 부터 반환되는 값들 사이에서 refernces의 차이들을 확인하게 한다. 이를 통해서 wrapped component가 실제로 바뀌어 re-render가 필요한지 확인한다.
- immutable data관리는 궁극적으로 데이터 관리를 더 안전하게 만든다
- timer-travel 디버깅은 리듀서가 사이드 이펙트 없이 순수 함수이기를 요구한다. 그래야, 두가지 다른 정확한 상태를 오고가면서 볼 수 있다.
후기
위와 같이 열심히 준비해 가는 답변도 있었지만,
시간이 도저히 나지 않아서 답변을 짤막하게 준비하거나 못한것들도 몇가지있었다. 그 질문거리들에 대해서 스스로 생각해볼 시간을 많이 가지지 못한 것 같아 아쉽다. 😢
그래도 열심히 스터디를 준비해오는 크루들 덕분에, 잘 모르겠던 질문에 대한 답변을 듣거나, 내가 준비했던 답변 보다 더 합당해보이는 걸 알 수 있거나, 더 좋은 레퍼런스를 발견할 수 있는등의 장점이 있었다.
그리고 내가 준비해온 자료들을 설명하는 과정에서도 나 스스로 생각이 정리가 되는 기회도 되었다.
그렇지만 사람은 망각의 동물이라고
벌써 한달째가 되다보니 뭘 공부했는지 초기에 공부했던 내용들을 살짝 잊어버리게 되는 경향이 있는 것같다. 😇
방학동안 리액트 스터디 때 공부했던 것들을 찬찬히 복습해보는 시간을 가지고 싶다 💪
😘