diff --git a/README.md b/README.md index e215bc4c..a8ab8865 100644 --- a/README.md +++ b/README.md @@ -1,36 +1,84 @@ -This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). +# 🎁 WishPool -## Getting Started +WishPool은 μ—¬λŸ¬ μ‚¬λžŒμ΄ μ œμ•ˆν•œ μ„ λ¬Ό μ€‘μ—μ„œ μƒμΌμžκ°€ 직접 선택할 수 μžˆλ„λ‘ λ•λŠ” **μ„ λ¬Ό 선택 κ³Όμ • μ€‘μ‹¬μ˜ νλ ˆμ΄μ…˜ μ„œλΉ„μŠ€**μž…λ‹ˆλ‹€. -First, run the development server: +μ„ λ¬Ό 결과보닀 **선물을 κ³ λ₯΄λŠ” κ³Όμ •μ˜ κ²½ν—˜**에 μ§‘μ€‘ν•˜μ—¬, μƒμΌμžμ™€ μ°Έμ—¬μž λͺ¨λ‘κ°€ λ§Œμ‘±ν•  수 μžˆλŠ” μ„ λ¬Ό μ€€λΉ„λ₯Ό λ•μŠ΅λ‹ˆλ‹€. -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev -``` +--- -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. +## πŸ”— 배포 링크 +- μ„œλΉ„μŠ€ URL: https://wishpool.store +- GitHub Repository: https://github.com/WishPool-dev -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. +--- -This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. +## πŸ’‘ 기획 λ°°κ²½ -## Learn More +μ—¬λŸ¬ λͺ…이 ν•¨κ»˜ 생일 선물을 μ€€λΉ„ν• μˆ˜λ‘ μƒμΌμžμ˜ μ·¨ν–₯을 μ •ν™•νžˆ λ°˜μ˜ν•˜κΈ° μ–΄λ ΅κ³ , 선택 κ³Όμ •μ—μ„œ 의견이 λΆ„μ‚°λ˜λŠ” λ¬Έμ œκ°€ λ°œμƒν•©λ‹ˆλ‹€. -To learn more about Next.js, take a look at the following resources: +WishPool은 μ„ λ¬Ό μ œμ•ˆ 과정을 열어두고 μ΅œμ’… 선택 κΆŒν•œμ„ μƒμΌμžμ—κ²Œ λ§‘κΉ€μœΌλ‘œμ¨, μ„ λ¬Ό μ€€λΉ„ κ³Όμ •μ˜ 뢀담을 쀄이고 μ„ λ¬Ό λ§Œμ‘±λ„λ₯Ό λ†’μ΄κ³ μž κΈ°νšλ˜μ—ˆμŠ΅λ‹ˆλ‹€. -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. +--- -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! +## ✨ μ£Όμš” κΈ°λŠ₯ -## Deploy on Vercel +### πŸ“ μœ„μ‹œν’€ 생성 -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. +λŒ€ν‘œμžλŠ” μƒμΌμžμ˜ 생일과 μ„ λ¬Ό 수령 λ‚ μ§œλ₯Ό μ„ νƒν•˜μ—¬ μœ„μ‹œν’€μ„ 생성할 수 μžˆμŠ΅λ‹ˆλ‹€. -Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. +μœ„μ‹œν’€ 생성이 μ™„λ£Œλ˜λ©΄ μ°Έμ—¬μžλ₯Ό μ΄ˆλŒ€ν•  수 μžˆλŠ” 링크가 λ°œκΈ‰λ˜λ©°, μΉ΄μΉ΄μ˜€ν†‘ 곡유 κΈ°λŠ₯을 톡해 κ°„νŽΈν•˜κ²Œ 전달할 수 μžˆμŠ΅λ‹ˆλ‹€. + +--- + +### 🎁 μ„ λ¬Ό μ œμ•ˆ + +λŒ€ν‘œμžμ™€ μ°Έμ—¬μžλŠ” μƒμ„±λœ μœ„μ‹œν’€μ— μƒμΌμžμ—κ²Œ μ£Όκ³  싢은 선물을 자유둭게 μ œμ•ˆν•  수 μžˆμŠ΅λ‹ˆλ‹€. + +각 선물은 **이미지, 링크, 이름** 정보λ₯Ό ν¬ν•¨ν•˜μ—¬ λ“±λ‘λ˜λ©°, μ—¬λŸ¬ 개의 선물을 μ œμ•ˆν•˜λŠ” 것도 κ°€λŠ₯ν•©λ‹ˆλ‹€. + +이λ₯Ό 톡해 μ°Έμ—¬μžλ“€μ˜ λ‹€μ–‘ν•œ 아이디어가 μžμ—°μŠ€λŸ½κ²Œ λͺ¨μ΄λ„둝 μ„€κ³„ν–ˆμŠ΅λ‹ˆλ‹€. + +--- + +### 🎯 μƒμΌμž μ„ λ¬Ό 선택 + +μƒμΌμžλŠ” μ°Έμ—¬μžλ“€μ΄ μ œμ•ˆν•œ μ„ λ¬Ό λͺ©λ‘μ„ ν™•μΈν•œ λ’€, μ›ν•˜μ§€ μ•ŠλŠ” 선물을 **λ“œλž˜κ·Έ μΈν„°λž™μ…˜μœΌλ‘œ 제거**ν•˜λ©° μ΅œμ’…μ μœΌλ‘œ λ°›κ³  싢은 μ„ λ¬Όλ§Œ 선택할 수 μžˆμŠ΅λ‹ˆλ‹€. + +μ„ λ¬Ό 선택 과정을 λ‹¨μˆœν•œ 결정이 μ•„λ‹Œ, λΆ€λ‹΄ 없이 즐길 수 μžˆλŠ” ν•˜λ‚˜μ˜ κ²½ν—˜μœΌλ‘œ μ œκ³΅ν•©λ‹ˆλ‹€. + +--- + +### πŸ“£ 선택 κ²°κ³Ό 곡유 + +μƒμΌμžμ˜ 선택이 μ™„λ£Œλ˜λ©΄ λŒ€ν‘œμžμ˜ ν™ˆ ν™”λ©΄μ—μ„œ 선택 μ™„λ£Œ μƒνƒœλ₯Ό 확인할 수 μžˆμŠ΅λ‹ˆλ‹€. + +μ„ νƒλœ μ„ λ¬Ό λͺ©λ‘μ€ μΉ΄μΉ΄μ˜€ν†‘ 곡유 λ²„νŠΌμ„ 톡해 μ°Έμ—¬μžλ“€κ³Ό κ°„νŽΈν•˜κ²Œ κ³΅μœ ν•  수 μžˆμ–΄, μ„ λ¬Ό μ€€λΉ„ 과정을 μžμ—°μŠ€λŸ½κ²Œ λ§ˆλ¬΄λ¦¬ν•  수 μžˆμŠ΅λ‹ˆλ‹€. + +--- + +## πŸ› οΈ 기술 μŠ€νƒ + +### Frontend +- Next.js +- React +- TypeScript +- TanStack Query +- Tailwind CSS + +### Tooling +- ESLint +- Prettier +- Husky + +--- + +## πŸ“‚ ν”„λ‘œμ νŠΈ ꡬ쑰 + +```text +src/ +β”œβ”€ api/ # API μš”μ²­ 및 TanStack Query hooks +β”œβ”€ components/ # 곡톡 UI μ»΄ν¬λ„ŒνŠΈ +β”œβ”€ pages/ # νŽ˜μ΄μ§€ λ‹¨μœ„ μ»΄ν¬λ„ŒνŠΈ +β”œβ”€ styles/ # μŠ€νƒ€μΌ 및 λ””μžμΈ 토큰 +β”œβ”€ types/ # 곡톡 νƒ€μž… μ •μ˜ +└─ utils/ # 곡톡 μœ ν‹Έ ν•¨μˆ˜ diff --git a/src/api/axiosInstance.ts b/src/api/axiosInstance.ts index d53b3b76..37848e61 100644 --- a/src/api/axiosInstance.ts +++ b/src/api/axiosInstance.ts @@ -1,6 +1,7 @@ import axios from 'axios'; import { HTTP_STATUS } from '@/constants/common/httpStatus'; +import { PATH } from '@/constants/common/path'; export const axiosInstance = axios.create({ baseURL: process.env.NEXT_PUBLIC_API_URL, @@ -26,6 +27,8 @@ axiosInstance.interceptors.response.use( const { response, config } = error; if (response?.status === HTTP_STATUS.UNAUTHORIZED) { + localStorage.removeItem('accessToken'); + window.location.href = PATH.INTRO; } if (response) { @@ -36,6 +39,7 @@ axiosInstance.interceptors.response.use( } else { console.error('🚨[API NETWORK ERROR], error.message'); } + return Promise.reject(error); }, ); diff --git a/src/app/pick/preview/page.tsx b/src/app/pick/preview/page.tsx index e3e7b71f..bf3e044d 100644 --- a/src/app/pick/preview/page.tsx +++ b/src/app/pick/preview/page.tsx @@ -47,7 +47,7 @@ const PreviewPage = () => { <>

μ΅œμ’… 점검

μ΅œμ’… μ„ νƒν•œ μ„ λ¬Ό

-
+
{pickedItems.map(({ giftId, itemName, itemUrl, imageUrl }) => ( { return ( <> -
{children}
+
+ {children} +
); }; diff --git a/src/app/wishpool/(viewer)/[id]/final/page.tsx b/src/app/wishpool/(viewer)/[id]/final/page.tsx index 4d2349ca..e8996cbe 100644 --- a/src/app/wishpool/(viewer)/[id]/final/page.tsx +++ b/src/app/wishpool/(viewer)/[id]/final/page.tsx @@ -34,7 +34,7 @@ const FinalPage = () => {

-
+
{ title="μ„ λ¬Ό μΆ”κ°€ λ²„νŠΌ μ•„μ΄μ½˜" className="text-text" /> - μ„ λ¬Ό 더 μ œμ•ˆ + μ„ λ¬Ό 더 μ œμ•ˆν•˜κΈ° + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/home/ActiveEventSection.tsx b/src/components/home/ActiveEventSection.tsx index baab22cc..7d511e76 100644 --- a/src/components/home/ActiveEventSection.tsx +++ b/src/components/home/ActiveEventSection.tsx @@ -68,8 +68,8 @@ const ActiveEventSection = ({ planType, wishpools }: activeEventProps) => { ) : ( <> -
- +
+

μ§€κΈˆ μ§„ν–‰λ˜κ³  μžˆλŠ” μ΄λ²€νŠΈκ°€ μ—†μ–΄μš”
diff --git a/src/components/layout/Header/HomeHeader.tsx b/src/components/layout/Header/HomeHeader.tsx index e5082a03..b33b09d2 100644 --- a/src/components/layout/Header/HomeHeader.tsx +++ b/src/components/layout/Header/HomeHeader.tsx @@ -26,7 +26,7 @@ const HomeHeader = ({ hasMenu = false, bgColor }: HomeHeaderProps) => { const hasToken = useHasToken(); - const handleClose = () => { + const handleLogoClick = () => { if (hasToken) router.push(PATH.INTRO); router.push(PATH.HOME); }; @@ -35,7 +35,7 @@ const HomeHeader = ({ hasMenu = false, bgColor }: HomeHeaderProps) => { <> +