웹 사이트 클론 코딩 취업을 위한 포폴용 개인프로젝트를 진행하려 한다. 이는 특정 웹사이트들을 클론 코딩하여 이커머스 웹을 하나 뚝딱! 만들어낼 예정. 클론 코딩의 이유 : 디자인, 기능 명세 등 개발에 앞선 기획과 디자인에서 시간을 잡아먹지 않기 위함 후보는 마켓

크롤러를 사용하여 마켓 컬리의 데이터를 활용해 간단하게 db를 만들어서 사용하고자 했음.일단 나는 크롤러 써본적도 관련 라이브러리도 잘 몰라 Cheerio를 쓰면 된다는 글들이 많아, 해당 라이브러리를 쓰고자했음아니 가져오는 데이터에 metadata, title, 이런
인증/인가를 위해 쿠키에 토큰을 저장하는 방식을 채택했고 이를 구현했다.의식의 흐름은 아래와 같았다. 1\. 로그인 시에 토큰을 발행하여 쿠키에 accessToken과 refreshToken을 할당?한다.2\. 특정 페이지에 접근할 때 accessToken을 검사하여

회원가입 로직과 UI 등을 만들었고 완성 상태는 아래와 같음.회원가입validator를 어떻게 만들어야하는가?과거엔 Class로 만들어서 validator 객체를 사용했었음.근데 객체로 만들어서 리턴만 해도 충분하다고 생각했고, 순수함수로 만들어서 쓰자!라는 생각으로

한달 인턴의 온보딩 과제를 3일정도 수행했음.하면서 힘든 부분에 관한 참고용을 기록을 해놔야겠다 싶어서 포스팅 시작!과거 node.js 환경에서 Jest로 테스트를 해본 적은 있음, TDD도 연습해보고 그런데 Vite + TS환경에 이를 접목시키려다보니 정말;; 머리가

드디어 메인 페이지 제작 완료해쑴크롤러로 긁어오긴 했지만 정확하게 데이터들이 준비가 안되서 상당히 귀찮음을 느끼며 진행했음api 로직을 따로 빼놔야할까?useAuth, useGetData를 훅으로 만들어 사용하고 있고 앞으로 하려해서 api로직까진 분리를 안했었음 그런

위와 같이 간단하게 신상품 페이지 UI를 만들고 담기 기능을 추가함이 페이지는 어떤 방식으로 렌더링을 시켜줘야 할까? CSR? SSR?담을 때 어떤 데이터 형식을 db에 전달해줘야 할까?정렬 기준을 어느 부분까지 가져가야 할까?이 페이지 또한 검색 엔진에 걸리면 좋을

체크박스 선택 관련 로직을 어떻게?담기 기능으로 장바구니에 같은 데이터를 넣는다면 이는 어떻게 구현할까?체크박스는 headlessui 라이브러리를 사용하여 구현하였고 아래 사진이 기본적인 예시이다.전체를 선택할 때도 있을 것이고 n개를 선택할 때도 있을 것임.그러므로
이번 주부터 개인 포트폴리오 사이트를 제작 할 예정디자인은 아래 디자인을 참고하여 비슷하게 갈 생각으로 데이터를 다루지 않고 진행하게 될 듯 하다.공통 컴포넌트한 페이지로 만들 예정이며 공통 컴포넌트 제작에 집중할 계획이다.많은 컴포넌트를 만들진 않겠지만, 꼼꼼하게 확

컨셉 시안은 좀 더 빈티지 적인 디자인이나 개인적으로 편안하게 볼 수 있는 디자인은 위와같이 심플하고 모던한 디자인이였기에 색감과 레이아웃만 가져와서 사용하였음.이력서 수정포트폴리오의 내용을 채우기 위해 기존 이력서의 내용을 다듬고 수정하였으며 이를 적용하였음.레이아웃
개인적으로 마켓컬리를 클로닝한 프로젝트를 대충 마무리 지어놨다.인증 인가, db 구현, 데이터 호출?? 등 서버 단의 로직과 프론트를 같이 하려니 좀 어지러운 부분이 많았음.아직 리팩토링과 배포를 진행하지 않았기에 마무리라고 할 수 는 없지만, 사이드 프로젝트를 들어가
프로젝트명: Play With Me기간: 2025.05 ~ 2025.06배포 링크 : https://play-with-me-topaz.vercel.app/목표: 실시간 예약/매칭 플랫폼 MVP 개발결과: MVP중 일부만 개발 완료Next.js 기반 UI 구현예