next-step / js-todo-list-step3

JS 투두리스트 스텝3

팀을 위한 투두리스트

🔥 Projects!

🖥️ 데모 링크

🎯 index.html 팀 페이지 요구사항

• 1. 팀 추가하기
• 2. 팀 리스트 불러와서 화면에 보여주기

🎯 kanban.html 팀의 투두리스트 페이지 요구사항

• 1. 팀에 멤버 추가하기
• 2. 팀원별 todoList 불러오기
• 3. 팀원별 todoItem 추가하기
• 4. 팀원별 todoItem 삭제하기
• 5. 팀원별 todoItem complete하기
• 6. 팀원별 todoItem contents 내용 수정하기
• 7. todoItem의 우선 순위 정하기 (defulat값:0, 1순위:1, 2순위: 2)
• 8. todoList의 우측 하단의 전체 삭제버튼을 누르면 해당 유저의 아이템을 전체 삭제하기

🎯🎯 kanban.html 심화 요구사항

• 1. todoItem의 우선 순위에 따라 정렬하기

📝 API

팀 추가

method	uri
POST	/api/teams

{
 requestBody: {
   "name": "string"
 },
 response: {
   "_id": "string",
   "name": "string",
   "members": [...]
  }
}

팀 불러오기

method	uri
GET	/api/teams/${teamId}

{
 response: {
   "_id": "string",
   "name": "string",
   "members": [...]
  }
}

팀 리스트 불러오기

method	uri
GET	/api/teams

{
 response: [
  {
   "_id": "string",
   "name": "string",
   "members": [...]
  }
  ...
 ]
}

팀 삭제

method	uri
DELETE	/api/teams/${teamId}

{
 response: {}
}

팀에 멤버 추가

method	uri
POST	/api/teams/${teamId}/members

{
 requestBody: {
   "name": "string"
 },
 response: {
   "_id": "string",
   "name": "string",
   "members": [...]
  }
}

팀원별 TodoList 불러오기

method	uri
GET	/api/teams/${teamId}/members/${memberId}

{
 response: [
  {
    "_id": "string",
   "name": "string",
   "todoList": []
  }
 ]
}

팀원의 TodoItem 추가하기

method	uri
POST	/api/teams/${teamId}/members/${memberId}/items

{
 requestBody: {
   "contents": "string"
 },
 response: [
   {
   "_id": "string",
   "contents": "string",
   "priority": "string",
   "isCompleted": "boolean",
   }
   ...
 ]
}

팀원의 TodoItem 삭제하기

method	uri
DELETE	/api/teams/${teamId}/members/${memberId}/items/${itemId}

{
 response: {}
}

팀원의 TodoItem toggle하기

method	uri
PUT	/api/teams/${teamId}/members/${memberId}/items/${itemId}/toggle

{
 response: {
   "_id": "string",
   "contents": "string",
   "priority": "string",
   "isCompleted": "boolean",
   }
}

팀원의 TodoItem contents 수정하기

method	uri
PUT	/api/teams/${teamId}/members/${memberId}/items/${itemId}

{
 requestBody: {
   "contents": "string"
 },
 response:    {
   "_id": "string",
   "contents": "string",
   "priority": "string",
   "isCompleted": "boolean",
   }
}

팀원의 TodoItem 우선순위 수정하기

method	uri
PUT	/api/teams/${teamId}/members/${memberId}/items/${itemId}/priority

{
 requestBody: {
   "priority": "FIRST"
 },
 response: {
   "_id": "string",
   "contents": "string",
   "priority": "string",
   "isCompleted": "boolean",
 }
}

팀원의 TodoItem 전부 삭제

method	uri
DELETE	/api/teams/${teamId}/members/${memberId}/items/

{
 response: {}
}

☕️ 코드리뷰 모임 - Black Coffee

'훌륭한 의사소통은 블랙커피처럼 자극적이며, 후에 잠들기가 어렵다'.
A.M. 린드버그(미국의 작가, 수필가) -

블랙커피처럼 서로를 자극해주고, 동기부여 해주며, 그 성장과정으로 인해 의미있는 가치를 만들어내고자 하는
프론트엔드 코드리뷰 모임 ☕️ Black Coffee입니다.

⚙️ Before Started

로컬에서 서버 띄워서 손쉽게 static resources 변경 및 확인하는 방법

로컬에서 웹서버를 띄워 html, css, js 등을 실시간으로 손쉽게 테스트해 볼 수 있습니다. 이를 위해서는 우선 npm이 설치되어 있어야 합니다. 구글에 npm install 이란 키워드로 각자의 운영체제에 맞게끔 npm을 설치해주세요. 이후 아래의 명령어를 통해 실시간으로 웹페이지를 테스트해볼 수 있습니다.

npm install -g live-server

실행은 아래의 커맨드로 할 수 있습니다.

live-server 폴더명

👏🏼 Contributing

만약 미션 수행 중에 개선사항이 보인다면, 언제든 자유롭게 PR을 보내주세요.

🐞 Bug Report

버그를 발견한다면, Issues에 등록해주세요.

📝 License

This project is MIT licensed.

js-todo-list-step3's Issues

5기 마지막 온라인 세션을 진행한다.

[오자수정] README.md

itemId 를 teamId 로 변경하는게 어울릴 것 같습니다

GET /api/teams 호출시 팀이 없는 경우, 빈 배열 []을 반환한다.

Team이 존재하지 않는 경우, api의 응답이 리턴되지 않는 것으로 추측됩니다.

이에 팀이 존재하지 않는 경우, 빈 배열을 반환하도록 api를 업데이트 요청드립니다.

팀이 너무 많은 경우 보기가 어렵다

데모 가능한 페이지를 만들어 README에 추가한다.

GET /api/teams/${teamId}/members/${memberId} 호출시 todoList가 존재하지 않는 경우, 빈 배열 []을 반환한다.

팀원별 TodoList를 불러오는 api에서 예상되는 response 입니다.

{
 response: [
  {
    "_id": "string",
   "name": "string",
   "todoList": []
  }
 ]
}

todoList가 존재하지 않는 경우, json내 프로퍼티 자체가 존재하지 않게 됩니다.
동일 요청에 대한 response의 동일 프로퍼티를 보장하기 위해, 빈배열을 리턴하도록 업데이트 요청 드립니다.

확인 부탁드립니다! 🙏

API 명세서의 type 오류

response로 받는 priority type으로 number를 받는다고 적혀있는데 실제로는 string type으로 전달받아지네요!
(아래는 postman로 호출한 결과)