항해99 4주차 회고

지난 일주일간 나는 무엇을 했는가

• 프로젝트 진행(나만의 메게진 만들기)
• 기본기 다지기(리덕스와 라우트 부분을 다시 공부)
• 로그인 구현을 위한 인강수강
• 발표아닌 발표하기...ㅎ
• 프로젝트 회고와 코드리뷰(인생첫 여러명이서 하는 코드리뷰시간을 가졌다.)

진성님, 다원님과 코드리뷰하며 알게된 사실들 추가

리덕스 잘하는 꿀팁

• 부모에서 바로 자식컴포넌트로 넘겨줄 수 있는 스테이트가 아니면 리덕스로 따로 빼주자!
• 만일 부모에서 자식으로 바로 넘겨줄 수 있는 스테이트를 리덕스로 빼게되면 그것 또한 코드낭비이니 잘 생각해보고 리덕스로 빼기!
• 스토어에 있는 스테이트는 단 하나다. 따라서 프로젝트당 하나만 스토어를 팔 수 있는데, 협업시에는 리듀서를 여러개 나눌 수 있지만, 스토어는 하나로 공유하며 사용한다.
• 150줄이 넘어가면 리듀서를 나눠주는게 좋다!
• 중간단위 컴포넌트 별로 리듀서를 나누는게 의미가 있다.
• 모든 코드는 내가 다시봐도 편하게 볼 수 있도록 짜야한다.(주석을 달며 뭐가 무슨일을 하는지 알려주면 유지보수가 간편할 것 같다.)

defaultProps와 useState의 초기값 설정의 차이

• defaultProps를 useState로 주고 초기값을 설정하게 되면 날기도 전에 연료를 많이 태우는 낭비같은 느낌
• useState는 초기값 디폴트를 위한 함수가 아닌 변경되는 스테이트 값을 위한 함수이다. 따라서 디폴트 대신 사용하기엔 헤비하다.
  (즉 상태변경을 위한 리액트훅 라고 생각하면 된다.)
• 디폴트 스테이트는 스티커 같은 느낌이다. 스테이트의 변화라기보단, 들어가면 스티커처럼 띄었다 붙였다하는 상태들. 얘는 오로지 초기값 설정해 오류를 방지하는 느낌이다.

클린코드 작성꿀팁

• 내가 확인하려고 했던 콘솔 지우기.
• 안쓰는 변수 다 지우기.
• 미들웨어 줄 맞추기.
• 한줄로 처리할 수 있는건 한줄로 처리하는게 가독성이 좋다.(if문같은것)
• 함수를 목적 단위로 나눠서 코드를 짜기
  (함수는 하나의 일을 수행한다의 쉬운말 버전이다. 하나의 일 은 결국 단 하나의 목적이다.)

리액트에서 함수형 컴포넌트를 사용하는 이유는 무엇인가?

• 로직의 재사용이 어렵고, 코드의 부피가 크다.
• 클래스형 컴포넌트에서만 사용할 수 있는 라이프사이클 메서드는 어떻게 대처했는가?
  • 리액트 훅을 도입해 사용한다.
    (ex. useState = 생성자 함수(constructor)를 대체하는 훅)
• 그럼 클래스형은 단점뿐일까?
  • 노노, 클래스형 컴포넌트는 함수형 컴포넌트보다 라이프 사이클(페이지의 생에주기_생성, 수정, 삭제 자세한건 포스팅 참고)이 잘보인다. 따라서 리액트를 처음 사용하는 사람이라면 클래스형 컴포넌트가 다루기 더 수월하다. 또한 라이프 사이클 메서드는 클래스형 메서드라서 함수형 컴포넌트에선 사용이 불가능하다.(이를 리액트 훅으로 대처하긴 했다.)

리액트 스타일(styled-component) 주기 또는 여러가지 꿀팁

• 에어비엔비 코딩 컨벤션 : 협업시 충돌을 방지해준다. 코드 환경을 맞춰준다.(ESLint: 자바스크립트 오류 잡아주기 + prettier: 코드 구역 맞춤)
• 리액트 아이콘(커스텀 아이콘 받아쓰기) 쓰기 : React-icons 패키지 ,
  • import {아이콘명} from "react-icons"
  • 내가 쓰고싶은 아이콘만 하나씩 꺼내쓰는것
• 리액트에서 폰트 바꾸기 : index.html에 CDN데리고 오고, app.css에 임포트 해주기
• 만들기 하드할 것 같은데? 싶은건 라이브러리가 있는지 검색해보기(실제 매운맛 과제에는 캘린더 라이브러리가 따로 있었다고 한다. 신기방기..)
• x마인드에서 트리구조로 공부해보기
  • 트리구조로 정리하면서 막히는 용어나 개념이 있다면 그부분만 다시 공부하면 된다.

이번주 내가 잘한 점

• 과제가 미완임에도 불구하고 남들앞에서서 나의 성장을 알리고, 발표틀을 깨며 많은 사람들의 의견을 들을 수 있었다. 결과적으로 진성님과 다원님과의 코드리뷰도 발표로 인해 기회를 얻었고, 운이 좋게도 두분 다 코딩을 너무 잘하셔서 배울게 너무 많았다.
• 일단 강의를 다 듣지 못했어도 프로젝트를 시작해서 내가 필요한 부분을 찾아듣는 방식으로 했더니 부담감도 덜하고 효율적이었다.(심지어 완성도도 올라갔다.)
• 내가 뭐가 부족한가를 파악하려고 노력했다.

앞으로 내가 보완해야 할 점

• 4주차 3일정도부터 정신을 차리긴 했지만 더이상 나태에 빠지는 나는 용서할수도 용서받을 수 없다.
• 내가 긁어왔던 코드중 리덕스를 사용했던 부분 구조를 조금더 철저히 분석 후 리덕스만 따로 포스팅해야겠다.
• 기본주차든 심화주차든 못들은 강의중 꼭들어야 하는 개념들 추려서 먼저듣고 기능 구현강의로 넘어가면서 듣기
• 깃허브 공부하기

아무말 다이어리

나는 항해99에서 코딩을 그렇게 잘하는편이 아니다. 나도 알고있기때문에 이번 발표때 남들앞에서 서는게 많이 망설여졌다. 뭐가 되었든 나의 무지식을 알리는건 창피할수밖에 없는 일이었다. 하지만 지금은 나의 창피보단 남들의 더많은 의견을 수렴하고 내가 발전하는데 초점을 둘 수 밖에 없었고, 결과적으로 발표로 나의 미완성작을 보여주며 다른사람들은 프로젝트 진행시에 어떻게 했을까 같은 것들을 서로 소통하며 여러가지를 얻었다. 근데 참 신기한게 나의 용기로 인해 항해를 버텨갈 힘을 얻었다는 분이 계셨다. 게더에 소리가 들리길래 내가 있는줄 모르셨나 보다했는데, 나와 소통을 원하셨고 너무 위안이 된다는 말을 들었다. 생각보다 나의 발표가 도움이 된 사람들도 있구나 싶었다.뭐 아무튼 그렇게 나의 이번 일주일은 저번주차보다 발전해서 기쁘고, 나의 마음과 같은 사람들을 만나 설레는 한주였다.