- SPA방식으로 구현
- 데이터(모델)과 뷰를 최대한 분리하려고 노력
- Observer pattern을 활용하여 구현
- 모델(State)가 변경되면 이를 관찰하고 있는 모든 Observer(컴포넌트) 렌더링
- Subject Class : Observer를 등록하고 Observer가 관찰하고 있는 대상이 변경되면 이를 알림
- 해당 View의 State를 관리하는 State Class가 Subject를 상속받아 State가 변경되면 이를 등록된 Observer들에게 알림 -데이터를 관리하는 Model에 해당
- /state의 여러 State클래스들 -State를 상속받아 각 View별로 필요한 State 변경 관련 함수 구현
- /Component 의 컴포넌트 클래스들
- 화면을 여러 컴포넌트로 나누어 구현 - Component로 공통 메소드를 묶어서 추상화 시켜야 했으나 그렇게 하지 못함
- 대부분의 컴포넌트가 Observer 클래스를 상속받아 State를 관찰
- State가 등록된 모든 Observer의 update()를 실행시키고 컴포넌트에서 오버라이딩되어 재정의된 render() 함수를 통해 자신을 렌더링
- View Class : 화면을 나타내는 Class로 여러 컴포넌트를 입력받아 화면을 구성할 수 있도록 구현
- /View 디렉토리의 Class들이 View 를 상속받아 각 화면을 구현
- app.js : SPA의 시작점에 해당하며 SPA의 화면을 구성하는 View를 생성하여 화면을 주소에 맞게 해당 View로 렌더링한다.
- uri hash fragment를 활용하여 라우팅을 구현
- Express.js기반
- ORM Sequelize 사용
- Passport + jwt 사용하여 회원인증 구현
- 토큰인증 미들웨어를 구현하여 로그인된 사용자만 Content(가계부기록)관련 rest api 사용 가능하게끔 구현
- 통계부분의 일일 지출 그래프를 구현하지 못했다.
- Payment(결제수단) 관련 기능을 구현하지 못했다.
- 프론트엔드에서 jwt 토큰 만료후 백엔드에서 발생시키는 에러를 예외처리하고 토큰을 재발급받는 프로세스를 구현하지 못했다