Retrospection_W2

📄 2020.11.23 (월)

What did we do?

• backend framework 설치(Koa), dotenv, lint + prettier, mongodb, mongoose
• schema 검토 및 부분 작성

📚 회고

보완할 부분

• error-handling

  • try-catch를 쓸지 아니면 전역 default error handling을 할지
  • https://github.com/koajs/koa/blob/master/docs/error-handling.md
  • https://github.com/koajs/koa/wiki/Error-Handling

• db와 통신하는 코드들을 어디에 둘지 고민.

  1. 서버에서 바로 db와 통신
  2. 따로 폴더에 분리
     • 분리시 model 폴더는 schema를 정의 하므로 다른 폴더에 넣기 예) user.repository.js
  3. schema 정의 하는 곳(model 폴더)에서 바로 db와 통신하는 code를 작성해서 그 메서드들을 export한다(schema로 만든 model 대신).
     • 파일에 책임이 3개이다. (스키마 정의, model을 만들고, db와 통신)

내일 할것

• api 명세서 작성
• back log 작성

---

📄 2020.11.24 (화)

What did we do?

• BackLog 작성

• Backend 작업환경 설정

  • body-parser 모듈 설치 및 post 테스트
  • eslint-config-prettier, eslint-plugin-prettier 모듈 설치
  • @koa/cors 모듈 설치

• Frontend 작업환경 설정

  • react, react-redux 설치
  • @reduxjs/toolkit 모듈 설치

• 스키마 작성

  • User Schema

    • _id, name, email, imageURL
    • provider: 어떤 인증방식을 써서 로그인한 것인지? (naver, github, ...)
    • providerId: 로그인 시 callback 으로 받아지는 Id 저장 (추후 비교를 위해 저장해둠)
    • startDayOfWeek: 월요일 ~ 일요일 중에 어디를 달력 시작으로 할지?
    • startDateOfMonth: 1 ~ 31일 중 어디를 시작할지?
    • imageURL: 사용자 프로필
    • createAt: 가입 일
    • paymentMethod: 카드 이름(KB 국민카드, 카카오),

  • Transaction Schema

    • accountBookId: 가계부 id
    • userId: 해당 user
    • date: 생성된 날짜
    • category: 어느 분야에서의 수입인지 지출인지
    • paymentMethod: 카드인지 현금인지
    • description: 설명
    • cost: 돈
    • tag: #가족여행, #식비
    • imageURL: 수입/지출 관련 사진을 넣으려면 넣기위해

  • AccountBook Schema

    • title: 가계부 이름,
    • authorizedUsers: 가계부에 인증되어있는 사용자

  • Category Schema

    • 6개 ~ 20개 모든 user에게 동일하게 보여줄 것
    • 카테고리는 따로 커스텀 안되고, 커스텀은 tag에서 진행

  • PaymentMethod Schema

    • 원래는 계획했었는데, Transaction 데이터를 통해 각 카드별로 filter를 구현하면 어떨지?
    • 우선은 user Model과 합쳤음

    • // user.model에서 처리 예정
      const mongoose = require('mongoose');
      
      const { Schema } = mongoose;
      
      const paymentMethodSchema = new Schema({
       name: String,
      });
      
      module.exports = mongoose.model('paymentMethod', paymentMethodSchema);
      

📚 회고

• 찐사장님이 로그인을 해주신다고 하십니다.. 충성 ㅠㅠ ^^7
• 오전/오후 충실하게 팀원들과 작업을 했습니다.

오늘 할 것 (우선 순위 순으로!)

• redux 자체 공부
• react toolkit 공부
• react 공부
  • react Memo는 언제 써야할지 등 알아보기
• 공부하고 [기술 공유] 에 올리기

참고 자료

• 벨로퍼트 리액트 리덕스
• jbbe react toolkit 설명
• toolkit 공식문서

내일 할 것

• Redux 공부한 내용 공유 (함께 성장하기! 🙆‍♂️🙆‍♀️)
  • 시간 나면 react-toolkit도 공부하기!
• ncloud 서버 생성 & 배포
• 서버 생성 완료되면 => github Action
  • github action yml

---

📄 2020.11.25 (수)

What did we do?

• 호눅스님의 transaction 수업 👍
• ncloud 서버 생성 ☁
  • 한글 및 ssh 인증서 설정
  • 가계부 프로젝트 clone
• Github Action 스크립트 적용
  • 빌드 테스트 및 자동 배포 적용
• Front-end 구조 설정
  • presentational / container component로 분리
  • slice.js -> ducks 패턴 적용

📚 회고

• 본격적으로 코드를 작성하기 시작해서 보람있었다
• GitHub Action을 사용해서 배포 작업을 하던 중 ssh 접속 오류가 발생해서 굉장히 당황스러웠다.
  • pem으로 생성된 default 비밀번호에는 특수문자가 포함되어 오류가 발생했던 것 같다..😥😥
• Redux-toolkit 을 사용하면 Redux를 좀 더 효율적이고 간편하게 사용할 수 있다는 것을 알게되었지만, toolkit도 좀 더 확실히 공부하고 활용해야겠다고 느꼈습니다.
• 얼른 구조 공부를 열심히해서 본격적인 개발에 들어가고 싶어요~!
• 똑똑한 우리 팀원분들 덕분에 오늘도 알차게, 열심히 보냈습니다!

---

📄 2020.11.26 (목)

What did we do?

• 디자인/레이아웃 논의
• 협업 방식 논의
  • 페이지별로 작업하기로 결정!
  • 공통 컴포넌트에 대해서는 재사용(지향)
• 기봉님이 Rechart 소개해주셨다
• Header, Sidebar, Dashboard page의 차트 구현

📚 회고

• 오늘 아무것도 안한 것 같다 😴
• 첫 페이지를 만들었다! 야호!
• 코드 리뷰 처음 해봤는데 재밌었다
• 팀원 피드백으로 부터 배울 점이 많은 것 같다.

---

📄 2020.11.27 (금)

🙋‍♂️ 이번주는 어땠나요?

• 개발을 조금 맛봐서 좋았다
• 공부해서 너무 좋았다.
• 공부를 병행하면서 기획을 진행했다.
• 아직은 기획도 공부도 모두 많이 부족한 것 같다
• 이번 주 개발된 게 생겨서 보람찼다.
• 나도 간식 준비를 해야겠다.

🛠️ 개선할 사항이 있을까요?

• 마일스톤, 각자 개발할 부분 백로그에 기록
• 개발 순서
  • frontend & backend 개발 필요할 때마다 병행하기!
  • 테스트 코드 작성하기!(우선 백 부터)
    • 백 테스트
      • 통합 테스트
        • 하게 되면 TEST DB 연동 해야함
      • 단일 테스트
        • 모킹으로 의존성 제거
• env 분리
  • 개발용, 프로덕션용으로 나누는 건 어떨까?
• 공부 한거 정리 해서 올리기!!!
  • 사소한 것도 올리자! 👍

🤗 발표 후 받은 피드백

• CODE OWNERS
• CODE OWNERS DOCS