오(O)늘의 소(So)비 리(Ri)포트
[서비스 링크] : http://13.239.33.140
- 프로젝트 이름: 오소리
기존의 가계부 서비스들이 가진 한계와 사용자가 느끼는 피로도를 다음과 같이 정의했습니다.
- 수동 기록의 번거로움: 보험료, 구독료 등 반복되는 고정 지출을 매번 손으로 입력해야 하며, 영수증 정보를 일일이 타이핑하는 과정에서 사용자는 쉽게 지치고 중도 포기하게 됩니다.
- 단순 사후 리포트의 한계: 과거 지출 내역의 합계만 보여주는 정적인 리포트는 사용자에게 실질적인 자극이나 미래 지출에 대한 가이드를 제공하지 못합니다.
- 공동 관리의 비효율성: 그룹 지출 시 별도의 계산기로 정산하고 각자의 앱에 다시 기록하는 이중 수고가 발생하며, 멤버 간 지출 현황을 실시간으로 파악하기 어렵습니다.
- 지속 가능성 부족: 혼자 기록하고 반성하는 과정이 의무적으로만 느껴져 동기부여가 결여되고 '작심삼일'로 끝나기 쉬운 시스템입니다.
'오소리 가계부'는 위와 같은 문제를 해결하여 "함께 관리하고, 자동으로 기록하며, 미래를 예측하는" 혁신적인 가계부 경험을 제공하고자 합니다.
- 자동화된 기록 시스템 구축: 영수증 OCR 스캔과 Scheduler 기능을 활용하여 번거로운 입력 과정을 최소화하고, 단 3초 만에 지출을 자동 등록하는 편리함을 제공합니다.
- 데이터 기반의 미래 예측: 단순한 과거 기록을 넘어 선형 회귀 분석을 통해 다음 달 지출액을 예측함으로써, 계획적인 소비 습관 형성을 돕습니다.
- 실시간 협업 및 소셜 관리: WebSocket 알림을 통한 실시간 지출 공유와 그룹 챌린지 기능을 도입하여, 가계부 작성을 재미있는 소설 활동으로 전환하고 지속 가능성을 높입니다.
- 스마트한 공동 정산: N분의 1 자동 계산 및 멤버별 자동 기입 기능을 통해 그룹 관리의 수고를 획기적으로 줄입니다.
| 서채원 | 전성중 | 조수인 | 강민채 |
|---|---|---|---|
| Team Leader | Team Member | Team Member | Team Member |
| GitHub | GitHub | GitHub | GitHub |
-
회원가입:
- 회원가입 시 DB에 유저정보가 등록됩니다.
-
로그인:
- 사용자 인증 정보를 통해 로그인합니다.
-
개인 가계부:
- 개인 가계부 관리와 수입/지출 내역을 통해 소비패턴 분석과 뱃지 획득이 가능합니다.
-
그룹 가계부:
- 가족/연인과 함께 수입/지출을 관리하며 챌린지를 통해 뱃지 획득을 하실 수 있습니다.
-
실시간 알림:
- 그룹 가계부에서 초대와 수입/지출 내역 추가 시 실시간 알림을 보내드립니다.
-
지출 분석:
- 개인 가계부와 그룹 가계부의 카테고리별, 멤버별, 등 다양한 지출 분석
-
지출 등록:
- 새로운 내역 등록 시 사용할 수 있는 영수증 OCR 스캔과 고정 지출 자동 등록
-
멤버십 구축:
- 오소리를 이용하는 회원으로 소속감과 재미를 느낄 수 있는 여러 챌린지와 뱃지 발급 시스템
-
개인화 금융 비서/챗봇:
- 개인 수입/지출 데이터를 이용한 개인화된 금융 비서
| CSS | |
| JavaScript | |
| HTML | |
| React | |
| React Router | |
| Axios | ![]() |
| Java 17 | |
| Spring Boot 3.x | |
| MyBatis | |
| OJDBC | |
| Maven | |
| Lombok |
| Naver OCR API | ![]() |
| Kakao API | ![]() |
| Gemini API | ![]() |
| Spring WebSocket | |
| STOMP | ![]() |
| SocketJS | ![]() |
| Spring Security Crypto | |
| JWT | ![]() |
| GSON |
| STS4 | |
| Visual Studio | |
| Node.js | |
| Oracle SQL Developer |
| Git |
project/
├── public/
│ └── vite.svg # Vite 기본 로고 파일
├── src/
│ ├── Data/ # 급여일, 카테고리, 가계부 데이터 생성기
│ ├── api/ # 각 api 모
│ ├── assets/ # React 공식로고 파
│ ├── components/common/ # 공통 컴포넌트
│ ├── context/ # 로그인 상태 관리
│ ├── features/ # 각 페이지별 컴포넌트
│ │ ├── Util/ # 소비 패턴 분석
│ │ ├── alarm/ # 실시간 알림 커스텀 훅
│ │ ├── auth/pages/ # 챌린지, 소비/지출, 고정지출, 멤버 관련 컴포넌트
│ │ ├── group/ # 그룹 가계부 관련 컴포넌트
│ │ ├── menu/ # 캘린더뷰 컴포넌
│ ├── hooks/ # 그룹 가계부 훅
│ ├── layouts/ # 인증 관련 레이아 컴포넌트
│ ├── routes/ # 보안 라우트 컴포넌트
│ ├── App.jsx # 라우팅 구조, 소켓 핸들, 컨트롤러
│ ├── index.css # 전역 css 파일
│ └── main.jsx # React 엔트리 포인트, 컴포넌구 구조
├── package-lock.json # 정확한 종속성 버전이 기록된 파일로, 일관된 빌드를 보장
├── package.json # 프로젝트 종속성 및 스크립트 정의
├── .gitignore # Git 무시 파일 목록
└── README.md # 프로젝트 개요 및 사용법
우리의 브랜치 전략은 Git Flow를 기반으로 하며, 다음과 같은 브랜치를 사용합니다.
-
Main Branch
- 배포 가능한 상태의 코드를 유지합니다.
- 모든 배포는 이 브랜치에서 이루어집니다.
-
{name} Branch
- 팀원 각자의 개발 브랜치입니다.
- 모든 기능 개발은 이 브랜치에서 이루어집니다.
- 상수 : 영문 대문자 + 스네이크 케이스
const NAME_ROLE;
- 변수 & 함수 : 카멜케이스
// state
const [isLoading, setIsLoading] = useState(false);
const [isLoggedIn, setIsLoggedIn] = useState(false);
const [errorMessage, setErrorMessage] = useState('');
const [currentUser, setCurrentUser] = useState(null);
// 배열 - 복수형 이름 사용
const datas = [];
// 이벤트 핸들러: 'on'으로 시작
const onClick = () => {};
const onChange = () => {};
// 반환 값이 불린인 경우: 'is'로 시작
const isLoading = false;
// Fetch함수: method(get, post, put, del)로 시작
const getEnginList = () => {...}
feat : 새로운 기능 추가
fix : 버그 수정
docs : 문서 수정
style : 코드 포맷팅, 세미콜론 누락, 코드 변경이 없는 경우
refactor : 코드 리펙토링
chore : 빌드 업무 수정, 패키지 매니저 수정
== ex1
✨Feat: "회원 가입 기능 구현"
SMS, 이메일 중복확인 API 개발
== ex2
📚chore: styled-components 라이브러리 설치
UI개발을 위한 라이브러리 styled-components 설치






