필터

유저 스토리 추가 (Add User Story)

유저 스토리

• 사용자로서 원하는 제약조건으로 필터링하여 원하는 조건의 상품들만 볼 수 있다.

상세한 설명

• 사용자는 키워드 검색뿐만 아니라 내가 있는 지역, 가격범위, 카테고리, 현재 인기상품등의 조건으로 필터링 된 결과를 제공받을 수 있습니다. 이를 통해 내가 원하는 상품을 더욱 상세한 조건을 통해 검색할 수 있습니다.

선행 이슈 (선택)

• #23 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

완료 조건

• 지역기반 필터링
• 가격범위 필터링
• 카테고리 필터링
• 인기상품 필터링

추가 정보 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• EPIC을 추가하였는가 (선택)
• 유저 스토리를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 유저 스토리를 위한 충분한 완료 조건이 제시 되었는가
• Assignees 를 추가 하였는가
• 적절한 Labels 를 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 필수 요소는 아니나 사용자의 편의를 고려한 추가적인 기능을 제공합니다.

해당 테스크가 왜 필요한가요

• 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 끌어올리기 기능

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

Express JS를 사용하는 프로젝트에서 폴더구조를 통일하여 협업을 용이하게 한다.

기능 배경

Express앱 의 경우에는 비슷한 구성의 서버가 여러번 반복되어 사용됩니다(API 서버). 이 과정에서 팀원들과 하나의 소스코드를 공유하게 되며, 서로 다른 Express앱을 생성하면서 일관적인 개발을 위하여 하나의 폴더구조에 대한 약속이 필요합니다.

우리의 프로젝트는 하나의 레포지토리만 사용이 가능하고, 다은과 같이 하나의 레포에서 서로다른 폴더로 서버의 코드를 분리해야 합니다.

.
├── ApiServer1               //Express Server 1
│   └── package.json
├── ApiServer2               //Express Server 2
│   └── package.json
└── package.json

여러서버를 오가는 과정에서 폴더 구조가 서로 다르면 코드를 이해하는데 큰 노력이 들게 됩니다.

원하는 결과

세명이 하나의 소스코드를 공유하고, 개발시 약속된 적절한 위치에서 작업할 수 있습니다.

원하는 결과를 위한 방법 제시

Express Generator 에서 제공하는 기본 폴더 구조를 활용하는 방법이 가장 생산적일 것 같습니다.

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

환경설정

테스크 추가

테스크 요약

• 일래스틱 서치를 적용하기 위해 데이터베이스와 연결하고, 데이터 동기화 방식을 결정합니다.

해당 테스크가 왜 필요한가요

• 일래스틱 서치를 해당 프로젝트에 이용할 수 있도록 설정합니다.
• 상품 수정/등록에 관련된 API 서버와 분리되어 있기 때문에 상품 정보를 조회할 수 있는 데이터베이스관리 방법을 결정해야 합니다. 데이터베이스 싱크를 유지하기 위해 풀링 방식을 사용하거나 중간서버를 두어서 푸시를 하는 방법등 여러가지가 있습니다. 각각의 장단점이 있으므로 해당 방법에 대해서 결정하고 이에 맞는 관련 설정을 적용합니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 일래스틱과 데이터베이스 연결
• 데이터베이스 동기화
• 인덱스 설정

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

관심 카테고리를 성정한 후 다시 홈에 돌아오고 다시 설정하러 들어가면 기억하고 있지 않음

기대했던 결과

클라이언트가 관심 카테고리를 기억하고 미리 체크하고 있을 것 같았음

버그 재현 방법

1. 홈에서 관심카테고리에 들어간다.
2. 홈으로 돌아간다.
3. 관심 카테고리에 들어간다.

구동 환경

Desktop (아래 정보를 기재해 주세요):

• OS: os x
• Browser chrome

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 상품의 이미지를 전달받아 Object storage에 저장하고 사용자의 환경에 최적화된 이미지를 제공해주기 위한 작업입니다.

해당 테스크가 왜 필요한가요

• 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 상품 이미지 업로드
• 고화질/중화질/저화질 3단계로 나눠서 저장

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

구매자와 판매자가 언제든 다시 찾아와 대화를 이어갈 수 있는 실시간 채팅 서비스를 제공합니다 .

해당 테스크가 왜 필요한가요

Issue #77

원격에서 구매자와 판매자가 대화를 하기 위해 통신이 필요 합니다.
또한, 대화 내용을 기록하고 추후에 다시 제공하기 위해 저장하는 방법이 필요합니다.
마지막으로 이러한 통신과정에서의 메세지를 화면에 노출시킬 방법이 필요합니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 서버와의 소켓 연결
• 과거 메세지 불러오기
• 최신 메세지를 화면에 업데이트
• 채팅방 생성
• 채팅방 메세지 저장

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

네이버 OAuth를 통한 회원 가입

해당 테스크가 왜 필요한가요

사용자로써 해당 사이트 이용을 위해서 회원가입 할 수 있다.

본 서비스를 이용하는데 있어 상품 등록 수정 삭제 및 채팅을 위해서는 인증과정이 필요합니다.
이에 우리는 사용자에게 직접적으로 ID 패스워드 등을 요구하지 않고 네이버의 resource server로 부터 필요한 필수 정보만 받아 오는 OAuth를 도입하기로 결정하였습니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• passport-naver을 이용한 네이버 로그인 프로세스 구현
• 기존의 UserDB에 없는 사용자일때 회원가입 프로세스 진행
• 네이버로부터 필요한 정보를 받은 후 추가적인 정보(권한, zipcode) 요구
  • 권한은 특별한 코드를 입력하면 관리자로 회원가입이 가능한 조건을 추가
• 필수 정보가 모두 입력되었을때 UserDB에 정보가 저장

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

여러 개발자들간의 협업을 원활하게 하기 위해서 공통의 Issue, PR 템플릿을 제안합니다.

기능 배경

현 프로젝트는 Issue를 통한 Feature List 관리하며 Project를 백로그로서 사용하고 있습니다.
github flow를 염두에 두고, 모든 작업에는 Issue를 우선 등록한 뒤 PR을 통해 리뷰를 받고 merge되게 됩니다.

이러한 과정에서 공통의 약속없이 Issue 혹은 PR을 진행하게 되면, 다양한 문제가 발생할 수 있습니다.

• 발행전 최소한의 요구사항을 충족하지 않는 경우(테스트, 문서화, 등등)
• 내용에 무엇을 작성해야 할지 몰라 Issue/PR 작성에 어려움
• 무엇을 위한 Issue/PR 인지 직관적으로 파악하기 어려움

이러한 문제를 해결하기 위해서 공통의 템플릿을 제안합니다.

원하는 결과

원하는 결과를 위한 방법 제시(필수!!)

템플릿은 GIthub에서 기본적으로 제공하는 기능으로서 Markdown 형태로 작성하면, 손쉽게 사용이 가능합니다.
프로젝트의 root dir에 .github의 폴더를 생성 뒤 정해진 규칙에 따라 md 파일을 작성합니다.

추가 정보 (선택)

공식 문서

• https://help.github.com/en/github/building-a-strong-community/configuring-issue-templates-for-your-repository
• https://help.github.jp/enterprise/2.11/user/articles/creating-an-issue-template-for-your-repository/

추천 템플릿

• https://github.com/stevemao/github-issue-templates (edited)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 Labels 를 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

네이버 OAuth를 통한 로그인

해당 테스크가 왜 필요한가요

사용자로써 해당 사이트 이용을 위해서 회원가입 할 수 있다.
OAuth를 통해 로그인 하는데 기존에 회원가입이 된 사용자라면 회원가입 프로세스를 무시하고 곧바로 로그인이 되어야 합니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• OAuth 로그인 시 유저정보를 DB에서 읽은 후 JWT로 저장
• 로그인 후 super user, admin일 경우 이름 옆에 태그 달기

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

유저 스토리 추가 (Add User Story)

유저 스토리

사용자로서 검색엔진의 도움을 받아서 검색어 입력에 도움을 받을 수 있다.

상세한 설명

중고나라, 당근마케에서 중고상품을 검색할 때 사용자의 실수로 인 한 오타, 유사어로 인한 동일 상품이지만 많은 목록을 보기 힘든 경우가 있습니다. 따라서 이러한 불편함을 해소하고자 엘라스틱 엔진을 사용하여 사용자 입력에 대한 오타를 보정하거나 관련된 상품을 제안받을 수 있게 합니다.

선행 이슈 (선택)

• #23 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

완료 조건

• 동의어/연관검색어 제시
• 검색기능
• 오탈자체크
• Elastic Search 환경설정
• MongoDB Transaction 제어

추가 정보 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• EPIC을 추가하였는가 (선택)
• 유저 스토리를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 유저 스토리를 위한 충분한 완료 조건이 제시 되었는가
• Assignees 를 추가 하였는가
• 적절한 Labels 를 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

유저 스토리 추가 (Add User Story)

유저 스토리

• 사용자로서 원하는 제약조건으로 필터링하여 원하는 조건의 상품들만 볼 수 있다.

상세한 설명

• 사용자는 키워드 검색뿐만 아니라 내가 있는 지역, 가격범위, 카테고리, 현재 인기상품등의 조건으로 필터링 된 결과를 제공받을 수 있습니다. 이를 통해 내가 원하는 상품을 더욱 상세한 조건을 통해 검색할 수 있습니다.

선행 이슈 (선택)

• #23 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

완료 조건

• 지역기반 필터링
• 가격범위 필터링
• 카테고리 필터링
• 인기상품 필터링

추가 정보 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• EPIC을 추가하였는가 (선택)
• 유저 스토리를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 유저 스토리를 위한 충분한 완료 조건이 제시 되었는가
• Assignees 를 추가 하였는가
• 적절한 Labels 를 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

git의 명령어 사용 이전에 우리의 규칙에 대한 충족 여부를 확인한다.

기능 배경

Git은 상황에 따라 다양한 Hooks를 제공합니다. Hooks를 활용하면, git을 사용하며 중간 과정마다 우리의 요구사항을 전달할 수 있습니다. 이러한 규칙은 협업을 할 때 실수를 사전에 방지하고, 불필요한 컴퓨팅 자원의 낭비를 방지합니다.

예를 들어, Linter나 Formatter의 경우는 code의 build와는 별개의 문제입니다. build 이전에 확인이 가능하지만, 이를 확인하지 않고 서버에 배포 (혹은 PR)시에 다음과 같은 작업들을 거치게 됩니다. (보통의 CI에서...)

1. 서버를 올린다
2. 서버에 소스 코드를 전달한다
3. 소스코드에 따라 dependencies들을 설치한다
4. build를 한다(혹은 이 전에 linting 체크 가능)
5. linter와 formatter를 확인한다.

위와 같은 상황에서 최악의 경우에는 불필요한 빌드를 하는 시간을 기다린 뒤 (수분 소요될 수 있다) 맨 처음에 할 수 있었던 linter와 formatter를 확인하게 됩니다. 그렇지 않더라도, 최소한의 linter와 formatter를 확인하기 위해서는 3번까지의 작업을 수행해야 하므로 이 또한 시간과 컴퓨팅 자원을 낭비하는 일입니다.

애초에 변경사항을 commit 하고 push하기 이전에 확인할 수 있다면, 미연에 위와같은 낭비를 방지할 수 있습니다.

원하는 결과

다음과 같은 상황에서 우리의 코드를 검증합니다.

[코드를 커밋하기 이전에]

1. Linter, Formatter 의 규칙을 따랐는가
2. master, 나 기타 push 하면 안되는 브랜치에서 commit을 하고 있지는 않은가
3. test를 모두 성공 하였는가

[커밋 메세지를 작성 할 때]

4. commit log를 규칙에 맞춰 작성하였는가

원하는 결과를 위한 방법 제시

전반적으로 git hooks에 대한 액션을 취하기 위해서 우리는 husky를 사용하여 관리합니다. 별도의 script 폴더를 생성하여 각 stage마다 발생해야 하는 액션을 관리할 수 있습니다.

위 원하는 결과에서, 2번 push하면 안되는 브랜치에 대해서는 issue #3 에서 언급하고 있는 내용을 참고하시길 바랍니다.

4번의 커밋 메세지 작성시에는 우리의 경우 다음 자료를 기반으로 작성합니다. 이를 위하여 commitlint와 lint-staged를 사용하여 검증할 수 있습니다.

우리는 다음과 같은 커밋 로그 작성 규칙을 활용하여 검증합니다.

type(scope?): subject  #scope is optional

chore: run tests on travis ci # example

마지막으로, 위 1 ~ 4번의 내용중 하나라도 충족하지 못한경우, commit은 이루어지지 않습니다.

고려할만한 대안 (선택)

• git hooks를 직접 관리한다.

추가 정보 (선택)

commit 단계가 아니라 push 단계에서 한번에 linter와 formatter를 확인할 수 있을 것 같습니다. 그러나 이 경우에 수개의 commit이 쌓이면, 이에대한 부채가 쌓여가서 한번에 수정하기 버거운 상황이 발생하게 됩니다. 조금 더 짧은 주기로 피드백을 진행하기 위해 commit 이전에 hooks를 연결하였습니다.

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

지역 기반 검색

테스크 추가

테스크 요약

지역 기반 검색을 이용하여 사용자가 원하는 지역에서의 거래글을 탐색할 수 있습니다.

사용자는 한정된 지역 범위내에서의 상품에 대한 정보를 제공받을 수 있습니다.

해당 테스크가 왜 필요한가요

중고거래의 특성상, 신뢰의 문제로 인해 직거래를 선호하는 경향이 있습니다. 이런 상황에서 판매자는 자신의 직거래 판매 범위를 한정하고, 구매자는 자신이 직거래를 위하여 찾아갈 수 있는 범위를 지정함으로서 보다 더 맞춤화된 검색결과를 제공할 수 있습니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 일라스틱서치 혹은 몽고 DB선택
• 위에서 정한 DB연결
• 기능 구현
• API 제공

추가 설명 (선택)

일라스틱 서치의 Geo queries를 사용해 볼 수 있습니다.

또, mongoose에서 제공되는 좌표 기반 검색을 활용할 수 있습니다. mongoose geojson

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

오탈자 보정

테스크 추가

테스크 요약

• 사용자가 '갤럯7'와 같이 특정 단어를 빼먹거나 '모지'와 같이 'ㅏ'를 'ㅣ'로 잘못 입력하는 경우 검색어가 없을 경우 검색어를 다시 수정하는 과정을 최소화하기 위해 특정한 경우 오탈자를 보정하여 검색결과를 제공합니다.

해당 테스크가 왜 필요한가요

• 사용자로서 검색엔진의 도움을 받아서 검색어 입력에 도움을 받을 수 있다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 어떤 경우에 오탈자를 보정하는가에 대한 결정
• 사용자가 자주 입력하는 오탈자와 정정 단어 데이터 수집

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

• 현재 product-api에서 MongoDB 연결 실패시 서버가 종료되는 것으로 구현되어 있습니다.
• 현재로써는 마땅한 좋은 방법이 생각나지 않고 시간이 많이 소요될 것으로 예상돼서 이렇게 처리했는데 추후에 좋은 방법이 생각나면 반드시 수정되어야 하는 상황이라고 생각합니다.
• 추가적으로 현재 mongoose의 timeout이 전혀 동작하지 않습니다. 이에 대한 해결방안도 필요합니다.

기대했던 결과

• DB 연결 실패시 3번 내외 재시도 후 그래도 실패하면 특정한 방법으로 에러 처리

버그 재현 방법

1. 그냥 DB 끄고 서버 실행하면 서버 꺼집니다.

구동 환경

• 코드 자체의 문제로 구동환경과 무관합니다.

Desktop (아래 정보를 기재해 주세요):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (아래 정보를 기재해 주세요):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

현재 상품 등록 기능이 완전하지 않아 상품 목록에 반영 되지 않은 것 같습니다. 등록을 하면 리스트에 보이면 좋을 것 같습니다.

기능 배경

상품의 이름 가격 사진 설명을 입력한 후에 등록을 누르면 어떤 인터렉션도 없어서 등록을 했는지 알 수 없었고 실제 리스트에 반영된 것 같지 않습니다. 기능 등록이 되면 좋을 것 같습니다.

원하는 결과

등록을 누르면 팝업 혹은 모달로 등록이 완료 되었다는 창이나오고 일정 시간이 지나면 (충분히 짧은) 상품 리스트로 가면 좋을 것 같습니다.

원하는 결과를 위한 방법 제시

const [on, setOn] = useState(false)

function uploadHandler (event){
// 파일을 업로드하는 페치 요청
    setOn(true)
    setTimeout(()=>{
        window.location.href("상품 리스트")
    }, 1000)

}

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 상품의 목록을 DB에서 관리하기 위한 설계, 설정 및 초기 데이터 추가작업입니다.

해당 테스크가 왜 필요한가요

• 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 상품 테이블 설계
• mongoose 설정 및 migration

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

채팅방에 여러명이 존재할 경우, 채팅이 중복되서 나오는 오류가 있습니다.
자신의 브라우저에서만 채팅이 중복되서 나타나는 오류도 존재합니다.

기대했던 결과

한번의 채팅을 치면 하나의 메시지만 나오기를 기대합니다.

버그 재현 방법

1. 채팅방에 입장 (1, 2)
2. 다른사람도 채팅방에 입장. (동일한 1, 2)
3. 채팅

누군가는 중복되서 채팅이 보이고, 누군가는 채팅이 중복되서 보이지 않습니다

구동 환경

Desktop (아래 정보를 기재해 주세요):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (아래 정보를 기재해 주세요):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

기대했던 결과

상품이 등록될 줄 알았어요.

버그 재현 방법

1. 글쓰기 클릭, 서버 장애가 있다는 팝업 무시
2. 상품 등록
3. 확인 누르면 나옵니다.

구동 환경

Desktop (아래 정보를 기재해 주세요):

• OS: [e.g. iOS] 맥
• Browser [e.g. chrome, safari] chrome
• Version [e.g. 22] 22

Smartphone (아래 정보를 기재해 주세요):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

유저 스토리 추가 (Add User Story)

유저 스토리

사용자로써 해당 사이트 이용을 위해서 회원가입 할 수 있다.

상세한 설명

사이트 이용을 위한 회원가입 및 로그인 인증 프로세스 입니다.
팀 회의를 통해 인증은 Naver OAuth만을 이용하기로 결정했습니다.
네이버의 Resource Server로 부터 필요한 정보만을 전달받아 UserDB에 저장합니다.

선행 이슈 (선택)

사이트를 이용하기 위한 최우선 조건이므로 선행이슈는 없습니다.

완료 조건

• 네이버 OAuth를 통한 회원 가입
• 네이버 OAuth를 통한 로그인

추가 정보 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• EPIC을 추가하였는가 (선택)
• 유저 스토리를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 유저 스토리를 위한 충분한 완료 조건이 제시 되었는가
• Assignees 를 추가 하였는가
• 적절한 Labels 를 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

Object Storage를 각각의 서버에서 동작할 수 있는 메소드 구현

기능 배경

중고거래에 있어서 제품의 상태를 확인할 수 있는 이미지, 동영상 정보가 필요합니다. 이러한 데이터들은 비정형 데이터로써 정형데이터를 저장하는 방식보다 클라우드 서비스에서 제공하는 Object Stroage를 이용하여 비정형 데이터를 관리하는 것이 좋다고 생각되어 제안합니다.

Object Storage를 사용함으로써 데이터가 '어디에-어떻게-저장되는지' 관리나 통제할 필요 없이 저장이 가능하다는 장점이 있고, 저장된 데이터를 사용할때에도 고유 식별번호를 통해 바로 접근이 가능하다는 이점이 있습니다.

원하는 결과

• Object Storage 를 구축하고 이 storage에 저장, 수정, 삭제, 조회가 가능한 모듈 구축(혹은 사용)하여 다른 서버에서 즉시 사용가능한 메소드(객체, 클래스 등) 구축
• Object Stroage에 저장된 파일의 고유 식별번호를 담을 데이터베이스(필요시)

원하는 결과를 위한 방법 제시

• nCloud Object Storage API 설명서 를 참조하여 서비스별로 bucket를 생성하고(혹은 생성할 수 있는 메소드를 만들어도 됩니다.) bucket 에 업로드, 삭제, 조회를 할수 있는 메소드를 만들면 됩니다.

고려할만한 대안 (선택)

• AWS S3

추가 정보 (선택)

• nCloud Object Storage API 설명서
• Object Storage 개념
  • nCloud 설명서
  • IBM Developer 오브젝트스토리지는 무서인가?

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

• 지속 통합 배포를 위한 CI/CD 툴 선정 및 설정할 것을 제안합니다.

기능 배경

• 애자일과 스크럼의 철학을 실현하기 위해서는 일일 배포 및 테스팅 작업이 필요로 합니다. 그러기 위해 자동화된 툴을 공부하고 사용함으로써 프로젝트를 통합 관리하고자 합니다.

원하는 결과

• 자동 빌드 및 테스팅 배포 환경 설정

원하는 결과를 위한 방법 제시

• 자동화된 도구를 이용, 혹은 직접 만들어서 일일 배포 및 테스팅을 할 수 있다면 어떤 방법이라도 무관합니다.

고려할만한 대안 (선택)

후보 툴

1. Github Actions
2. Jenkins
3. NCloud SourceDeploy

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 키워드로 검색시 동의어 목록 및 연관검색어를 추천검색어로 제시해 줍니다.

해당 테스크가 왜 필요한가요

• 사용자로서 검색엔진의 도움을 받아서 검색어 입력에 도움을 받을 수 있다.
• 상품을 검색하면 같은 상품이 다른 이름으로 등록되는 경우가 있습니다.
  (ex IPhone === 아이폰 === iphone)
• 상품검색시 다른 사용자가 어떤 검색어를 같이 검색했는지 연관 상품을 제시해 줌으로써 사용자의 선택의 폭을 넓혀줍니다

해당 테스크를 위해 무엇을 어떻게 할건가요

• 네이버 혹은 구글 크롤링을 통해 동의어 및 연관검색어 정보 가져오기
• 키워드로 검색시 추천검색어 제공

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

Git에서 사용될 branch의 이름에 대한 규칙을 정합니다

기능 배경

우리의 프로젝트는 Git를 중심으로 Source code의 version을 관리합니다. 또한, Git의 특정 branch를 중심으로 CI를 구현 하는 상황을 기획하였습니다.

CI를 트리거 하는 특정 브랜치들과(트리거 브랜치), 각각의 트리거 브랜치에 대한 추가 브랜치(기능 개발 브랜치)들이 계속하여 생성되게 됩니다. 이 과정에서 넘치는 브랜치들의 혼란을 정리할 수단이 필요하여 제안하였습니다.

원하는 결과

• push하지 말아야 할 branch prefix를 정한다
• 기능 구현을 위한 branch prefix를 정한다

원하는 결과를 위한 방법 제시

push 하지 말아야 할 branch로는 다음과 같은 브랜치들이 있습니다.

• master 브랜치
• 각각의 독립된 기능에 대한 브랜치 (주로 하나의 서버이며, 하나의 폴더로 관리)

이 브랜치들은 PR이나 자동화된 방법을 통해서만 코드의 변경사항이 반영되어야 합니다.

기능 구현을 위한 브랜치는 위 push하지 말아야 할 브랜치에서 파생된 브랜치 입니다.
이 브랜치에서 작업되는 코드들은 작업중에 있음을 알 수 있으며, merge시에 삭제됩니다.

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

개발중에 공통의 코드 스타일을 적용하고자 Linter 와 Formatter에 대한 설정을 추가 & 적용 합니다.

기능 배경

협업시에 코드리뷰, 혹은 코드 유지보수를 위하여 다른 이들이 작성한 코드를 보게 되는 경우가 많습니다. 이때 상대방의 코드에 대한 의도를 빠르게 파악하기 위해서 공통의 코드 스타일에 대한 약속이 필요합니다.

원하는 결과

코드를 작성하는데 있어 공통의 스타일 규칙(Linter), 코딩 규칙(Linter), 그리고 포맷팅(Formatter에) 등 을 지원해야 합니다. 이러한 검증 과정은 자동으로 이루어 지며, 만족되지 않을시에 자동으로 수정이 됩니다.

원하는 결과를 위한 방법 제시

Linter를 위하여 ESLint를 사용하고, Formatter를 위하여 Prettier를 사용합니다.

각각의 팀원이 사용중인 IDE에서 Formatting을 자동적으로 적용하도록 하고, Linter에 대한 안내문구를 IDE 내부에서 보여주게 합니다.

마지막으로, commit하기 전과 배포한 뒤 Linter와 Formatter에 대한 검증을 진행하게 됩니다.

ESLint의 스타일은 유명한 Airbnb 를 적용합니다.

마지막으로, Express 와 React 앱에서 서로 다른 linter 규칙을 적용할 수 있도록 환경 설정이 필요합니다.

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

http://10.180.170.175:3000/write 로 들어갔을 떄 아무것도 표시되지 않습니다.

기대했던 결과

글쓰는 화면이 나올줄 알았어요 ㅠ

버그 재현 방법

1. 메인에서 하단에 펜 모양아이콘을 누른다.
2. http://10.180.170.175:3000/write 로 접속한다.
3. 아무것도 안보인다.

구동 환경

Desktop (아래 정보를 기재해 주세요):

• OS: [MAC]
• Browser [Chrome
• Version [e.g. 22]

Smartphone (아래 정보를 기재해 주세요):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

가격 아래에 동작하지 않는 가로스크롤이 있습니다!
옆에 제안 받기 글자도 깨지고 있어요

기대했던 결과

가로 스크롤이 없거나 가로스크롤이 동작해 제안 받기가 짤리지 않는다.

버그 재현 방법

1. 들어갔더니 나왔습니다.

구동 환경

Desktop (아래 정보를 기재해 주세요): Whale Browser

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (아래 정보를 기재해 주세요):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

인기상품

테스크 추가

테스크 요약

• 처음 사이트에 접속했을 때 사용자가 어떤 상품이 인기가 많은지 확인할 수 있도록 인기상품 목록을 검색합니다.

해당 테스크가 왜 필요한가요

• 사용자로서 원하는 제약조건으로 필터링하여 원하는 조건의 상품들만 볼 수 있다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 인기상품 판결 기준 설정( 예 : 찜횟수 + 조회수)
• 인기상품 목록을 빠르게 불러올 수 있도록 캐싱

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

검색

테스크 추가

테스크 요약

• 구매자가 원하는 상품을 키워드를 통해 검색 시 해당하는 결과를 제공합니다.

해당 테스크가 왜 필요한가요

• 사용자로서 검색엔진의 도움을 받아서 검색어 입력에 도움을 받을 수 있다.
• 게시판으로서 기본기능으로서 키워드를 포함하는 항목을 검색할 수 있어야 합니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• Elastic Search를 이용하여 해당 인덱스의 값을 출력
• GUI를 통한 사용자로부터 검색어를 입력받고 실제 검색결과 출력

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

동일한 환경에서 구동하기 위한 dockerfile을 설정하고 base image를 설정 및 생성합니다.

기능 배경

새로운 서버를 추가하거나 다시 새롭게 만들게 될 때 현재 우리가 개발하고 있는 환경에 맞는 설정하는 과정이 반복됩니다. 이 과정을 최소화 하기 위해 docker를 사용하고, 컨테이너를 사용하기 위한 기본 템플릿이 필요하다 생각되어 제안합니다.

원하는 결과

• dockerfile
  • docker를 사용하기 위한 기본 OS(From 인스트럭션)
  • RUN인스트럭션
  • CMD인스트럭션(컨테이너가 시작할 때 한번 실행되는 것)

원하는 결과를 위한 방법 제시

• dockerfile 관련 설정
  • dockerfile reference
  • 언어 관련 설정

고려할만한 대안 (선택)

• What are the best host OSes for Docker?

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

유저 스토리 추가 (Add User Story)

유저 스토리

구매자로서 판매자의 중고 상품을 구매하기 위해 대화를 시작할 수 있다

상세한 설명

구매자의 입장에서 판매자가 올린 상품에 대해 문의/흥정 등을 진행하기 위해 개인적인 소통이 필요하기도 합니다. 댓글과 같이 다른 이에게도 노출될 수 있는 소통 채널 보다는 1:1로 private하기 위한 소통 공간이 필요합니다.

완료 조건

통신

• 서버와의 소켓 연결
• 과거 메세지 불러오기
• 최신 메세지를 화면에 업데이트
• 채팅방 생성
• 채팅방 메세지 저장

채팅 UI/UX

• 사용자의 최신 메세지를 확인할 수 있도록 스크롤 조절
• 무한 스크롤
• 메세지 좌우 정렬을 통해 식별
• 메세지 작성 시간 노출
• 같은 날에 작성된 메세지 분류 (section)

인증/권한

• 허가된 사용자만 입장할 수 있는 로직

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• EPIC을 추가하였는가 (선택)
• 유저 스토리를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 유저 스토리를 위한 충분한 완료 조건이 제시 되었는가
• Assignees 를 추가 하였는가
• 적절한 Labels 를 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

클라우드 서비스를 이용하여 서비스를 배포할 수 있도록 기본적인 설정을 합니다

기능 배경

우리는 이번 프로젝트에서 NCloud를 사용하여 클라우드 환경을 구축하게 됩니다.

NCloud를 각각의 Local 환경에서 코드로서(CLI) 구축, 생성 할 수 있도록 하기 위해서 권한과 관련된 설정이 필요합니다. 또한, 이러한 권한은 CI 혹은 CD의 상황에서 권한을 전달할 수 있어야 합니다. (빌드등을 진행하기 위해서) 이 밖에도 권한을 설정하여 다양한 상황에서 활용 가능하도록 합니다.

클라우드 환경을 사용하여 도메인을 구입 & 연결을 하는 작업이 필요합니다. 기본적으로 제공하는 url에서 벗어나 우리의 도메인을 사용하게 된다면, 일일 배포시 하나의 고정된 주소를 프로젝트 동안 유지할 수 있습니다. 이 과정에서 HTTPS 에 대한 인증을 추가하는 방법도 고려할 수 있습니다.

마지막으로, 우리가 사용하게 될 중심 컴퓨팅 서비스 (Ncloud: Server, AWS: EC2)에 대한 설정이 필요합니다. 최초 생성한 서버는 빈 깡통과 같은 상황으로서 외부로의 연결등의 작업이 선행되어야 서버를 사용할 수 있습니다.

원하는 결과

기능 개발시에, 부가적인 클라우드 설정 없이 바로 서버를 사용할 수 있습니다.
기능 개발 이후에, 일일 배포를 수행하며 통일된 주소를 사용할 수 있습니다.

원하는 결과를 위한 방법 제시

Ncloud의 공식 문서에 자세한 활용 방법이 안내되어 있습니다.

작업해야 할 중요한 체크리스트는 다음과 같습니다.
(추가적으로 필요한 내용은 댓글로 부탁드립니다.)

• 도메인 구입
• HTTPS를 위한 SSL 인증서
• Server 구입
• Server 포트 포워딩
• Server 포트 사용 허용 (http, ssh등)
• 권한을 갖는 유저 생성
• 서비스 단위로 허용되는 권한 설정
• 초기 쉘 스크립트 작성(필수 패키지 설치, 자동 배포 스크립트 등)

고려할만한 대안 (선택)

• AWS

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

모바일 가로화면일 때 등록버튼 아래에 TextArea가 이미지처럼 깔려있어요.

기대했던 결과

등록이 화면에 맞게 맨 아래에 있고, 그 위에 TextArea가 있다.

버그 재현 방법

1. 모바일 가로화면으로 해당 페이지에 접근한다.

구동 환경

Desktop (아래 정보를 기재해 주세요): Whale Browser

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (아래 정보를 기재해 주세요):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

존재하지않는 페이지가 있음 (chat, info, write)

기대했던 결과

페이지가 나타날 것 같은데 없었다.

버그 재현 방법

1. main => 바텀 네비게이션 버큰 클릭

구동 환경

Desktop (아래 정보를 기재해 주세요):

• OS: OS X
• Browser 크롬

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

구매자에게 구매 의사가 있는 범위를 한정하여 검색 결과를 받아볼 수 있는 기능을 제공합니다.

해당 테스크가 왜 필요한가요

중고거래의 특성상 물건의 판매가는 다양한 범위를 갖습니다. 이러한 상황에서 구매자는 적절한 판매가를 찾기위해 여러 상품을 둘러보며 구매 가능성이 희박한 상품들이 결과에 포함되곤 합니다. 이러한 불필요한 검색결과를 제거하고, 사용자에게 맞춤된 정보를 제공하기 위하여 필요합니다.

참고 이슈 : #47

해당 테스크를 위해 무엇을 어떻게 할건가요

• 원하는 가격범위 검색
• 최소 비교 가격 단위 선택(10원, 100원, 1000원 등)
• 비정상적인 가격범위 탐지 (ex: -1000원 ~ 1000원 또는 1000원 ~ 500원)

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 상품의 이미지를 전달받아 Object storage에 저장하고 사용자의 환경에 최적화된 이미지를 제공해주기 위한 작업입니다.

해당 테스크가 왜 필요한가요

• 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 상품 이미지 업로드
• 고화질/중화질/저화질 3단계로 나눠서 저장

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

기대했던 결과

아래로 당기면 새로운 데이터가 로드될 줄 알았어요

버그 재현 방법

1. 메인화면 접속
2. 화면을 아래로 당김
3. 프로그레스바가 깜박이며 나타남

구동 환경

Desktop (아래 정보를 기재해 주세요):

• OS: [mac os]
• Browser [chrome]
• Version []

Smartphone (아래 정보를 기재해 주세요):

• Device: [아이폰 xs]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

버그 신고 (Bug Report)

어떤 버그가 존재하나요?

같은 유저가 접속을했을때 채팅이 여러번 표현됩니다.
물론 테스트용 계정이라 그랬겠지만
아까 확인하신 것처럼 DB, socket 등등의 이슈가 겹쳐 있는 것 같습니다.

추가적으로, 제 컴퓨터에서는 4번씩 나오고 다른 사람 컴퓨터에서는 2번씩 나오는등 랜덤하게 발생하는 이슈도 있는 것 같습니다.

기대했던 결과

매끄러운 채팅이 하고 싶었어요 ㅠ

버그 재현 방법

1. 채팅방에 접속한다. (아이디 1,2)
2. 채팅을 한다.

구동 환경

Desktop (아래 정보를 기재해 주세요):

• OS: [Mac]
• Browser [Chrome]
• Version [e.g. 22]

Smartphone (아래 정보를 기재해 주세요):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

추가 정보 (선택)

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 한 번 더 재현 방법을 실행 해 봤는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

React JS를 사용하는 프로젝트에서 폴더구조를 통일하여 협업을 용이하게 한다.

기능 배경

리액트의 경우에 팀원 전체가 하나의 소스코드를 공유합니다. 각각 다른 방법으로 리액트 프로젝트 생성시에 폴더 구조의 차이로 인하여 복잡함이 증가할 수 있습니다.

예를들어 컴포넌트를 관리하기 위해 누군가는 container, components 라는 두개의 폴더로 분리하는 반면, 누군가는 components 라는 하나의 폴더만을 사용할 수 있습니다.

React에서 폴더 구조에 대해서 강제하는 하나의 방법이 없고, 이를 통일할 필요가 있습니다.

원하는 결과

세명이 하나의 소스코드를 공유하고, 개발시 약속된 적절한 위치에서 작업할 수 있습니다.

원하는 결과를 위한 방법 제시

React JS를 사용한 다양한 프로젝트를 참고하여 폴더 구조를 정의합니다.
추가 정보에 참고할 만한 자료들을 추가 하였으며, 댓글을 통하여 부가적인 자료를 올려주셔도 됩니다.

추가 정보 (선택)

벨로퍼트님의 velog 프로젝트의 github 레포입니다

• velog

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

구매자와 판매자간의 채팅을 원활하게 제공하기 위한 UI/UX 에 대한 내용을 포함합니다.

해당 테스크가 왜 필요한가요

Issue #77

적절한 UI/UX를 통하여 구매자와 판매자가 직관적으로 대화를 나누고, 그 과정에서 거래를 활발하게 진행할 수 있도록 장려합니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 사용자의 최신 메세지를 확인할 수 있도록 스크롤 조절
• 무한 스크롤
• 메세지 좌우 정렬을 통해 식별
• 메세지 작성 시간 노출
• 같은 날에 작성된 메세지 분류 (section)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

유저 스토리 추가 (Add User Story)

유저 스토리

유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

상세한 설명

• 중고거래에 있어서 가장 핵심적인 기능으로써, 상품목록을 확인할 수 있는 수단이 필요합니다. 이에 일반적인 게시판 기능을 구현하되, 구매자에게 상품의 추가적인 정보를 제공합니다. 따라서, 상품 상태가 확인 가능한 이미지 저장소를 관리할 수 있는 기능을 구현하고, 부가적으로 상품 거래 상태, 제품의 상태, 가격정보등 물건 거래에 필요한 정보를 확인할 수 있어야 합니다.

• 데이터베이스는 마이크로 서비스 아키텍처를 따르기 위해 테이블을 별도로 분류하여 구현합니다. (ex: 상품테이블은 상품관리 서비스에만 존재, 유저 정보는 유저관리 서비스에만 존재, 추후 각각의 정보는 api를 통해 연동)

선행 이슈 (선택)

• 인증
  • 상품 수정, 삭제, 등록기능은 회원인 경우만 동작합니다. 우선순위에 따라 해당 기능은 목업으로 구현하고 추후 인증기능 구현시 연동합니다.

완료 조건

• 상품 테이블 설계
• Sequelize 설정
• 상품 이미지 업로드
• 상품 상세 조회
• 상품 등록
• 상품 삭제
• 상품 수정
• 상품 목록 조회
• 끌어올리기 기능 구현

추가 정보 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• EPIC을 추가하였는가 (선택)
• 유저 스토리를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 유저 스토리를 위한 충분한 완료 조건이 제시 되었는가
• Assignees 를 추가 하였는가
• 적절한 Labels 를 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

Express JS에서 원격에서 발생하는 에러를 추적하기 위한 도구 삽입

기능 배경

우리는 Express JS를 API 서버로서 사용하고 있습니다. Express JS는 local에서 개발되어 외부 클라우드 서버로 배포 되며, 배포 이후에는 로컬에서 제공받던 에러 수집과 같은 형태의 지원을 제공받기 어렵습니다. (디버깅 도구) 만약 에러 수집을 기본적으로 제공하더라도 이를 조회하기 위하여 원격에 있는 서버에 주기적으로 접근 하여 (SSH 등) 확인하여야 합니다.

클라우드 세상에서 서버는 필요에 따라 Scale out을 하기도 하고, 이 과정속에서 서버가 생성되고 삭제되기를 반복합니다. 주로 Image를 통하여 container의 형태로 서버를 구성하고, 이렇게 단명하는(ephemeral) 서버의 특성상 내부에 존재하는 로그들도 같이 삭제되곤 합니다. 즉, 운영되고 있는 서버에서 수집한 로그를 중앙으로 모으는 작업을 하지 않는다면, 서버와 함께 소멸될 수 있습니다.

이러한 번거로움을 방지하기 위하여 중앙에서 모든 Express JS에서 발생하는 에러를 수집하고 추적할 수 있는 도구를 접목하고자 합니다.

원하는 결과

여러대의 Express Server에서 발생하는 에러와 기타 로그들을 한곳으로 수집하여 관리하고 싶습니다.

원하는 결과를 위한 방법 제시

Issue #7 와 동일한 라이브러리인 Sentry를 사용하고자 합니다.

에러 추적에 사용되는 도구를 통일함으로서 개발의 생산성을 올리도, 관리를 용이하게 합니다

이 과정에서, React JS에서는 Error Boundaries 를 통하여 에러를 수집하였다면, Express JS에서는 다음과 같은 흐름으로 에러를 수집 & 처리 하고자 합니다.

Some module throws an error 
-> API router catches the error 
-> it propagates the error to the middleware

고려할 만한 대안 (선택)

• Rollbar
• Raygun

추가 정보 (선택)

• node best practices
  • node 에서 사용되는 베스트 프렉틱스들을 모아둔 레포입니다.

추가적으로 고려할 만한 대안이나, Sentry 이외의 라이브러리 사용을 원한다면 comment 부탁드립니다.

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 게시판으로서 기본 기능인 상품의 CRUD를 위한 작업입니다.

해당 테스크가 왜 필요한가요

• 유저로서 물품의 구매를 위하여 상품조회가 가능하고, 판매를 위하여 제품의 등록 수정 삭제할 수 있다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 상품 상세 조회
• 상품 등록
• 상품 삭제
• 상품 수정
• 상품 목록 조회

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

대화에 참여하는 구매자와 판매자만이 입장할 수 있도록 로직을 작성합니다.

해당 테스크가 왜 필요한가요

Issue #77

구매자와 판매자간의 1:1 채팅이므로, 이를 위해 허가된 사용자만 접근할 수 있어야 합니다. 이를 위해서 서버/클라이언트 모두 방어적인 로직이 필요합니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 허가된 사용자만 입장할 수 있는 로직

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 사용자가 원하는 카테고리의 상품들만 제공해 줍니다.

해당 테스크가 왜 필요한가요

• 사용자로서 원하는 제약조건으로 필터링하여 원하는 조건의 상품들만 볼 수 있다
• 무분별하게 많은 정보가 아닌 사용자는 카테고리에 따른 상품 목록들만 제공 받을 수 있어야 합니다. 이를 통해 원하는 카테고리 내의 다양한 선택지를 제공 받을 수 있습니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 카테고리에 따라 필터링된 목록을 제공

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

React JS에서 사용자의 브라우저에서 발생하는 에러를 추적하기 위한 도구 삽입

기능 배경

우리는 프로젝트에서 React JS 를 바탕으로 생성된 애플리케이션을 사용자에게 FE로서 제공합니다. React JS는 Single Page Application(SPA)로서, 사용자에게 애플리케이션 구동을 위하여 필요한 모든 파일을 전달한다는 특징이 있습니다. 이렇게 전달된 파일에는 HTML, JS, CSS등 웹 브라우저에서 화면을 랜더링하기 위하여 필요한 도구들을 포함하고 있으며, 추가적인 정보는 외부 API를 통하여 요청 & 표현 하게 됩니다.

SPA의 특성상 실행되는 코드(JS, React)와 이에 대한 결과 모두 사용자의 브라우저에서 존재하게 됩니다. 그러므로 SPA가 한번 배포되어 사용자에게 전달되면, 이 애플리케이션에 대한 제어권은 저희(개발자)의 손을 벗어나게 됩니다.

이는 서비스 이용에 전혀 문제가 없는 형태이며, 이상한 점도 없지만 에러 발생시에 그 추적이 어렵게 됩니다.

개발자 모드에서 React JS를 개발하게 되면, 다양한 debugging 도구를 통하여 오류를 검출하고 개선하게 됩니다. 또한, 테스트를 통하여 어느정도 품질에 대한 자신감을 부여할 수 있습니다. 다만, 아무리 잘 작성된 테스트라 하여도 사용자의 모든 사용 패턴을 포함할 수 없고, 예상치 못한 에러는 항상 존재하는 문제 입니다.

위에서 언급한 배포된 React앱의 경우, 사용자에게 전달된 시점에서 서술하였듯이 다양한 에러가 발생 할 수 있지만, 이를 개발자의 입장에서는 알 수 없습니다. 최악의 경우에는 사용자 브라우저에서 앱이 완전히 정지(crash되어) 되어도 개발자는 전혀 알 수 없으며, 이 상황에 대한 자발적인 사용자의 "오류 신고"가 제공될 때 까지 오랜 시간이 소요될 수 있습니다.

사용자에서 발생하는 주요하고 긴급한 에러와 여러 크고 작은 에러들을 수집하고, 이를 관리 & 분석 하여 서비스를 개선 시킬 수 있는 방법이 필요합니다.

원하는 결과

사용자에게 전달된 React JS 에서 발생하는 에러들을 실시간에 가깝게 통보받을 수 있고, 다양한 분석 도구를 포함하여 빠른 서비스 개선을 가능토록 합니다.

원하는 결과를 위한 방법 제시

Sentry

상용화된 도구이자, 오픈소스 도구인 Sentry를 사용하는 방법을 제안합니다.

Sentry provides open-source and hosted error monitoring that helps all software
teams discover, triage, and prioritize errors in real-time.

이 도구는 ReactJS에 손쉽게 삽입할 수 있는 구체적인 공식 문서를 제공하여 빠른 사용이 가능하게 해줍니다.
또한, 디버깅을 위한 다양한 도구들과 시각화 도구를 제공합니다.

고려할만한 대안 (선택)

React 16 Error Boundaries

React JS의 v16 부터는 Error Boundaries라는 기능을 제공합니다. 이 기능을 통하여 우리는 중앙에서 ReactJS에서 발생된 다양한 에러들을 중앙에서 수집할 수 있습니다. 수집된 에러를 우리의 에러 수집 공간으로 보내어 관리할 수 있습니다.

다만, 이 방식을 사용하면 별도의 분석 & 시각화 도구가 필요합니다.

Try / Catch

React JS의 공식문서에 언급되어 있듯이, try/catch는 imperative 스타일의 코드에서 사용 됩니다. 반면, React JS는 declarative 한 스타일을 제공하여 try/catch의 에러 처리 방식이 적합하지 않습니다.

다만, 컴포넌트 내부에서 외부 통신등과 같은 상황은 try/catch 로 에러를 수집하여 외부로 전송하는 방법을 사용할 수 있습니다.

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

유저 스토리에 포함되는 세부 체크리스트(테스크)를 별도의 이슈로 관리합니다.

기능 배경

우리가 유저 스토리로 이슈를 만드니,
프로젝트(백로그)에 하나의 큰 유저 스토리가 덩어리로 들어가서 시간과 우선순위 측정이 어려운것 같습니다.

원하는 결과

• 작업별 우선순위를 지정할 수 있습니다
• 작업당 작업을 하는자(Assignees)를 지정하기 수월합니다.
• 이슈를 다는데 추가 시간이 소요됩니다

원하는 결과를 위한 방법 제시

하나의 큰 유저스토리를, 세부 테스크에 해당하는 이슈로 쪼개어 관리합니다.

고려할만한 대안 (선택)

프로젝트의 노트 를 추가하는 기능으로 테스크를 분류하는 방법.

• 작업별 우선순위를 지정할 수 있습니다
• 작업당 작업을 하는자(Assignees)를 지정하기 어렵습니다.
• 빠른 시간내에 추가할 수 있습니다.

추가 설명

다음 댓글에서 문제가 제기 되어 추가되었습니다.

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가

테스크 추가

테스크 요약

• 사용자의 유저정보를 조회하는 기능입니다.

해당 테스크가 왜 필요한가요

• 사용자가 상품 찜하기, 판매, 구매 내역을 확인할 수 있어야 하고
• 위치정보를 수정할 수 있어야 하기 때문에 필요합니다.

해당 테스크를 위해 무엇을 어떻게 할건가요

• 상품 조회할 수 있는 페이지
• 위치 정보를 조정할 수 있는 페이지

추가 설명 (선택)

체크리스트

• 해당 이슈가 프로젝트의 목적과 부합되는가
• 테스크를 형식에 맞게 작성 하였는가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 해당하는 유저스토리를 참조 하였는가
• 테스크에 해당하는 에픽과, 테스크 라벨을 추가하였는가
• 적절한 Projects에 추가 되었는가
• 모든 필수 항목을 작성하였는가

기능 제안 (Feature Request)

기능 요약

RESTful API를 사용함에 있어, api 명세서를 작성 할 때 자동화된 도구를 이용해 완성된 인터렉티브한 문서를 생성할 수 있도록 swagger을 사용할 것을 제안합니다.

기능 배경

• RESTful API의 필수 요건인 self-descriptive messages를 표현하기 위해 documentation이 필요로 합니다. 하지만 모든 api에 대해 정형화된 문서를 만들고 관리하고 테스트하는 것은 매우 힘들고 번거로운 사항입니다.
• 이에 보기 좋고 인터렉티브하며 자체 테스팅까지 가능한 swagger을 사용함으로써 보다 쉽고 사용자 친화적인 api 문서를 작성할 수 있습니다.

원하는 결과

원하는 결과를 위한 방법 제시

• api 서버의 /api-docs 형태의 라우터로 swagger-ui를 연동할 수 있습니다.
• 자세한 사용법을 위해 하단 공식문서의 사용법 링크를 첨부합니다.

고려할만한 대안 (선택)

apidoc :

• demo
• 공식 문서
• 사용법은 거의 비슷하고 약간의 차이만 있으므로 ui가 더 예쁘고 nodejs 환경의 관련 자료가 많은 swagger가 더 좋을 것이라 판단됩니다.

추가 정보 (선택)

swagger 공식문서
swagger-ui NPM module

체크리스트

• 해당 이슈와 유사한 선행 이슈가 없는 것을 확인 하였는가
• 해당 이슈가 프로젝트의 목적과 부합되는가
• 이슈 제목은 직관적인가
• 제 3자가 봤을 때 추가적인 질문 없이 이슈를 이해할 수 있는가
• 적절한 라벨을 추가하였는가
• 모든 필수 항목을 작성하였는가