프로젝트 기능 소개
- 구글 로그인 기능
- 네이버 로그인 기능
- 카카오 로그인 기능
- 유저 아이콘 클릭 시 드랍다운 메뉴 등장
- 드랍다운 메뉴에서 로그아웃 클릭 시 로그아웃 후 로그인 페이지로 이동
- tess아이콘 로고 클릭 시 대시보드로 이동
- user아이콘 클릭 시 각 페이지 링크가 걸려있는 드랍다운 생성
- <, > 클릭 시 날짜 이동
- 이동된 날짜에 해당되는 달의 총 소비,수입 출력
- 해당 달의 수입과 지출을 계산해서 소비습관에 대한 메세지 출력
- 해당 달의 최근 거래내역 출력
- 자세히 보기 클릭 시 달력 페이지로 이동
- 이전 3개의 달을 조사하여 해당 달의 고정지출의 날짜를 계산
- 계산된 날짜를 토대로 지출이 완료되면 완료된 고정지출에, 지출이 완료되지 않았을 시 예정된 고정지출에 출력
- 해당 달의 카테고리 중 가장 소비가 많았던 카테고리와 사용한 금액 출력
- 해당달의 기간 중 가장 소비가 많았던 일자와 사용한 금액 출력
- 페이지 어디에서나 + 클릭 시 거래내역 등록 모달 생성
- 날짜, 카테고리, 결제수단, 금액, 상세내용 입력 가능
- 모든 input에 입력이 되어야 저장 가능
- 은행거래 시 거래내역이 문자로 오는 기능을 유사하게 만들기 위해 기능 추가
- 복사 버튼 클릭 시 클립보드에 저장되어 있던 내용이 파싱되어 자동으로 데이터 입력
- 최근 내역의 자세히 보기 클릭 시 달력 페이지로 이동
- 달력 헤더에서 날짜선택 가능
- 해당 달의 총 소비, 수입 파악 가능
- 일별 총 소비, 수입 달력내 표기
- 달력페이지 하단부에 해당 달의 거래내역 출력
- Infinity Scrolling 형식으로 5개 이상의 거래내역 데이터는 스크롤을 내려야 출력
- 달력 내 일자 클릭 시 해당 일자 style 변경
- 해당 일자에 대한 거래내역 출력
- 유저 아이콘 클릭 시 드랍다운 메뉴 등장
- 각 title 클릭 시 해당 title 페이지로 이동
- +버튼 클릭 시 input창이 생성
- 관련 내용을 입력 후 저장 시 데이터 저장
- 이미 존재하는 데이터 이거나 데이터를 입력하지 않으면 저장버튼 비 활성화
- 연필아이콘 클릭 시 데이터 수정기능
- 금지 아이콘 클릭 시 데이터 삭제
- 카테고리별 통계의 자세히 보기 클릭 시 카테고리별 통계 페이지로 이동
- 해당 달의 수입,지출에 대한 카테고리별 파이그래프와 거래내역 출력
- 파이그래프의 리스트 클릭 시 해당 데이터를 제외한 파이그래프 보기 기능
-
해당 달의 수입, 지출별 차트 그래프를 그려줌
