Youtube UI clone coding에 이어서 Instagram UI + 자바스크립트를 이용한 로그인 기능과 댓글 추가 기능까지 추가된 clone coding을 구현해보았다. 중점적으로 생각한 것들 semantic tag의 적절한 사용
React의 적용과 Backend로부터 서버연결까지 완성한 인스타그램 클론코딩 미니 프로젝트 (´ ˘ `).。oO ( ♡ )~ React 비구조화 할당 익숙해지기만 하면 쉬운 비구조화 할당! ES6문법으로 리액트에서 반복적으로 써주는 값들을 간결하게 줄여줄 수 있다.
수정중 PROJECT OVERVIEW 침구, 생활용품 등을 판매하는 사이트인 [공백] (https://gong100.kr/) 을 클론하는 프로젝트를 끝마쳤다. 커머스사이트의 특징을 살려 로그인부터 상품보기 - 상품리스트 - 상품디테일 - 카트에 담기- 주문하기 -
SIGNUP & LOGIN ⚡️ FUNCTION 공백 사이트에는 아이디 중복검사나 비밀번호 확인 일치여부, 형식 일치여부 기능이 없다. 하지만 다른 사이트들을 보다보니 우리 사이트에도 적용해보면 유저들에게 더욱 친절한 서비스가 되지 않을까 생각하여 구현해보았다. S
Product Detail ⚡️ FUNCTION 디테일 페이지 컴포넌트화 sub 이미지들을 각각 클릭시 해당 이미지로 이미지 전환 상품 카테고리에 따른 컬러/추가구성만 있는 것도, 사이즈/추가구성만 있는 등 카테고리별 옵션 세분화 추가구성까지 선택 후 내가 선택한 상
Order ⚡️ FUNCTION 회원만 주문할 수 있는 access_token 여부검사 cart 에서 선택한 제품 data -> orderInfo 컴포넌트(front) 회원가입 때 저장되었던 userInfo -> shippingInfo 컴포넌트(back) 다음주소A
💭 PROJECT OVERVIEW >숙박 예약 웹사이트인 여기어때 를 클론한 프로젝트 평소 에어비앤비와 같은 숙박예약 사이트를 클론코딩하면 재밌겠다라는 생각을 하고 있었는데 이번 2차프로젝트에서 비슷한 플랫폼을 가진 '여기어때' 웹사이트를 클론코딩하게 되었다!
💭 PROJECT OVERVIEW & TIL 1차 때는 path parameter 를 많이 써보며 query parameter에 대해서도 궁금했었는데 이번 프로젝트에서는 동적 라우팅과 쿼리스트링을 통한 통신이 많아서 1,2차 프로젝트를 통해 둘다 사용해보며 RESTf