리액트 공식문서 스터디
리액트 공식 문서를 교재로 삼아 시작한 스터디. 리액트 공식문서 한글번역을 병행하면서 문장다듬고, (사실 번역기가 다함) 정리하면서 공부하는 방식으로 진행했다.
현생이 바빠서 아슬아슬하게 광탈당할 뻔 했는데, 스터디원분들 합의하에 한주 미뤄져서 (6주차에 끝날 예정이였던것을 7주차로) 다행히 완주 할 수 있었다. 또 감사합니다.
기존의 리액트 공식문서로 하려다가, 회사동료가 리액트 Beta 문서를 추천해줘서, 문서의 퀄리티를 보고 이걸로 해야겠다고 결정했다. 스터디 도중에 Beta가 공식문서로 전환되었고, 유의미한 결과를 얻을 수 있었다. 이전 공식문서에서는 클래스형 컴포넌트가 포함돼있었는데 우리가 학습한것에는 없었기 때문. 시간도 절약되고 좋았다. 처음에는 시중에 있는 리액트 도서를 사서 할 생각이였는데, 바이블인 공식문서로 시작하게되어 오히려 좋았다.
지난 스터디와 다른 점
- JS 기초지식이 있는 사람 (필수)
- React 기초지식이 있는사람 (필수는 아님)
- 발표는 한 챕터마다 매번 사다리타기로 결정 (부담없이 모두가 발표할 수 있는 방식으로)
- 2회 불참시 사유불문 축출
- 챕터별로 3~5문제의 과제, 과제리뷰가 필수.
이번 스터디로 새로 알게된 점
기억에 남는것을 적어보자면.. 역시 공식문서에서 강조하고 강조했던 함수의 순수성 인것 같다. 리액트는 함수의 순수성을 매우 중요하게 생각한다. 스트릭모드에서 2번 선행 실행하는 이유도, 함수의 순수성을 확인하기 위함이다. 함수가 왜 순수해야하냐면.. 언제나 같은 결과값을 받는다는것을 보장할 수 있기 때문이다. 따라서 렌더링 도중 재 랜더링이 트리거 되어도 언제나 같은값을 보장해주기 때문에 리액트는 안심하고 같은화면을 몇번이고 재렌더링 할 수 있다.
의존성을 최소화 해야한다는 것. useEffect와 Event handler 둘 중 어떤것을 사용해야하는지에 대한 명확한 기준을 얻을 수 있었다. (수동적 상호작용에는 이벤트핸들러를, 자동적 동기화에는 useEffect를 채택) 또한, 객체와 함수를 props로 넘길때 useEffect의 의존성배열에 그대로 사용하면 안된다는것. 첫번재 렌더링 시 생성된 객체는 두번째 렌더링 시 생성된 객체와 동일해도 다르다는 점. (생성시점이 다르기 때문에 주소값이 다르다) 따라서 Object.is로 두개의 객체를 비교했을때 무조건 false가 뜬다. 같은 객체여도, 재렌더링이 되면 리액트는 두 값이 다르다고 판단한다.
useEffect에서 '반응'해야만 하는것과 반응해서는 안되는 값을 분리해야한다. 이것을 잘 하기 위한 Effect Event라는 것이 새로운 스펙으로 곧 나올 예정인데.. (현재 React 18버전에서만 사용가능) 값의 변화를 참조하지만 useEffect 를 실행시키고 싶지 않을 때 사용한다. 또한 리액트는 data fetching에 관한 use라는 api도 준비중인데, 이건 자세하게 설명되어있지는 않았다. 대신 리액트가 어떤 부분을 준비하고있는지 미리 알 수 있어서 좋았다.
의존성배열에 무언가를 빠트렸거나, 무언가를 잘못 넣었을때 린트가 경고하는것을 무시하지말자. 문제가있다면 그것은 내 코드가 문제인 것. 린트가 잡아주는 코드는 얼마든지 수정할수있다. 노란줄 떴다고 린트억제문구를 절대 넣지 말자.
후기
스터디를 시작할때 항상 고민하는 것들이 있다.
- 이 스터디를 완주할 수 있을까?
- 스터디를 통해 내가 얻는것은 얼마나 될까?
- 발표준비나 과제준비 오프미팅 등등을 감안했을때, 내 개인 시간이 과도하게 소비되지는 않을까?
고민이 다 해결되면 스터디를 시작하고, 한 3주간 열심히 달리다가 4~5주째 쯤부터 흐지부지 해지고 고비는 항상 2달쯤 진행했을 때 오는데.. 이때 휴식기를 갖거나 좀 돌아보는 시간을 가지면 할만한것같다. 재충전시간이 중간에 반드시 필요하다. 모든 스터디원들이 주말에 정해진 시간에 참여할 수 있을것이라고 장담할수없기 때문.
어쨌든 리액트 스터디는 실무에서 쓰기도 하고 나한테 딱 필요한 스터디였어서 완주할수있을 것이라 확신했고 (결과적으로는 아슬아슬했지만) 내가 얻을 수 있는것은, 더 정확히 기본 개념을 배울 수 있겠구나 였다. 시간도 아깝지 않을것이라 생각했다. 결과적으로 엄청 유익한 스터디였다. 챕터별로 하단에 내 기준으로 요약도 적어놔서, 헷갈리는 부분이 있을때 다시한번 들여다보기 참 좋을것이다.
총 시작은 9명이였고 최종 winner는 5명.
7주차 완주를 함께 한 하다, Cold, 큰열정, 해파리 님 모두 고생하셨습니다.
다음 스터디는 한주 휴식기간을 가지고 Next.js 를 진행하기로 했다.
또다시 배워봅시다.