Behind Fitness

운동 기록 및 관리, 통계 프로그램

2024.3.29. ~ 진행중

Behind Fitness 대표 이미지
spring boot
next.js
0 번째 이미지
1 번째 이미지
2 번째 이미지
3 번째 이미지
4 번째 이미지
5 번째 이미지
6 번째 이미지
7 번째 이미지
8 번째 이미지
9 번째 이미지
10 번째 이미지
11 번째 이미지
12 번째 이미지
13 번째 이미지
14 번째 이미지
15 번째 이미지
16 번째 이미지

제 취미는 웨이트 트레이닝입니다. 하지만 기존 앱 스토어에 존재하는 운동 기록 어플들은 제가 원하는 운동을 자유롭게 추가할 수 있는 기능이 부족하고, 기록에 대한 통계 제공 역시 미흡했습니다.

"내가 원하는 게 없다면 직접 만들어보자!"는 생각으로, 웨이트 트레이닝에 특화된 운동 기록, 캘린더, 통계, 메모 기능을 갖춘 프로그램을 개발하게 되었습니다.


Behind-Fitness는 언제 어디서나 웹으로 운동 관리를 할 수 있도록 개발된 웹 애플리케이션입니다. 특히, PWA(Progressive Web App)를 적용하여 모바일 환경에서도 크롬 브라우저를 통해 간접적으로 설치할 수 있도록 설계되어, 어플리케이션처럼 편리하게 활용할 수 있습니다. 앞으로도 지속적인 업데이트를 통해 내가 사용하기에 정말로 편한 서비스를 완성하는 게 목표입니다!

아래의 체험하기 항목을 통해 Behind-Fitness에서 제공하는 기능을 직접 확인해보세요!

참고: 회원가입 기능은 개발하지 않았으며, 현재는 주변 지인들에게 계정을 생성해주어 소수의 사용자(2024.11 기준 5명)만 존재합니다.

제 서버를 함께 사용하고 싶은 분은 직접 문의해주시면 서버 한도 내에서 계정을 생성해드리겠습니다.

Behind 프로젝트

Behind-Fitness는 Behind 프로젝트의 첫 번째 도전입니다. 이 프로젝트는 일상 속 불편함을 자동화하여 하나의 통합 플랫폼에서 관리할 수 있도록 하는 목표를 가지고 있습니다. Behind-Fitness를 시작으로, 운동 관리를 위한 새로운 도전을 시작했습니다.

Behind-Fitness 체험하기

Behind-Fitness의 내부 구현과 주요 기능을 직접 체험할 수 있습니다. 아래 링크를 통해 접속하시고, 제공된 테스트 계정으로 로그인해주세요.

기술 스택 및 개발 특징

프론트엔드

  • Next.jsTypeScript를 활용한 사용자 친화적 UI 구현
  • PWA(Progressive Web App) 적용으로 모바일 환경에서도 어플리케이션처럼 사용 가능
  • React Query를 활용하여 무한 스크롤자동 데이터 갱신 기능 구현
  • Swipe 기능을 통해 직관적이고 편리한 UX 제공
  • 이전 기록을 기억하여 자동 완성 기능으로 사용자 경험(UX) 개선
  • GitHub ActionsGitHub Pages를 통한 자동 배포 CD 파이프라인 구축

백엔드

  • Kotlin을 사용하여 Spring Boot로 개발 (Java가 아닌 Kotlin으로 첫 도전)
  • JWT 기반 인증 시스템으로 지속적인 로그인 유지
    • Redis를 활용해 리프레시 토큰을 관리, 세션 유효성을 유지하며 다중 기기(최대 5개) 동시 로그인 지원
  • GitHub Actions를 이용하여 백엔드 업데이트 시 Docker Hub에 이미지를 자동 빌드 및 업로드
  • AWS에서 Docker 이미지를 pull하여 서버를 자동 재구동하는 CD 파이프라인 구축

🔧 사용 기술

spring boot kotlin mysql redisdocker AWS EC2 nginx github actionsNext.js typescript react query recoil pwa Tailwind CSS ESLint Prettier

현재 구현된 주요 기능

  • 운동 기록캘린더 뷰
  • 인바디 통계 관리
  • 지속적으로 새로운 기능 개발 중

GitHub 저장소