- Auction은 중고 물품을 거래해서 보다 저렴한 가격에 구매를 할 수 있는 웹 서비스입니다.
- 중고거래이기떄문에 내가 생각한 가격보다 저렴하게 구입할 수도 있습니다.
- 구매자와 판매자의 위치를 시각화해서 보여줌으로써 일정 조율이 편리해집니다.
- 물건의 시세를 알 수있게 다른 쇼핑몰의 데이터와 가격을 비교할 수 있는 기능을 제공합니다.
- 백엔드 팀과 비동기적 소통 및 협업
- 기획부터 디자인까지 참여한 경험
- UI/UX 향상 및 이미지, 메모리 최적화
-승환-
혹시 언제쯤 가능하실까요? [nextJS에 msw 적용기]
우리 어디서 볼까? [카카오 맵 api로 경로 시각화하기]
이것도 봐주라 [광고 모달창 만들기]
Sass 도입기
내가 이미지 빨리 보여줄게 [이미지 최적화하기]
눌렀어? 일단 보여줄게 [좋아요 버튼에 낙관적 업데이트 적용하기]
다른건 몰라도 메모리는 아끼자 [이벤트 버블링 적용해보기]
보기 편하게 준비했어 [프로젝트에 라이브러리없이 페이지네이션 적용해보기 그리고 성능 최적화]
스크롤만 내려 나머진 내가 할게 [프로젝트에 무한 스크롤 적용해보기]
react-portal? 써볼게요 [프로젝트에 react-portal로 모달 적용해보기]
에러? 난 그전에 방지해 [프로젝트에 테스트 적용해보기]
| 메인 페이지 (Mobile) | 게시물 페이지 (Mobile) |
|---|---|
 |
 |
| 회원가입 페이지 (Mobile) | 로그인 페이지 (Mobile) |
|---|---|
 |
 |
| 글 쓰기 페이지 (Mobile) | 상세 페이지 (Mobile) |
|---|---|
 |
 |
| 원가 비교 페이지 (Mobile) |
|---|
- 필요한 시점에 이미지를 불러오도록 lazy loading을 적용 및 layout shift를 방지하기 위한 Next.js image 태그 적용
- react-hook-form을 사용하여 불필요한 리랜더링 방지 및 마운팅 속도 증가
- 불필요한 api 요청을 방지하기 위해 tanstack-query를 활용한 데이터 캐싱
- 브라우저 메모리를 최소화하기위해 이벤트 버블링 적용
- Debounce를 이용해 사용자 입력 처리 최적화
| Frontend |
|---|
|
