[메가테라 FE 생존코스] 9주차 회고

3L 회고

👍 Liked

• 쇼핑몰 프로젝트 강의를 들으면서 아샬님의 코딩 스타일을 배울 수 있어서 좋았다.
  • Page -> Component -> Store -> Hook -> Api 이 순서대로 요구사항을 구현하니 패턴에 익숙해지고 나니 컴포넌트 재사용성도 높아지고 개발이 수월해져서 좋았다.
  • 일관된 코드를 작성할 수 있어서 좋았다.
• 테스트 코드를 작성하니 컴포넌트를 수정할 때 자신감이 생겨서 좋았다.
  • 테스트 코드 작성 시 store 사용할 때, tsyringe를 사용할 때와 class 호출할 때 다르게 동작하는 것에 대해 배웠다.
  • tsyringe를 사용하지 않으면 store를 관리할 수 없다.
  • 또한, 내 마음대로 다양한 테스트 코드를 작성해보면서 나만의 코드를 만들어 볼 수 있어서 좋았다.

📘 Learned

• Store 내부에서 상태값, 상태변경함수 뿐만 아니라 외부 데이터를 fetching하는 로직을 가진 함수도 포함하여 응집도를 높일 수 있는 코드 스타일을 배웠다.
  • 또한, fetching 함수에서도 중복되는 부분인 axios로 요청을 보내는 로직을 apiService 파일로 관리하여 관심사를 분리하여 코드의 이해를 높일 수 있는 팁을 배웠다. 
  • Store에 fetching 함수를 정의하고 hook에서는 useStore를 사용하여 특정 페이지에서 useEffect를 호출하여 해당 페이지가 렌더링된 이후 데이터를 응답받도록 흐름을 배울 수 있어서 좋았다.
• store가 객체 상태값을 가질 때, null 값으로 하는 것 대신 객체 타입에 맞는 기본값을 사용하는 것을 배웠다.

export const nullProductDetail: ProductDetail = {
  id: '',
  category: { id: '', name: '' },
  images: [],
  name: '',
  price: 0,
  options: [],
  description: '',
};

• cURL을 사용하여 POST 요청을 보내 실제 카트에 데이터를 담지 않았음에도 데이터를 담아 화면에서 볼 수 있는 방법을 배웠다.
  • cURL이란, 클라이언트에서 커맨드라인으로 웹 브라우저처럼 활동할 수 있도록 해주는 라이브러리이다.
  • 서버와 통신할 수 있는 커맨드 명령어 툴이다.

curl -X POST https://~~경로 \
  -H "Content-Type: application/json" \
  --data '
    {
      "productId": "0BV000PRO0001",
      "options": [
        {
          "id": "0BV000OPT0001",
          "itemId": "0BV000ITEM001"
        },
        {
          "id": "0BV000OPT0002",
          "itemId": "0BV000ITEM005"
        }
      ],
      "quantity": 1
    }
  '

😅 Lacked

• 객체 데이터 구조를 파악하고 이를 사용해 값을 변경할 때, 추상화가 잘 그려지지 않아서 시간을 많이 소비했다.
• 테스트 코드를 mocking 할 때, mocking 구조를 설계하는 방법, 예를 들면 객체로 감싸야하는지, export로 내보냈는지, export default로 내보냈는지에 따라 테스트 코드가 동작을 제대로 안하는 경우가 있었는데, 디버깅이 어려웠다.

느낀점

8주차 회고를 작성하고 오랜만에 작성하는 회고이다. 여자친구와 방콕 여행을 다녀온 이후로 공부를 소홀히 했던 것 같다. 다시 마음을 다잡고 강의를 듣고 혼자 코드를 이해하면서 쳐보면서 아샬님의 코딩 스타일을 배웠다. 처음에는 내가 작성하는 코드 스타일과 많이 달라서 어려웠지만 아샬님의 코딩 스타일에도 패턴이 보이고 패턴을 이해하니 이후의 새로운 컴포넌트나 기능을 개발할 때에도 패턴에 맞게 개발할 수 있어 일관된 코드를 작성할 수 있어서 좋았다.

 

남은 프로젝트 기간에도 퇴근 후, 주말에도 틈틈히 공부하여 수료를 하고 내가 만들어보고 싶은 프로젝트에도 배운 것들을 적극적으로 사용하여 개발 실력을 향상시키고 싶다.