- 페이지 전반적인 레이아웃 구성
- 공통 Navbar와 검색창
- Candy Bottle 애니메이션
- 사용자 정보와 한 줄 문구
- 다가오는 캔디들
- 추천캔디들
- 기다리는 캔디 슬라이더
- 지난 캔디와 선물한 캔디들에 대한 알림창
- 캔디 카드 조절
- 모달 레이아웃 구현
- 캔디 추가하기
GET - 캔디 날짜, 메시지 추가하기
PUT - 카테고리 가져오기
POST - 카테고리 추가하기 이동
- 분류별 카테고리 페이지 (
/wish/category) 라우팅
- 모달 레이아웃 구현
- 카테고리 추가하기
GET
default: 담은 캔디- 디데이에 맞게
OptionBar렌더링 - 디데이 존재 → month, date 렌더링
- 없을 시 → 담은 후 경과 일자 렌더링
- 홈 뷰에 맞게 사이즈 조정
- 호버 시 스타일링
- 카테고리 별로 다른 캔디 렌더링
- 카테고리 별로 다른 색 렌더링
- 경과 일자 렌더링
- 호버 시 스타일링
+버튼 누르면 모달 띄우기
- 페이지 레이아웃 구현
- 분류별 캔디 서버 연동
- 분류별 캔디 이미지 클릭 시 분류별 캔디 상세 페이지 이동 구현
framer-motion을 이용한 애니메이션 구현
fullpage.js를 통해 슬라이드 되도록 구현- 선택한 감정 이모티콘 별로 완료 모달의 이미지 다르도록 구현
React-Slick을 이용한 이미지 슬라이더 구현, 해당 월별 카테고리 갯수에 따라 이미지 다르게 보이도록 구현- 카테고리별로
completeCard다르게 보이도록 구현
- 빈 쿼리 전달 시 모든 캔디 검색
- 기타 담은 캔디, 완료한 캔디 별로 쿼리 결과 렌더링
- 아이디(이메일)와 이름, 생년월일, 비밀번호를 입력받는 폼 구성
- 레이아웃은 완성했지만, 회원가입 기능 자체는 아직 구현하지 않았음
- 현재는 하나의 계정으로 로그인 가능하다
- 아이디(이메일)와 비밀번호를 입력받아 로그인할 수 있다.
- 회원가입 버튼을 입력하면 회원가입 페이지로 이동
"@babel/core": "^7.14.6",
"@croquiscom/eslint-config-www": "^1.3.0",
"@storybook/addon-actions": "^6.3.1",
"@storybook/addon-essentials": "^6.3.1",
"@storybook/addon-links": "^6.3.1",
"@storybook/react": "^6.3.1",
"@svgr/webpack": "^5.5.0",
"@types/lodash-es": "^4.17.4",
"@types/matter-js": "^0.17.2",
"@types/react": "17.0.11",
"@types/react-slick": "^0.23.4",
"@types/styled-components": "^5.1.10",
"babel-loader": "^8.2.2",
"eslint": "7.29.0",
"eslint-config-next": "11.0.1",
"prettier": "2.3.2",
"slick-carousel": "^1.8.1",
"stylelint": "^13.13.1",
"stylelint-config-concentric-order": "^4.0.1",
"typescript": "4.3.4"
"@ant-design/icons": "^4.6.2",
"@fullpage/react-fullpage": "^0.1.19",
"@material-ui/core": "^4.11.4",
"axios": "^0.21.1",
"dayjs": "^1.10.6",
"framer-motion": "^4.1.17",
"jotai": "^1.1.3",
"lodash": "^4.17.21",
"lodash-es": "^4.17.21",
"matter-js": "^0.17.1",
"next": "11.0.1",
"pathseg": "^1.2.0",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-hook-form": "^7.10.1",
"react-query": "^3.18.1",
"react-slick": "^0.28.1",
"styled-components": "^5.3.0"
- public
- assets
- banners
- bottles
- candy
- candy3d
- candyAdded
- completeCandy
- emoticon
- home
- icons
- images
- index.html
- src
- assets
- components
- common
- Button
- CandyCard
- CandyEdit
- CandyIcon
- CategoryCard
- DialogManager
- Footer
- Navbar
- Navigation
- NoticeModal
- SearchBar
- TestCard
- TopHeader
- WishedCandySlider
- complete
- home
- layout
- wish
- reward
- search
- signup
- extension
- Header
- CandyCategory
- SaveDetail
- pages
- api
- complete
- reward
- search
- wish
- utils
- states
- styles
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent