[팀 서비스 클론 코딩] 우디(류정우) 미션 제출합니다.

[jw-r]

🎨 1단계 - 팀 서비스의 일부 페이지 클론 코딩

🚀 구현한 페이지의 주소와 방식

• 주소: 배포 링크
• 렌더링 방식: SSR

✅ 체크리스트

선택한 렌더링 방식의 이유

SSR 랜더링 방식을 사용했습니다.
기존의 코끼리끼리 프로젝트는 같이 styled-components를 사용해서 NextJS로 마이그레이션을 했습니다
하지만 NextJS에서 styled-components를 사용하기 위해서는 'use client'를 선언해줄 필요가 있었고, 그로인해 API 요청은 client 에서 진행했습니다
위의 이유로 모든 컴포넌트는 jsx의 { }로 감싸져있지 않은 부분을 서버에서 렌더링 후, 자바스크립트 다운로드가 완료되면 추가적으로 client 에서 렌더링을 수행하게 됩니다

코드 재사용

기존 서비스에서 사용중인 styled-components를 도입하는 것으로 모든 컴포넌트를 재사용할 수 있었습니다
기존 서비스에서 사용하는 모든 컴포넌트들을 재사용했습니다. 데이터 패칭부분은, fetch함수를 사용했고, 현 서비스 서버에 요청을하면 cors에러가 나서 정적파일 json을 패칭해오는 방식을 선택했습니다!

[ksone02]

안녕하세요 우디! 너무 바빴어서 리뷰가 너무 늦어졌죠,, 죄송합니다 ㅜㅜ

혹시 ssr을 선택하신 이유가 있나요??
해당 페이지에선 데이터의 변화가 유동적으로 이루어지진 않기에 ssr보단 ssg의 방법이 조금 더 효과적이지 않았을까 하는 생각이 들어요! 그 부분이 조금 아쉬웠어요.

전체적으로 코드도 잘 재활용하신 것 같고, styled component도 잘 적용하신 것 같아서 인상 깊었어요.

우선 2단계를 진행하기 위해 approve 할게요!

[ksone02]

오 저는 .babelrc 파일을 만들고 빌드하니까 기존 next 바벨이랑 충돌이 나는지 계속 에러가 발생하던데, 혹시 이상없이 잘 동작하셨나요??