Studay

프로젝트 기획 배경

퇴근하기 전까지 아이를 돌봐줄 학원을 알아보기 위해 고군분투하는 맞벌이 부부의 모습을 보고 만들게 되었습니다. 손쉽게 학원 정보를 얻고 내 아이 학원 스케줄을 관리하도록 도와줍니다.

제공하는 기능

🔗 UI & 기획 보러가기

• 카카오 로그인
• 내 주변 학원 지도 제공
  • 위치에 따른 학원 검색
  • 학원 수업(이름, 수업명, 비용), 리뷰, 전화번호 등의 상세보기
  • 학원비용, 학원 과목, 위치에 따른 필터 검색
  • 학원 이름 검색
  • 학원 찜하기를 통한 학원비 장바구니 기능(예상 한달 교육비를 알려줍니다.)
• 아이 일정 제공
  • 현재 시각의 아이 스케줄 정보 제공
  • 달력을 통한 아이별 학원 스케줄
• 학원 정보 요약 정보 제공
  • 아이가 다니는 학원 정보 목록 제공
  • 학원 재료비, 수업비, 납부 일자 등록 기능 제공
    

운영중인 사이트

https://www.studay.me/

프로젝트의 주요 관심사

• 실제 서비스 가능한 완성도로 서버-클라이언트 구현(API, UI, 통신 규약, 기능성)
• 제 3자가 자신의 코드를 리팩토링 할 수 있다는 생각을 갖고 작성하는 확장, 유지보수하기 좋은 코드
• QA와 사용자 인터뷰를 통한 사용자 친화적인 서비스 만들기

🛠 기술스택

언어
프레임워크
라이브러리
상태관리
패키지
Formatter
배포
협업툴

팀원

Frontend	Frontend	Frontend
김희석	김유진	김지성

시연영상

154c7da4-27e4-4455-8301-a63ae3427a6d.mp4

☘ environment variables

.env

VITE_API_ENDPOINT =
VITE_CLIENT_ID =
VITE_CLIENT_SECRET = 
VITE_KAKAO_CLIENT_ID = 
VITE_KAKAO_CLIENT_SECRET_KEY = 
VITE_GOOGLE_CLIENT_ID =
VITE_GOOGLE_CLIENT_SECRET_KEY =

🔑 Install

npm install //package.json으로부터 의존성 모듈 설치

npm run dev //실행
npm run build //빌드
npm run mobild //모바일 환경에서 확인