diff --git a/README.md b/README.md index e215bc4..e04dafc 100644 --- a/README.md +++ b/README.md @@ -1,36 +1,101 @@ -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). +# πŸ“ Mingling (밍글링) - 쀑간 μœ„μΉ˜λ‘œ λ§Œλ‚  κ³³ μ •ν•˜κΈ° -## Getting Started +![Mingling Logo](public/images/banner.jpg) +[πŸ”—λ°κΈ€λ§ μ‚¬μ΄νŠΈ λ°”λ‘œκ°€κΈ°](https://www.mingling.kr/) -First, run the development server: +## πŸ“ ν”„λ‘œμ νŠΈ μ†Œκ°œ + +**Mingling(밍글링)** 은 λͺ¨μž„ μ°Έμ„μžλ“€μ˜ 좜발 μœ„μΉ˜λ₯Ό λ°”νƒ•μœΌλ‘œ **κ°€μž₯ κ³΅ν‰ν•˜κ³  이동이 νŽΈλ¦¬ν•œ 쀑간 지점을 μ°Ύμ•„μ£ΌλŠ” μ„œλΉ„μŠ€**μž…λ‹ˆλ‹€. +지인듀과 약속 μž₯μ†Œλ₯Ό μ •ν•  λ•Œ "μ–΄λ””μ„œ λ§Œλ‚ κΉŒ?"λΌλŠ” κ³ λ―Όκ³Ό μœ„μΉ˜ μ„ μ •μ˜ λΆˆκ³΅ν‰ν•¨μ„ ν•΄κ²°ν•˜κΈ° μœ„ν•΄ κΈ°νšλ˜μ—ˆμŠ΅λ‹ˆλ‹€. λ‹¨μˆœν•œ 물리적 쀑간 거리가 μ•„λ‹Œ **μ‹€μ œ μ§€ν•˜μ²  이동 μ‹œκ°„κ³Ό ν™˜μŠΉ 횟수**λ₯Ό κ³ λ €ν•˜μ—¬ μ„œμšΈ λ‚΄ 졜적의 λ²ˆν™”κ°€μ™€ λͺ¨μž„μ˜ λͺ©μ (식당, 카페, 놀거리 λ“±)에 λ§žλŠ” μž₯μ†Œλ₯Ό μΆ”μ²œν•΄ μ€λ‹ˆλ‹€. + +### 🎯 핡심 컨셉 +- **곡평함**: λͺ¨λ‘μ˜ 이동 μ‹œκ°„μ΄ μ—‡λΉ„μŠ·ν•œ μ§„μ§œ '쀑간' 지점 탐색 +- **νŽΈμ˜μ„±**: λ³΅μž‘ν•œ 계산 없이 μΆœλ°œμ—­λ§Œ μž…λ ₯ν•˜λ©΄ λλ‚˜λŠ” 직관적인 흐름 +- **λ§žμΆ€ν˜• μΆ”μ²œ**: λͺ¨μž„ λͺ©μ μ— λΆ€ν•©ν•˜λŠ” μž₯μ†Œ(μΉ΄ν…Œκ³ λ¦¬λ³„) μ œμ•ˆ + +--- +## ✨ νŒ€μ› ꡬ성 +|**κ°•λ™μœ€ (ν”„λ‘ νŠΈμ—”λ“œ)**|**κΉ€νƒœμš° (ν”„λ‘ νŠΈμ—”λ“œ)**|**μ΄μš©μ„ (λ°±μ—”λ“œ)**| +|:-:|:-:|:-:| +|
[@kangdy25](https://github.com/kangdy25)|
[@kim3360](https://github.com/kim3360)|
[@Yongseok-2](https://github.com/Yongseok-2)| +|**μ‹¬μ„Έμ˜ (λ°±μ—”λ“œ)**|**μž„μ€€μ‹ (λ°±μ—”λ“œ)**|**κ°•κ²½ν›ˆ (λ°±μ—”λ“œ)**| +|
[@casylm](https://github.com/casylm)|
[@sik2Boii](https://github.com/sik2Boii)|
[@rkdrudgns0412](https://github.com/rkdrudgns0412)| + +[Table made by TIT](https://team-info-table.seondal.kr/) + +## πŸš€ μ£Όμš” κΈ°λŠ₯ +- **κ³΅ν‰ν•œ 쀑간 지점 계산**: μœ„μΉ˜ 기반이 μ•„λ‹Œ, λŒ€μ€‘κ΅ν†΅(μ§€ν•˜μ² ) 이동 μ‹œκ°„κ³Ό ν™˜μŠΉ νš¨μœ¨μ„ κ³ λ €ν•œ 졜적의 쀑간역 μ‚°μΆœ +- **λ²ˆν™”κ°€ μΆ”μ²œ**: λ‹¨μˆœ 쀑간 지점이 μ•„λ‹Œ, μ‹€μ œλ‘œ λͺ¨μ΄κΈ° μ’‹κ³  놀거리가 λ§Žμ€ **μ„œμšΈ λ‚΄ μƒμœ„ 3개 λ²ˆν™”κ°€** μΆ”μ²œ +- **λͺ©μ λ³„ μž₯μ†Œ νλ ˆμ΄μ…˜**: 식당, 카페, μˆ μ§‘, 놀거리, μž₯μ†Œ λŒ€μ—¬ λ“± μΉ΄ν…Œκ³ λ¦¬λ³„ μž₯μ†Œ μΆ”μ²œ +- **μ°Έμ„μžλ³„ 이동 정보 제곡**: 각 μ°Έμ„μžλ“€μ˜ μ˜ˆμƒ 이동 μ‹œκ°„, ν™˜μŠΉ λ…Έμ„  λ“± μ„ΈλΆ€ 경둜 제곡 (Kakao Maps API 연동) +- **κ°„νŽΈν•œ λͺ¨μž„ 곡유**: 링크(URL) ν•˜λ‚˜λ‘œ μ†μ‰½κ²Œ μΉœκ΅¬λ“€μ„ μ΄ˆλŒ€ν•˜κ³  μΆœλ°œμ§€λ₯Ό μ·¨ν•©ν•˜λŠ” κΈ°λŠ₯ +- **μ‹€μ‹œκ°„ μ°Έμ—¬ ν˜„ν™©**: λˆ„κ°€ μ–΄λ””μ„œ μΆœλ°œν•˜λŠ”μ§€ μ‹€μ‹œκ°„μœΌλ‘œ 확인 및 μˆ˜μ • κ°€λŠ₯ + +--- + +## πŸ›  기술 μŠ€νƒ + +### Frontend +- **Framework**: Next.js (v16) +- **Language**: TypeScript +- **State Management**: + - **Client/UI State**: Zustand (v5) + - **Server State**: TanStack Query (v5) +- **Styling**: Tailwind CSS V4, Shadcn/UI +- **Map & Location**: Kakao Maps API (`react-kakao-maps-sdk`) +- **Utilities**: `es-hangul` (ν•œκ΅­μ–΄ 처리) +- **Package Manager**: pnpm + +--- + +## πŸ“‚ ν”„λ‘œμ νŠΈ ꡬ쑰 + +Next.js App Router μ•„ν‚€ν…μ²˜λ₯Ό 기반으둜 도메인과 역할을 λͺ…ν™•νžˆ λΆ„λ¦¬ν•˜μ—¬ μ„€κ³„ν–ˆμŠ΅λ‹ˆλ‹€. ```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev +src/ (λ˜λŠ” root) + β”œ πŸ“ app/ # Next.js App Router 기반 νŽ˜μ΄μ§€ (create, join, meeting, recommend, share λ“±) + β”œ πŸ“ components/ # 도메인별/μž¬μ‚¬μš© κ°€λŠ₯ν•œ UI μ»΄ν¬λ„ŒνŠΈ (map, modal, ui, providers) + β”œ πŸ“ hooks/ # μ»€μŠ€ν…€ ν›… (UI 둜직, React Query 기반 api/query, api/mutation) + β”œ πŸ“ lib/ # μœ ν‹Έλ¦¬ν‹° ν•¨μˆ˜, 곡톡 API fetcher (api.ts μ½”μ–΄ 둜직) + β”œ πŸ“ store/ # Zustand μ „μ—­ μƒνƒœ 관리 (useModalStore λ“±) + β”œ πŸ“ types/ # TypeScript μΈν„°νŽ˜μ΄μŠ€ 및 νƒ€μž… μ •μ˜ + β”” πŸ“ public/ # 정적 에셋 (이미지, μ•„μ΄μ½˜ λ“±) ``` -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. +--- + +## βš™οΈ μ‹€ν–‰ 방법 -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. +이 ν”„λ‘œμ νŠΈλŠ” `pnpm`을 νŒ¨ν‚€μ§€ λ§€λ‹ˆμ €λ‘œ μ‚¬μš©ν•©λ‹ˆλ‹€. -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. +```bash +# 1. μ €μž₯μ†Œ 클둠 +git clone [repository-url] + +# 2. μ˜μ‘΄μ„± μ„€μΉ˜ +pnpm install -## Learn More +# 3. ν™˜κ²½λ³€μˆ˜ μ„€μ • +# .env.local νŒŒμΌμ„ μƒμ„±ν•˜κ³  λΉŒλ“œμ™€ 싀행에 ν•„μš”ν•œ ν™˜κ²½λ³€μˆ˜(예: KAKAO_MAP_API_KEY)λ₯Ό μ„ΈνŒ…ν•©λ‹ˆλ‹€. -To learn more about Next.js, take a look at the following resources: +# 4. 개발 μ„œλ²„ μ‹€ν–‰ +pnpm dev +``` +λΈŒλΌμš°μ €μ—μ„œ `http://localhost:3000`으둜 μ ‘μ†ν•˜μ—¬ 확인할 수 μžˆμŠ΅λ‹ˆλ‹€. -- [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 +| λžœλ”© νŽ˜μ΄μ§€ | λͺ¨μž„ 생성 | +|:---:|:---:| +| main | create | -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. +| λͺ¨μž„ μ°Έμ—¬ | 좜발 μœ„μΉ˜ 선택 | +|:---:|:---:| +| join | Route | -Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. +| 쀑간지점 및 경둜 확인 | λͺ©μ λ³„ μž₯μ†Œ μΆ”μ²œ | +|:---:|:---:| +| midpoint | recommend | diff --git a/app/layout.tsx b/app/layout.tsx index 3586eb4..da93d99 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -6,7 +6,7 @@ import Header from '../components/header'; import Footer from '../components/footer'; import GlobalModal from '@/components/modal/globalModal'; import QueryProvider from '@/components/providers/queryProvider'; -import { GoogleAnalytics, GoogleTagManager } from '@next/third-parties/google'; +import { GoogleTagManager } from '@next/third-parties/google'; const pretendard = localFont({ src: [ diff --git a/public/readme/create.PNG b/public/readme/create.PNG new file mode 100644 index 0000000..07b1b45 Binary files /dev/null and b/public/readme/create.PNG differ diff --git a/public/readme/join.PNG b/public/readme/join.PNG new file mode 100644 index 0000000..b9fdadd Binary files /dev/null and b/public/readme/join.PNG differ diff --git a/public/readme/main.PNG b/public/readme/main.PNG new file mode 100644 index 0000000..c9853c3 Binary files /dev/null and b/public/readme/main.PNG differ diff --git a/public/readme/meeting.PNG b/public/readme/meeting.PNG new file mode 100644 index 0000000..b31d3ab Binary files /dev/null and b/public/readme/meeting.PNG differ diff --git a/public/readme/recommend.PNG b/public/readme/recommend.PNG new file mode 100644 index 0000000..4167948 Binary files /dev/null and b/public/readme/recommend.PNG differ diff --git a/public/readme/result.PNG b/public/readme/result.PNG new file mode 100644 index 0000000..d2cafb1 Binary files /dev/null and b/public/readme/result.PNG differ diff --git a/public/readme/share.PNG b/public/readme/share.PNG new file mode 100644 index 0000000..21ead90 Binary files /dev/null and b/public/readme/share.PNG differ