목표

• 로그인 후에 로그아웃을 클릭 시 로그아웃이 되지 않는 현상이 있습니다.

auth.router에서 문제가 발생했을 것이라고 판단

체크리스트

• 로그아웃 버그 해결하기

참고

목표

• API Swagger 적용 (API document tool)
• module-alias

체크리스트

• API Swagger 적용
• API document 작성
• Module-alias 적용

참고

• Swagger Reference

목표

• Related Posts Header / Body 추가

체크리스트

• Related Posts Header
• Related Posts Body

참고

• Figma

• typescript 적용 확인
• tsconfig
• 필요한 라이브러리 추가

Frontend

• npx create-react-app client --template typescript 으로 CRA 타입스크립트 설정

• 추가한 라이브러리

  • yarn add 와 yarn add -D @types/ 로 설치하였습니다.
  • axios, redux, dotenv, styled-components

• ESLint, Prettier은 추후 설치

• 첫 디렉토리에서

  • cd client
  • yarn install한 후
  • yarn start하면 실행 Port: 3000

목표

• Response JSON에 해당 api의 성공 여부를 확인할 수 있는 success state을 추가

체크리스트

• Success state 추가

참고

목표

• 회원가입 폼 생성 및 서버 연동

체크리스트

• 회원가입을 위한 폼 컴포넌트 생성
• 폼 서버 연동

참고

목표

• Card 추가
  

체크리스트

• Card 추가

참고

• Atomic Design 적용, 잘못 적용된 부분 지적 부탁드려요

목표

• Post API Swagger 수정하고, Notion Post API 문서 정리 작업

체크리스트

• Post API Swagger 수정
• Notion Post API 문서 정리

참고

• https://www.notion.so/API-ad7069881ef74fabb5eb0b45b86c1e3c

목표

• multer를 이용한 파일 업로드 기능 구현

체크리스트

• multer 설치
• file upload 구현

참고

목표

• TypeORM의 @CreateDateColumn으로 생성일자(createdAt)을 생성할 경우 timezone이 KST기준이 아닌 (UTC 기준) 문제가 있음

체크리스트

• timezone을 KST기준으로 수정

참고

목표

• Related Posts Cell 추가
• Cell 내부 컴포넌트 추가

체크리스트

• Related Posts Cell
• Related Posts Cell Components

참고

• Figma

목표

• 로그인 페이지 생성

체크리스트

• 로그인 페이지

참고

• Figma

버그

목표

• package-lock, yarn-lock 변경입니다.

체크리스트

• change package-lock, yarn-lock file

참고

목표

• 이메일 로그인 인증 구현

체크리스트

• 이메일 인증
• 라우팅

참고

• ESLint
• Prettier

목표

• MainHeader 컴포넌트 추가
  

체크리스트

• 컴포넌트 추가

참고

목표

• 불필요한 코드 / 중복 기능 / 코드 네이밍 / REST API 설계 수정

체크리스트

• 디렉토리 구조 변경
• 변수 이름 수정
• 주석 추가
• 불필요한 코드 제거
• REST API Versioning

참고

• Clean Code & Refactoring
• REST API 설계 가이드

목표

• MySQL은 배포 단계에서 연결 / 개발 단계에서는 Sqlite3를 사용

체크리스트

• Sqlite3 설치
• TypeORM - Sqlite3 연결

참고

목표

• 좋아요(Like) 모델을 추가하고 관련 기능들을 수정

체크리스트

• 좋아요(Like) 모델 추가
• 좋아요 관련 기능 수정 및 추가

참고

Post CRUD 기능

• 글 생성
• 글 디테일
• 글 삭제
• 글 수정

• typescript 적용 확인
• typeORM 설치
• 필요한 라이브러리 추가

Backend

• npx typeorm init 로 TypeORM 기본 세팅을 진행하였습니다.

• 추가한 라이브러리

  • yarn add 와 yarn add -D @types/ 로 설치하였습니다.
  • cors, dotenv, express, http-errors, morgan, winston, mysql, nodemon, ts-node

• 첫 디렉토리에서

  • cd server
  • yarn install한 후
  • yarn start하면 서버 실행 Port: 8000

목표

• 글 생성일자 Week 단위로 필터링을 한 후, 결과를 JSON의 형식으로 응답하는 API 구현

체크리스트

• 글 생성일자 Week 단위의 좋아요 순으로 필터링
• 결과를 JSON의 형식으로 응답

참고

목표

글로벌 스타일 (스크린 사이즈, CSS 리셋) 정의

체크리스트

• 스크린 사이즈 정의
• CSS 리셋

참고

목표

• 임포트 할 때 상대경로에서 절대경로로 변경

체크리스트

• 절대경로로 설정 변경하기

참고

목표

• 로그인 버튼 컴포넌트 추가

체크리스트

• 로그인 버튼 컴포넌트
• 로그인 버튼 아이콘
• 로그인 버튼 타이틀

참고

• Figma

목표

• Related Posts Header Components 추가

체크리스트

• Header Title
• Header Link
• Header Create Button

참고

• Figma

변경 사항

• ormconfig.json -> ormconfig.js
• tsconfig : prettier 적용
• package.json : mysql 8버전에서 작동이 안되어서 mysql2로 변경해서 설치했습니다.

목표

• 앱 글로벌 백그라운드 컬러 추가

체크리스트

• 백그라운드 컬러 추가 (#F8FAFB)

참고

목표

• Readme를 Wiki의 내용을 반영하여 수정

체크리스트

• Readme 소개, 멤버 등 기입

참고

목표

main page 헤더 구조 잡기

체크리스트

• 헤더 구조 잡기
• 해더 추가

참고

목표

• 디렉토리 구조 변경 (index.tsx)
• Main 페이지 설정 (router)
• RelatedPosts Cell Components 추가

체크리스트

• 디렉토리 구조 변경
• Main 페이지 설정 (router)
• RelatedPosts Cell Components 추가

참고

목표

• 서버 로그를 파일로 남겨 문제가 발생 시 확인 및 복원 할 수 있도록 winston을 사용하여 info(normal), error logger 구현

체크리스트

• Winston Logger Info
• Winston Logger error

참고

• Express Winston Logger 관련 블로그 포스트

목표

일부 파일에서 Prettier 스타일 적용 안된 것을 수정했습니다.

체크리스트

참고

목표

• Post Controller의 비즈니스 로직을 Service로 분리

체크리스트

• 비즈니스 로직 Service로 분리
• Post API 코드 리팩토링

참고

목표

• Related Posts Layout 잡기

체크리스트

• Related Posts Layout 잡기

참고

목표

• 로그인 템플릿 설정
• 텍스트 컴포넌트 설정
• 로그인 버튼 컴포넌트 설정
• 회원가입 링크 설정

체크리스트

• Login Temaplte
• Login Text
• Welcome Text
• Login Button
• Sign up Link

참고

• FIgma

목표

• 좋아요(Like)가 클릭하면 해당 글의 좋아요 수를 올리기 위한 API

체크리스트

• 좋아요(Like)가 클릭될 시 해당 글의 id 값을 받아 좋아요 수를 갱신

참고

Pull Request test

테스트 입니다.

목표

• 사용자 인증과 보안을 위한 JWT(JSON Web Token) 추가

체크리스트

• JWT(JSON Web Token) 추가
• JWT 추가에 따른 Controller, Service 수정
• Response to JSON 모듈 수정
• Swagger 수정

참고

목표

• 글 생성일자가 최근에 생성된 단위로 필터링을 한 후, 결과를 JSON의 형식으로 응답하는 API 구현

체크리스트

• 글 생성일자가 최근에 생성된 단위로 필터링
• 결과값 JSON의 형식으로 응답

참고

목표

• 좋아요(Like)의 수를 기준으로 정렬한 후, 최상위 5개 글을 반환하는 API

체크리스트

• 좋아요(Like)의 수를 기준으로 정렬
• 최상위 5개 글을 JSON으로 응답

참고

• 전체 회원 조회
• 특정 회원 조회
• 회원 가입
• 회원 탈퇴

목표

passport를 사용하여 사용자 로컬 / 소셜 로그인 구현

체크리스트

• Local 로그인 기능
• Kakao 소셜 로그인 기능
• Github 소셜 로그인 기능
• 회원 가입 / 회원 수정 / 회원 탈퇴
• API 정리

참고

• Passport Reference

react-router-dom 설치

목표

• 회원가입 페이지 생성 및 기능 구현

체크리스트

• Sign Page 생성
• Login Template 재사용
• Welcome Text 재사용
• Login Button Atom 재사용
• 회원가입 Form 컨테이너 생성
• 회원가입 Form Atom 생성

참고

• Figma

이슈 테스트입니다.

목표

• 테스트 용이성을 위해 Controller에 구현되어있는 비즈니스 기능을 Service로 따로 떼어냄

체크리스트

• Controller에 구현되어있는 비즈니스 기능을 Service로 따로 떼어내기
• 이관 후, 기능 작동에 이상 여부 확인하기
• Password Salt 추가

참고

• 위키피디아 - SOLID

목표

Passport로 구현하기 전 사용자 인증을 위한 미들웨어 기능 구현

체크리스트

• 사용자 Authentication 기능
• 커스텀 상태 메시지 Authentication 관련 추가

참고