diff --git a/README.md b/README.md index a75ac52..a28f6e0 100644 --- a/README.md +++ b/README.md @@ -1,40 +1,212 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). +![header](https://capsule-render.vercel.app/api?type=waving&color=047857&height=250§ion=header&text=COWERKERS&fontSize=80&fontAlignY=40&fontColor=ffffff) -## Getting Started +## **πŸ“‘ λͺ©μ°¨** -First, run the development server: +> ***[ν”„λ‘œμ νŠΈ μ†Œκ°œ](#ν”„λ‘œμ νŠΈ-μ†Œκ°œ)*** +> +> ***[개발 κΈ°κ°„](#개발-κΈ°κ°„)*** +> +> ***[개발자 μ†Œκ°œ](#개발자-μ†Œκ°œ)*** +> +> ***[상세 κ³„νš](#상세-κ³„νš)*** +> +> ***[User Flow](#User-Flow)*** +> +> ***[ν”„λ‘œμ νŠΈ ꡬ쑰](#ν”„λ‘œμ νŠΈ-ꡬ쑰)*** +> +> ***[개발 ν™˜κ²½](#개발-ν™˜κ²½)*** +> +> ***[기술 μŠ€νƒ](#기술-μŠ€νƒ)*** +> +> ***[μ£Όμš” κΈ°λŠ₯](#μ£Όμš”-κΈ°λŠ₯)*** +> +> ***[배포 및 μ‹€ν–‰ 방법](#배포-및-μ‹€ν–‰-방법)*** +> + +
+ +## πŸ§‘β€πŸ’» ν”„λ‘œμ νŠΈ μ†Œκ°œ + +이 ν”„λ‘œμ νŠΈλŠ”Β [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) 으둜 μ‹œμž‘λœ [Next.js](https://nextjs.org/) ν”„λ‘œμ νŠΈμž…λ‹ˆλ‹€. + +CoworkersλŠ” νŒ€μ„ κ΅¬μ„±ν•΄μ„œ ν•  일을 λ§Œλ“€κ³ , κ³΅μœ ν•˜κ³  μ†Œν†΅ν•˜λ©΄μ„œ 업무λ₯Ό 효율적으둜 ν•  수 있게 λ•λŠ” μ„œλΉ„μŠ€μž…λ‹ˆλ‹€. + +
+ +## πŸ”—Β λ§ν¬ + +[GitHub](https://github.com/team-collabor/coworkers) + +[🎬 μ‹œμ—° μ˜μƒ](https://www.youtube.com/watch?v=sF21zWhRcss) + +[🌐 배포 μ‚¬μ΄νŠΈ](https://coworkers-colla.netlify.app) + +
+ +## πŸ‘¨β€πŸ«
μ£Όμš” κΈ°λŠ₯ + +|![image](https://github.com/user-attachments/assets/31c20b48-9c9e-4894-b560-de0630da47d2)|![image](https://github.com/user-attachments/assets/553dcfc9-d308-4e3d-a0a3-60dd602900c4)|![image](https://github.com/user-attachments/assets/0e1908e3-88e1-4f30-baf9-bb6ec3abb8ec)| +|:---:|:---:|:---:| +|**λžœλ”© νŽ˜μ΄μ§€**|**νŒ€ νŽ˜μ΄μ§€**|**ν•  일 νŽ˜μ΄μ§€**| + +|![image](https://github.com/user-attachments/assets/6b3ed4c5-ed2a-4c8c-ae32-8f7d9622b67a)|![image](https://github.com/user-attachments/assets/50679453-8afa-4185-8aa1-03f14e3eb6e2)|![image](https://github.com/user-attachments/assets/1432afe2-988e-404f-81a2-c23e313f4049)| +|:---:|:---:|:---:| +|**자유 κ²Œμ‹œνŒ**|**계정 μ„€μ • νŽ˜μ΄μ§€**|**마이 νžˆμŠ€ν† λ¦¬ νŽ˜μ΄μ§€**| + +
+ +## πŸ—“οΈ
개발 κΈ°κ°„ + +***10 / 7 (λͺ©) ~ 11 / 14 (λͺ©)*** + +
+ +## **πŸ‘¨β€πŸ‘¨β€πŸ‘¦β€πŸ‘¦Β κ°œλ°œμž μ†Œκ°œ** + +- **κΉ€μš°μ„±** [@me92years](https://github.com/me92years) : 마이 νžˆμŠ€ν† λ¦¬ νŽ˜μ΄μ§€ +- **μ΄μŠΉν˜„**Β [@leesh7048](https://github.com/leesh7048) : μžμœ κ²Œμ‹œνŒ νŽ˜μ΄μ§€ +- **μ˜₯μŠΉν˜„** [@SeungHyunOK](https://github.com/SeungHyunOK) : λ Œλ”©νŽ˜μ΄μ§€ 및 계정 μ„€μ • νŽ˜μ΄μ§€ +- **정원식**Β [@wonsik3686](https://github.com/wonsik3686) : ν•  일 νŽ˜μ΄μ§€ +- **μ •μΈμž¬**Β [@Injaeeee](https://github.com/Injaeeee?pvs=4,)Β : νŒ€ νŽ˜μ΄μ§€ + +
+ +## πŸ“ƒ
상세 κ³„νšκ³Ό 일정 + +[**πŸ“Œ 상세 κ³„νš**](https://www.notion.so/wonsik/11309277475d81549fe7ebf0e04dae7d,) + +[**πŸ“ 상세 일정**](https://www.notion.so/wonsik/11309277475d810db53ec53c248f89d7,) + +
+ +## πŸ’‘
User Flow + +![μ½”μ›Œμ»€μŠ€ μœ μ €ν”Œλ‘œμš°](https://github.com/user-attachments/assets/8a985e36-821c-495c-93bf-64154343e896) + +
+ +## πŸ“
ν”„λ‘œμ νŠΈ ꡬ쑰 -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev ``` +πŸ“wine/ +β”‚ +β”œβ”€β”€ πŸ“public/ +β”‚ β”œβ”€β”€ πŸ“images/ # 이미지 파일 폴더 +β”‚ └── πŸ“ic_wine.svg ... +β”‚ +β”œβ”€β”€ πŸ“constants/ +β”‚ └── πŸ“auth/ +β”‚ └── mediaQueryBreakPoint.ts +β”‚ +β”œβ”€β”€ πŸ“src/ +β”‚ └── πŸ“components/ # μž¬μ‚¬μš© κ°€λŠ₯ν•œ μ»΄ν¬λ„ŒνŠΈ +β”‚ └── πŸ“common/ # 곡톡 μ»΄ν¬λ„ŒνŠΈ +β”‚ β”œβ”€β”€ πŸ“Button/ +β”‚ β”‚ └── Button.tsx +β”‚ └── πŸ“Toast/ +β”‚ └── Toast.tsx +β”‚ +β”œβ”€β”€ πŸ“pages/ # Next.js page λΌμš°νŒ… +β”‚ β”‚ └── πŸ“signin/ +β”‚ β”‚ └── index.tsx +β”‚ β”‚ └── πŸ“signup/ +β”‚ β”‚ └── index.tsx +β”‚ β”‚ └── πŸ“[id]/ # νŒ€ νŽ˜μ΄μ§€μ— λ“€μ–΄κ°ˆ μ»΄ν¬λ„ŒνŠΈ λͺ¨μŒ +β”‚ β”‚ β”‚ β”œβ”€β”€ πŸ“editteam/ +β”‚ β”‚ β”‚ β”‚ └── index.tsx +β”‚ β”‚ └── index.tsx +β”‚ β”‚ └── index.tsx +β”‚ β”‚ └── _app.tsx +β”‚ β”‚ └── _404.tsx +β”‚ β”‚ +β”‚ β”œβ”€β”€ πŸ“libs/ # 라이브러리 κ΄€λ ¨λœ μ„ΈνŒ… 및 ν•¨μˆ˜λ“€ μ •λ¦¬ν•˜λŠ” 폴더 +β”‚ β”‚ └── πŸ“axios/ # axios κ΄€λ ¨ μ„ΈνŒ… 및 api μš”μ²­ ν•¨μˆ˜ +β”‚ β”‚ └── axiosInstance.ts +β”‚ β”‚ └── πŸ“auth/ +β”‚ β”‚ └── πŸ“image/ +β”‚ β”‚ └── πŸ“review/ +β”‚ β”‚ └── πŸ“user/ +β”‚ β”‚ └── πŸ“wine/ +β”‚ β”‚ +β”‚ β”œβ”€β”€ πŸ“contexts/ # μ „μ—­ μƒνƒœ 관리 +β”‚ β”‚ +β”‚ β”œβ”€β”€ πŸ“hooks/ # μ»€μŠ€ν…€ React ν›… +β”‚ β”‚ +β”‚ β”œβ”€β”€ πŸ“types/ # νƒ€μž… 폴더 (DTO ν˜Ήμ€ μ „μ—­μ μœΌλ‘œ μ‚¬μš©λ˜λŠ” type 미리 μ •μ˜) +β”‚ β”‚ # μ»΄ν¬λ„ŒνŠΈ props의 κ²½μš°μ—λŠ” ν•΄λ‹Ή μ»΄ν¬λ„ŒνŠΈ μœ„μΉ˜μ— μ •μ˜ +β”‚ β”‚ +β”‚ β”œβ”€β”€ πŸ“styles/ # μŠ€νƒ€μΌ κ΄€λ ¨ 파일 λͺ¨μŒ +β”‚ β”‚ └── global.css +β”‚ β”‚ +β”‚ β”‚ +β”‚ └── πŸ“utils/ # μœ ν‹Έλ¦¬ν‹° 폴더 +β”‚ +β”œβ”€ .gitignore +β”œβ”€ .env.local # 각자 ν™˜κ²½μ—μ„œ 별도 생성 ν•„μš” +β”œβ”€ .eslintrc.json +β”œβ”€ .prettierrc.json +β”œβ”€ next.confing.mjs +β”œβ”€ tailwind.config.ts +β”œβ”€ tsconfig.json +β”‚ +...μƒλž΅ + +``` + +
+ +## πŸ’»
개발 ν™˜κ²½ + +|OS|IDE|Version Control|Package Manager|deploy|Community| +|:---:|:---:|:---:|:---:|:---:|:---:| +|![macOS](https://img.shields.io/badge/macOS-000000?style=for-the-badge&logo=apple&logoColor=white) ![Windows](https://img.shields.io/badge/Windows-0078D6?style=for-the-badge&logo=windows&logoColor=white)|![Visual Studio Code](https://img.shields.io/badge/Visual_Studio_Code-0078d7?style=for-the-badge&logo=visual-studio-code&logoColor=white) ![IntelliJ IDEA](https://img.shields.io/badge/IntelliJ_IDEA-000000?style=for-the-badge&logo=intellij-idea&logoColor=white)|![Git](https://img.shields.io/badge/Git-F05032?style=for-the-badge&logo=git&logoColor=white) ![GitHub](https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github&logoColor=white)|![npm](https://img.shields.io/badge/npm-CB3837?style=for-the-badge&logo=npm&logoColor=white)|![Vercel](https://img.shields.io/badge/Vercel-000000?style=for-the-badge&logo=vercel&logoColor=white)|![Discord](https://img.shields.io/badge/Discord-5865F2?style=for-the-badge&logo=discord&logoColor=white)![Notion](https://img.shields.io/badge/Notion-000000?style=for-the-badge&logo=notion&logoColor=white)| + +
+ +## βš’
기술 μŠ€νƒ + +![React](https://img.shields.io/badge/React-61DAFB?style=for-the-badge&logo=react&logoColor=white) +![Next.js](https://img.shields.io/badge/Next.js-000000?style=for-the-badge&logo=next.js&logoColor=white) +![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white) +![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white) +![Axios](https://img.shields.io/badge/Axios-5A29E4?style=for-the-badge&logo=axios&logoColor=white) + +
+ +## πŸš€
배포 및 μ‹€ν–‰ 방법 + +**1. ν”„λ‘œμ νŠΈ 클둠** + +`git clone https://github.com/Codeit-FE08-Part3-Team6/wine.git cd wine](https://github.com/team-collabor/coworkers.git` + +**2. μ˜μ‘΄μ„± μ„€μΉ˜** + +ν”„λ‘œμ νŠΈμ—μ„œ μ‚¬μš©ν•˜λŠ” νŒ¨ν‚€μ§€λ“€μ„ μ„€μΉ˜ν•©λ‹ˆλ‹€. + +`npm install` + +**3. 개발 μ„œλ²„ μ‹€ν–‰** -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. +λ‹€μŒ λͺ…λ Ήμ–΄λ₯Ό μ‹€ν–‰ν•˜μ—¬ 둜컬 개발 ν™˜κ²½μ—μ„œ ν”„λ‘œμ νŠΈλ₯Ό μ‹€ν–‰ν•  수 μžˆμŠ΅λ‹ˆλ‹€. -You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file. +`npm run dev` -[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`. +이후 λΈŒλΌμš°μ €μ—μ„œΒ [http://localhost:3000](http://localhost:3000/) 으둜 μ ‘μ†ν•˜μ—¬ 개발 쀑인 μ›Ή μ• ν”Œλ¦¬μΌ€μ΄μ…˜μ„ 확인할 수 μžˆμŠ΅λ‹ˆλ‹€. -The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages. +**4. λΉŒλ“œ 및 배포** -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. +ν”„λ‘œλ•μ…˜ ν™˜κ²½μ—μ„œ μ‚¬μš©ν•˜κΈ° μœ„ν•΄ λΉŒλ“œν•  λ•ŒλŠ” μ•„λž˜ λͺ…λ Ήμ–΄λ₯Ό μ‚¬μš©ν•©λ‹ˆλ‹€. -## Learn More +`npm run build` -To learn more about Next.js, take a look at the following resources: +κ·Έ ν›„, μ•„λž˜ λͺ…λ Ήμ–΄λ‘œ λΉŒλ“œλœ νŒŒμΌμ„ μ‹€μ œλ‘œ μ‹€ν–‰ν•©λ‹ˆλ‹€. -- [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. +`npm start` -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! +**5. 배포** -## Deploy on Vercel +이 ν”„λ‘œμ νŠΈλŠ” netlify을 μ‚¬μš©ν•˜μ—¬ 배포할 수 μžˆμŠ΅λ‹ˆλ‹€. -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. +GitHub와 μ—°λ™λœ netlify 계정을 톡해 μžλ™μœΌλ‘œ 배포되며, μ½”λ“œλ₯Ό pushν•˜λ©΄ μžλ™μœΌλ‘œ 배포 ν”„λ‘œμ„ΈμŠ€κ°€ μ§„ν–‰λ©λ‹ˆλ‹€. -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. +[**배포 μ‚¬μ΄νŠΈ**](https://wine-nine-xi.vercel.app/?pvs=4%5D(https://coworkers-colla.netlify.app/,)