zuzokim / re-collect-client

📝 똑똑한 북마크 관리 툴 리콜렉트 📝

*☙❧❇︎ How to reach me ❇︎❧☙*

⇣⇣⇣

LinkTree

---

re-collect-client's Issues

[Retrospect] 3주차 회고(1) - 김지우

Fact (사실) : 진행한 리팩토링에 대해 객관적으로 서술

• 기존 gulp 사용 scss 컴파일 방식을 crs sass 로 전환
  App.css => App.scss로 변경 후 파일 import, index.css 삭제 후 App.scss 에 루트 설정 통합
• 불필요한 dependency 삭제
  (gulp관련 & browser-sync, autoprefixer, scss, intersection-observer ..)
• 파일명 camelCase 로 수정
  디렉토리 정리
• index.html 메타정보 수정 (manifest.json)
• 프로필 페이지 유저 피드백 개선, 에러 분기 세분화
• 에러 공통 컨트롤 함수 제작중 (팀원과 논의중)

Feeling(느낌) : 그때 느꼈던 기분 간략히 정리

• cra 가 기본적으로 자동 제공해주는 scss 컴파일 방식으로 전환을 했음.
• 컴파일과 오토메이션, 번들링 등등의 개념이 없었던 터라 어렵게 느껴졌었는데, 이번 기회로 더 공부를 할 수 있었음.
• 필요하지 않은 코드, 의존성을 다 삭제하고 깔끔히 정리했음.

Finding(알게 된 것) : 리팩토링하며 알게 된 것을 정리

• 새로운 기능을 추가하는 것보다 기존에 만든 것들을 보완하고 보다 나은 사용자 경험을 위해 개선하는 일이 더 중요하다고 생각함. 그리고 더 어렵기도 한 것 같음.
• 알아보기 쉽게 코드를 작성하는 것이 어렵고 생각보다 코드컨벤션을 잘 지켜가며 개발하는 것이 어렵다는 것을 알게됨. 디렉토리 관리의 중요성도 느낌.

Future Action(앞으로 할 것) : 앞으로 할 것에 대한 계획이나 다짐 작성

• 바닐라 js 로 라이브러리 의존성을 덜어내는 작업을 하기로 했는데, 코드 정리에 집중하다보니 잘 진행을 못한 것 같다. 부지런히 도전해볼 것

[Retrospect] 1주차 리팩토링 회고(2) - 김지우

Fact (사실) : 진행한 리팩토링에 대해 객관적으로 서술

• 리덕스 코드를 actions, reducers 로 분리.
• 회원가입에서 기존에 없던 에러를 발견했는데, useEffect 를 잘못사용하고 있었던 탓에 생긴 문제였다. (useEffect 의존성 배열에 의해 무한루프에 빠짐)
• 코드 다른 부분에도 비슷한 문제가 있다고 생각해서, 일단 코드 수정을 멈추고, useEffect에 대해서 확실히 공부를 하고 적용하기로 했다.

Feeling(느낌) : 그때 느꼈던 기분 간략히 정리

• 제대로 알지 못하고 무작정 쓰는 훅, 문법은 위험하다.
• 리팩토링하면서 더 많은 에러를 만나게 된다고 들었는데, 확실히 기존의 작성된 코드 여러 부분을 비교하며 고쳐나가는 일이라 신중할 필요가 있다고 느꼈다.

Finding(알게 된 것) : 리팩토링하며 알게 된 것을 정리

• useEffect 공부중. 추후 블로깅이나 회고로 공부한 내용을 남길 예정.

Future Action(앞으로 할 것) : 앞으로 할 것에 대한 계획이나 다짐 작성

• 시간에 쫓겨 급하게 코드를 수정하지 말것.
• 늦더라도 정확하게 공부하고 리팩토링에 적용할 것.

[Retrospect] 1주차 리팩토링 회고 - 김지우

Fact (사실) : 진행한 리팩토링에 대해 객관적으로 서술

• package.json 의 devdependency, dependency 구분이 엉켜있어서 정리하고, 쓰지 않는 의존성 패키지와 모듈을 제거했다.
• 기존에 덕스패턴으로 작성했던 리덕스를 actions, reducers 구조로 분리해 개편하기로 팀원들과 소통하고 디렉토리와 코드를 다시 고치려고 시도중이다.
• 이미지 파일 (png, gif), 파일명, 변수명 등을 camelCase 적용해 수정했다. 추후에 더 발견한 것들도 규칙에 맞게 수정 예정.

Feeling(느낌) : 그때 느꼈던 기분 간략히 정리

• package.json 정리를 하면서 여러가지 개발환경 세팅에 대해서 모르고 사용하고 있었다고 느꼈다.
• 그동안에 프로젝트 완성에 목표를 뒀던 터라 다시 코드의 전체 구조를 파악하는데까지 시간이 많이 필요했는데, 처음부터 코드 컨벤션을 잘 지켜 작성하면 자잘한 부분들을 다시 고칠 필요 없이 로직 구현에 더 집중할 수 있겠다는 생각이 들었다.
• 리덕스 작성 패턴을 대대적으로 뜯어고치기로 했는데, 리덕스와 리덕스성크, 상태관리에 대해서 꼼꼼히 더 공부하고 개선해야할 것 같다.

Finding(알게 된 것) : 리팩토링하며 알게 된 것을 정리

• 기본적으로 create-react-app으로 시작하면 eslint가 설치된다는 것을 알았다. 이미 사용중이었는데도 크게 신경쓰지 못했다. 이후에 프로젝트나 팀의 성격에 맞게 커스텀 규칙을 적용할 수 있는데, 지금은 굳이 필요성을 느끼지 못해 기본 설치된 버전으로 사용하기로 했다. 이후에 여러 linter 플러그인에 대해서도 알아봐야겠다.
• gulp 와 node-sass , webpack, react-script eject 에 대해 조금 찾아봤다. scss를 사용하는 방법과 장점, 컴파일러 세팅에 대해서 더 공부하고 싶다.

Future Action(앞으로 할 것) : 앞으로 할 것에 대한 계획이나 다짐 작성

• 리덕스 효율적으로 사용하는 방법 공부 후 리덕스 패턴 개편, 적용.
• 길어진 코드를 모듈화 하는데에 집중. (landing, profile 컴포넌트)
• css 에서 반복적으로 생기는 에러 원인 찾아 해결하기.

[Retrospect] 3주차 회고(2) - 김지우

Fact (사실) : 진행한 리팩토링에 대해 객관적으로 서술

• app.js에 모여져 있는 모달 분기의 덩어리가 너무 커서 이것을 분리하려고 시도중에 있음.
• 주말에 꼭 캐러셀을 라이브러리 없이 재구현할 것임.

Feeling(느낌) : 그때 느꼈던 기분 간략히 정리

• 아직 방법이 떠오르지 않고, 리액트 useEffect 에 대해서 공부하느라 실제 코드를 고치지 못했다.

Finding(알게 된 것) : 리팩토링하며 알게 된 것을 정리

• 추후 리팩토링 하면서 블로깅과 회고 남길 예정

Future Action(앞으로 할 것) : 앞으로 할 것에 대한 계획이나 다짐 작성

• 부지런히 행동으로 옮겨야할 것 같다..

[Retrospect] 2주차 회고(1) - 김지우

Fact (사실) : 진행한 리팩토링에 대해 객관적으로 서술

• 개발자분에게 디렉토리 관리, 코드 컨벤션에 대한 피드백을 요청하고 문제점을 파악
• eslint 설정의 필요성을 느낌->설정중 스트링 싱글쿼트/더블쿼트가 왔다갔다하는 것을 발견
• 컨플릭을 해결하다가 package.json , package.lock.json 의 차이와 역할, 중요성에 대해서 공부

Feeling(느낌) : 그때 느꼈던 기분 간략히 정리

• 코드를 칠줄만 알고, 코드를 어떻게 관리하는지에 대한 지식이 부족했다고 느낌
• 정확한 지식을 찾아서 공부하고 프로젝트에 적용해야겠다고 느낌

Finding(알게 된 것) : 리팩토링하며 알게 된 것을 정리

• package.lock.json 을 지우면 절대 안된다는 것. 각 개발 환경마다 다른 패키지, 모듈 버전이 설치 되기 때문에, 그 히스토리를 관리하는 차원에서도 중요하다는 것을 알게됨.

Future Action(앞으로 할 것) : 앞으로 할 것에 대한 계획이나 다짐 작성

• eslint 설정,
• 프로필 메소드 모듈화
• 캐러셀 바닐라 js로 리팩토링
• 속도를 더 내자 !!! 체력을 길러서 집중력을 키우자, 시간을 낭비하고 있다..