-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
50 additions
and
25 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,40 +1,65 @@ | ||
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/pages/api-reference/create-next-app). | ||
![image](https://github.com/user-attachments/assets/9ca928c0-d139-4ee5-80f7-5b314c51e705) | ||
## 🗺️ 지도 기반 주변 인기 스포츠 시설을 간편하게 탐색하는 웹 서비스, HelloFit | ||
🌐 스포츠 이용권을 보유한 사용자들은 수많은 스포츠 시설과 강좌를 직접 탐색해야 하는 번거로운 과정을 겪는다. 시설 및 강좌를 선택하기 위해서는 시설의 위치, 강좌 정보, 운영 시간, 가격 등 다양한 요소를 고려해야 하며 이는 매우 복잡하고 시간이 소요되는 과정이다. 또한 기존 스포츠 강좌 사이트는 시설들의 위치를 개별로 확인해야 하는 번거로움이 존재하며, 사람들이 어떤 시설을 많이 이용하는지 트렌드 정보를 파악하기 어렵다. | ||
|
||
## Getting Started | ||
헬로핏은 ‘지도’ 기반 시설 탐색, 누적 수강생 데이터 기반 ‘시설 트렌드’ 추천, ‘시설 후기’ 서비스 등 탐색 경험을 개선할 다양한 기능을 제공한다. | ||
|
||
First, run the development server: | ||
### 👉 [**HelloFit 구경가기**](https://www.hellofit.site/) | ||
|
||
```bash | ||
npm run dev | ||
# or | ||
yarn dev | ||
# or | ||
pnpm dev | ||
# or | ||
bun dev | ||
``` | ||
<br/> | ||
|
||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. | ||
## 💙 주요 기능 | ||
![image](https://github.com/user-attachments/assets/5d1ab660-7adf-41f1-9a5a-8abb06b5d86b) | ||
|
||
You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file. | ||
### 👋 지도 기반으로 가까운 시설 간편하게 탐색 | ||
헬로핏은 사용자 위치와 가까운 스포츠 시설을 쉽게 탐색할 수 있도록 지도 기반의 탐색 기능을 제공한다. 이를 통해 사용자는 시설의 위치를 일일이 파악하지 않아도 지도를 통해 주변 시설을 간편히 찾을 수 있다. 또한, 종목별 누적 수강생 수 기반으로 인기 스포츠 종목 필터를 제공한다. 이 필터를 활용하면 인기 있는 종목의 시설들을 지도에서 한눈에 확인할 수 있다. | ||
|
||
![image](https://github.com/user-attachments/assets/a5e04e32-34a1-490d-9c18-b4e8624d4576) | ||
|
||
[API routes](https://nextjs.org/docs/pages/building-your-application/routing/api-routes) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`. | ||
### 👋 (일반/장애) 이용권 유형 별 맞춤 정보 제공 | ||
헬로핏은 이용권 종류에 따라 일반, 특수 두가지 버전의 서비스를 제공하며, 각 버전에는 보유한 이용권에 맞는 맞춤 시설 및 강좌 정보를 제공한다. 사용자는 토글 버튼을 통해 간단하게 버전을 전환하면서 탐색할 수 있다. 특수 모드에서는 장애인 사용자가 시설 선택 시 고려해야 하는 요소가 많기 때문에 장애 특수 필터와 시설 장애 지원 정보를 제공함으로써 적절한 시설 선택을 할 수 있도록 돕는다. | ||
|
||
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/pages/building-your-application/routing/api-routes) instead of React pages. | ||
![image](https://github.com/user-attachments/assets/d2f074a7-810d-4769-9741-8fb1d566cb71) | ||
![image](https://github.com/user-attachments/assets/83b761e2-7807-4bab-a8fe-7062a4e7ac56) | ||
|
||
This project uses [`next/font`](https://nextjs.org/docs/pages/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. | ||
### 👋 누적 수강생 수 기반으로 인기 있는 ‘스포츠 종목’ 추천 | ||
전체 시설의 누적 수강생 수 데이터를 추출하여 가장 인기 있는 스포츠 종목 필터를 제공한다. 이를 통해 사용자는 인기 스포츠 종목을 간편하게 파악할 수 있다. | ||
![image](https://github.com/user-attachments/assets/dcf413ba-4929-468f-9402-a34c5b09ed32) | ||
|
||
## Learn More | ||
### 👋 인기 시설의 트렌드 정보 제공(누적 수강생 수 데이터 기반) | ||
헬로핏은 누적 수강생 수 데이터를 기반으로 지역별 인기 시설 상위 5곳을 추천한다. 또한 지역 및 종목 필터를 제공해 조건에 맞는 인기 시설을 쉽게 파악할 수 있다. 이를 통해 사용자는 스포츠 시설의 트렌드를 한번에 파악하고 시설 선택을 더 간편하게 할 수 있다. | ||
|
||
To learn more about Next.js, take a look at the following resources: | ||
![image](https://github.com/user-attachments/assets/1225140e-e9ea-4ae3-a5ee-bfc23a1371f2) | ||
|
||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. | ||
- [Learn Next.js](https://nextjs.org/learn-pages-router) - 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! | ||
![image](https://github.com/user-attachments/assets/01efefb5-cfcd-409c-9378-d208e8134843) | ||
|
||
## Deploy on Vercel | ||
### 👋 시설 찜 기능 및 관심 시설 알림 기능 제공 | ||
시설 찜 기능을 통해 사용자는 관심 시설을 등록하고 한눈에 정리할 수 있으며, 알림 페이지에서 신규 강좌 개설 정보를 받아 번거로움 없이 필요한 정보를 쉽게 확인할 수 있다. | ||
|
||
![image](https://github.com/user-attachments/assets/545eadca-17cf-4f53-9b1f-0ab4f49bec7f) | ||
|
||
|
||
|
||
<br/> | ||
|
||
## 💚 TechStack | ||
![image](https://github.com/user-attachments/assets/d8535dde-0f9a-4b4b-888b-6fdc8ecee161) | ||
|
||
|
||
<br/> | ||
|
||
## 💙 Architecture | ||
![image](https://github.com/user-attachments/assets/7b01ef9b-12bc-4736-9392-eb26c3917bab) | ||
|
||
<br/> | ||
|
||
|
||
## 💚 Developers | ||
|<img src="https://avatars.githubusercontent.com/u/125109615?v=4" width="150" height="150"/>|<img src="https://avatars.githubusercontent.com/u/57613101?v=4" width="150" height="150"/>|<img src="https://avatars.githubusercontent.com/u/57895643?v=4" width="150" height="150"/>|<img src="https://avatars.githubusercontent.com/u/165978255?v=4" width="150" height="150"/>| | ||
|:-:|:-:|:-:|:-:| | ||
|정성혜<br/>[@eqypo9](https://github.com/eqypo9)<br/>`프론트엔드`|조혜진<br/>[@MEGUMMY1](https://github.com/MEGUMMY1)<br/>`프론트엔드`|임종훈<br/>[@leemhoon00](https://github.com/leemhoon00)<br/>`백엔드`|홍수연<br/>[@suyeonhong99](https://github.com/suyeonhong99)<br/>`디자이너`| | ||
|
||
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/pages/building-your-application/deploying) for more details. |