woowacourse-teams / 2021-pick-git Goto Github PK

구현 기능

• 사용자가 Github 인증을 통해 로그인 할 수 있도록 한다.

작업 내용

• OAuth 로그인하면 Github로부터 AccessToken을 받고, JWT 토큰을 새로 발행하여 key:value 형식으로 저장한다.
• OAuth로 첫 로그인한 유저(회원가입 개념)인 경우 DB에 해당 정보를 저장한다.
• OAuth로 첫 로그인이 아닌 경우 Github에 프로필 정보를 조회하여 DB에 업데이트한다.

주의사항

작업 내용

• 전체적인 엔티티와 DB 설계.
• 설계된 내용대로 엔티티 객체 구현.
• 엔티티 및 값 객체 네이밍 통일.

주의사항

• 이것부터 해야할 듯 합니다..^^ 지금 개판임..

구현 기능

• 페이지 컴포넌트를 구현한다.

주의사항

• 1차적인 구현에 대해서는 실제 api 가 아닌 목업 서버를 이용한다.

작업 내용

proxy 생성을 위한 프로젝트 셋팅

구현 기능

• 사용자가 글을 업로드할 때 선택한 태그를 저장한다.
• 게시글로 저장된 태그를 조회한다.

작업 내용

• 태그를 영속화한다.

주의사항

구현 기능

• 유저 이름 유니크 제약 조건을 추가한다.

작업 내용

• 명확해야 해서 제약 조건을 추가하는게 좋을 것 같습니다.

주의사항

구현 기능

Button 컴포넌트 구현

주의사항

width, backgroundColor, fontSize, shape(round or rect) => props로 받기

구현 기능

ImageUploader컴포넌트

작업 내용

• 이미지를 base64로 변환하는 로직을 포함한다.

주의사항

구현 기능

Chip컴포넌트 구현

작업 내용

• delete버튼을 가질 수 있다.

주의사항

api 명세 제안입니다
미리 캐치를 했어야했는데 뒷북이네요ㅜㅜ

1. response body에 json을 보내줄 때 배열로 보내줄 수 있는건 배열의 형태를 유지하는 거 어떨까요?

• 게시글 조회
  { posts: [{} , {}, …] } => [{}, {}, …]
• public repo
  { [{}, {}, …]} => [{}, {}, …]
• 사용언어태그 가져오기
  { tags: [“”, “”, …] } => [“”, “”, …]

2. 댓글 작성시 response body가 모호한 것 같습니다
   그냥 현재 post에 대한 comment를 보내주면 되지 않을까 싶습니다
   예시)
   [{
   “authorName”: string,
   “content”: string,
   “isLiked”: boolean,
   }]

3. postId와 commentId가 response에 포함되어야 할 것 같습니다

구현 기능

• Comment 컴포넌트를 구현한다.

구현 기능

• 게시물 좋아요 등록
• 게시물 좋아요 삭제

작업 내용

• 비즈니스 로직 추가
• 슬라이스 테스트 + 통합 테스트 작성

작업 내용

• 게시물 작성 redirect URI 수정
  • primary key 반환 -> unique key 반환으로 변경

구현 기능

• 선택한 Github 레포지토리의 사용 언어 태그들을 불러온다.
• 해당 태그들을 클라이언트에게 보여준다.

작업 내용

• OAuth를 사용하여 Resource Owner의 Repository 언어 태그들을 조회한다.

주의사항

구현 기능

CSS Normalize 적용

작업 내용

styled components에서 제공하는 normalize를 활용

주의사항

구현 기능

• #51
• #53
• #54

작업 내용

주의사항

데이터 유출 없도록 인가쪽을 잘 관리할 것.

구현 기능

• svg 파일 추가 및 svg 컴포넌트를 하나의 파일에서 import 해올 수 있도록 설정

있도록 설정

작업 내용

• /src/assets/icons 폴더 추가
• icons 폴더 내부에 svg import 를 위한 index.tsx 추가

주의사항

• svg 컴포넌트 import 는 앞으로 /src/assets/icons/index.tsx 파일만을 대상으로 이루어져야 함

구현 기능

CircleIcon컴포넌트 구현

작업 내용

주의사항

• circle size와 text size를 prop으로 받는다.

구현 기능

• 유저 A가 유저B를 팔로우하거나 언팔로우 할 수 있다.

작업 내용

• 로그인 된 유저에 대해서만 팔로우/언팔로우 기능을 제공한다.
• 로그인 된 유저가 다른 유저에 대해서 팔로우/언팔로우 할 수 있다.
• 유저 A가 이미 유저 B를 팔로우 중이라면 또 팔로우 할 수 없다.
• 유저 A와 유저 B가 팔로우 관계가 아니라면 언팔로우 할 수 없다.
• 유저 A가 유저 B를 팔로우 한다면 유저 A의 팔로잉과 유저 B의 팔로우 갯수가 1씩 증가한다.

구현 기능

• 인증, 인가 구현
  • JWT 사용
  • 실패 시 401

작업 내용

주의사항

작업 내용

• 현재 댓글을 작성할 수는 있어도 이를 저장할 수단이 없으므로(Enter를 누르면 개행이 되어야 함) PostItem 컴포넌트에 댓글 달기 버튼을 추가한다.

작업 내용

• 백엔드 기술 스택에 맞춰 개발 환경을 설정한다.

구현 기능

TextEditor 컴포넌트

작업 내용

• background color를 가질 수 있다.

주의사항

구현 기능

ImageSlider 구현

작업 내용

• 이미지를 슬라이드하면서 볼수 있도록 하는 컴포넌트
• 양쪽 버튼을 통해 슬라이드

주의사항

구현 기능

TextEditor 기능 개선

작업 내용

• 개행할 때 뿐만 아니라 text가 길어져 자동 개행되는 경우도 고려하여 autoGrow 개선

구현 기능

StepHeader컴포넌트 구현

작업 내용

• 이전 페이지와 다음 페이지의 링크를 포함한다.
• 현재 페이지 이름을 포함한다.

주의사항

구현 기능

SearchHeader컴포넌트 구현

작업 내용

• 이전 페이지 링크를 포함한다.
• 검색 인풋을 포함한다.

주의사항

구현 기능

ContributionGraph컴포넌트 구현

작업 내용

주의사항

구현 기능

자동으로 any 로 추론되는 styled-components 의 theme 객체에 타입을 부여한다.

구현 기능

작업 내용

주의사항

• 현재 DDL을 JPA 기반으로 생성하다 보니, 외래키 제약 조건 이름이 constraint ["FK8KCUM44FVPUPYW6F5BACCX25C 와 같이 랜덤하게 생성됩니다.
• 디버깅하기 어렵습니다.

구현 기능

• 파일 업로드 기능을 구현한다.

작업 내용

주의사항

구현 기능

• 계정 소유자의 프로필 클릭 시 기본 프로필 정보를 제공한다.
• 타유저 프로필 클릭 시 기본 프로필 정보를 제공한다.
• 통계 탭 클릭 시 해당 사용자의 Github 통계 정보를 제공한다.

작업 내용

• 계정 소유자의 프로필을 클릭했을 경우
  • 헤더에 있는 토큰 정보로 사용자를 확인한다.
  • 사용자의 정보를 반환한다.
• 타인의 프로필을 클릭했을 경우
  • 저장되어있는 타인의 계정 정보를 반환한다.

주의사항

• 기존에 /{username} API로 타인 계정만 조회하고, 소유자의 계정 조회시 /me API로 조회하도록 API 명세를 추가한다.

구현 기능

• Github Repositories 목록 조회

작업 내용

• Github API를 사용하여 사용자의 Public Repositories 목록 조회

구현 기능

Input컴포넌트 구현

작업 내용

• 아이콘 혹은 아바타를 prop으로 받을 수 있다.
• background 혹은 border-bottom을 갖는다.
• text align은 왼쪽 혹은 가운데 정렬로 한다.

주의사항

구현 기능

• 스토리북 webpack 에 svgr을 적용한다.

기타

• tsconfig.json 의 불필요한 공백 제거

구현 기능

• 파일 업로드 제공
• 파일 링크 제공
• 파일 삭제 제공

구현 기능

• 프론트엔드 개발 환경을 설정한다.

구현 기능

• 게시물 등록

주의사항

• 이미지와 내용이 함께 업로드
• 게시물 내용은 최대 500자

구현 기능

CountIndicator컴포넌트

작업 내용

주의사항

구현 기능

• 댓글 등록
• 댓글 조회

작업 내용

• 생성 시간 및 날짜 기록
• 비즈니스 로직 추가
• 슬라이스 테스트 작성

구현 기능

ImageSlider의 기능을 개선

작업 내용

• 모바일 상에서 좌우 터치 슬라이드 조작시 이미지가 넘어가도록 구현
  -> 스크롤 이벤트는 제거
• buttonKind prop이 stick-out일 경우에 대한 레이아웃 추가

구현 기능

NavigationHeader 구현

작업 내용

• 로고와 네비게이션을 포함
• 네비게이션은 홈, 검색을 포함한다.
• 로그인이 되어 있으면 프로필 링크와 게시물 추가버튼을 보여준다.
• 로그인이 되어있지 않으면 로그인 버튼을 보여준다.

주의사항

구현 기능

Avatar컴포넌트

작업 내용

주의사항

• img size와 text size를 prop으로 받는다.

구현 기능

Tabs컴포넌트 구현

작업 내용

• 두개의 탭을 받는다.

주의사항

구현 기능

PostItem 컴포넌트 구현

작업 내용

• 작성자 정보, 좋아요, 깃헙링크, 좋아요를 포함
• 로그인 여부에 따라 댓글 작성, 좋아요 추가, 취소를 제한

주의사항

작업 내용

• 로그인 기능 리팩토링.
• 로그인 기능 관련 테스트 코드 추가 (단위 테스트 + 인수 테스트)

구현 기능

api layer 추상화

작업 내용

• data fetchgin api 선택(axios or fetch)
• 추상화 수준, 에러처리 수준 결정
• api request 모듈 구현

구현 기능

• 백엔드 프로젝트의 패키지 구조를 도메인 및 웹 계층에 맞게 분리한다.
• 기본적인 엔티티 클래스들을 작성한다.

작업 내용

• 도메인별로 상위 패키지를 구분하고, 세부적으로 웹 계층에 맞는 패키지 구조를 정의한다.
• 엔티티 클래스들의 연관 관게 및 필드명을 정의한다.

주의사항

• 없음

구현 기능

• 이미지 파일만 허용한다.
• 실패 시 415

작업 내용

주의사항

구현 기능

• 게시물 이미지 등록
• 게시물 이미지 조회 (URL)

작업 내용

• AWS S3 구축 및 연동