프로젝트 | 쿠팡 클론코딩 3회차(feat. Next.js)
2022. 7. 18. 11:18
프로 젝트/쿠팡
프론트엔드 챌린지 실무에서 잘쓰이는 기술스택을 가지고 쿠팡 클론코딩 하기 🎥 목차 더보기 프로젝트 미션 사용한 기술스택 깨달은 점 오류 해결방법 아쉬운 점 🚀 프로젝트 미션 이번 챌린지에서는 쿠팡 상품 페이지를 구현해보겠습니다. 공통된 UI들을 컴포넌트로 추출하고 확장성을 고려하여 단단하계 설계해봅니다. 상태 관리 및 비즈니스 로직에 집중하여, 화면을 어느 단위로 나누는 것이 효율적일지 고민해봅니다. 가독성 좋은 JSX 작성, 디렉토리 구조 등 프론트엔드에서의 Clean Code에 집중합니다. 데이터 연동을 위해 쿠팡과 동일한 형식의 API가 제공, 데이터 연동을 꼭 해보시길 적극적으로 권장합니다! (Next.js의 API routes 기능을 활용해 일종의 BFF를 만들어서 데이터들을 가공해서 활용해보셔..
프로젝트 | 쿠팡 클론코딩 2회차(feat. Next.js)
2022. 7. 14. 23:42
프로 젝트/쿠팡
프론트엔드 챌린지 실무에서 잘쓰이는 기술스택을 가지고 쿠팡 클론코딩 하기 🎥 목차 더보기 프로젝트 미션 사용한 기술스택 깨달은 점 오류 해결방법 아쉬운 점 🚀 프로젝트 미션 쿠팡 서비스의 로그인 페이지와 회원가입 페이지에서 사용되는 컴포넌트들을 만들어볼 것입니다. 총 네 개의 컴포넌트를 설계하며, 실무에서처럼 다양한 유즈케이스에 탄력적으로 대응할 수 있는 구조에 대해서 고민해봅니다. 만든 컴포넌트들은 Storybook을 사용해 누구나 확인할 수 있도록 배포합니다. 만들어볼 컴포넌트 Button Input Check CheckGroup 👨💻 사용한 기술스택 (+ 라이브러리) 프레임워크 : Next.js 라이브러리 @emotion-styled react-hook-form storybook 배포 chroma..
프로젝트 | 쿠팡 클론코딩 1회차(feat. Next.js)
2022. 6. 30. 23:17
프로 젝트/쿠팡
[진행중] React 가장 실무에 가까운 쿠팡 클론 코딩 챕터 Ⅰ 상세 보기 www.numble.it 프론트엔드 챌린지 실무에서 잘쓰이는 기술스택을 가지고 쿠팡 클론코딩 하기 ❓상황 Next.js 프레임워크가 실무에서 많이 쓰인다고 하여, 개발역량 향상을 위해 공부하려고 인터넷에 Next.js관련 정보를 얻다가 챌린지를 시작하게 되었다. 특히, 실무에서 가장 잘 쓰이는 기술스택을 모아놨다고 한다. 곧바로 채용이 될 수는 없겠지만, '기업들이 원하는 인재상에 잘 맞는 개발자가 되지 않을까'하는 기대감도 생겼다. 🎥 목차 더보기 프로젝트 미션 사용한 기술스택 깨달은 점 오류 해결방법 아쉬운 점 🚀 프로젝트 미션 로그인을 위해 필요한 Data Fetching 모듈을 만들어볼 것입니다. 주어진 Interface..