Skip to content

next-step/js-todo-list-step2

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

2 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

JS ํˆฌ๋‘๋ฆฌ์ŠคํŠธ ์Šคํ…2

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์™€ AJAX๋ฅผ ์ด์šฉํ•˜์—ฌ ๊ตฌํ˜„ ํ•˜๋Š” ํˆฌ๋‘๋ฆฌ์ŠคํŠธ

template version

๐Ÿ”ฅ Projects!

๐Ÿ–ฅ๏ธ ๋ฐ๋ชจ ๋งํฌ


๐ŸŽฏ ์š”๊ตฌ์‚ฌํ•ญ

  • 1. User ์ถ”๊ฐ€ํ•˜๊ธฐ
  • 2. User์˜ ํˆฌ๋‘๋ฆฌ์ŠคํŠธ ๋ถˆ๋Ÿฌ์˜ค๊ธฐ
  • 3. User ์‚ญ์ œํ•˜๊ธฐ
  • 3. todoItem ์ถ”๊ฐ€ํ•˜๊ธฐ
  • 4. todoItem ๋ถˆ๋Ÿฌ์˜ค๊ธฐ
  • 5. todoItem completeํ•˜๊ธฐ
  • 6. todoItem ์‚ญ์ œํ•˜๊ธฐ
  • 7. todoItem contents ๋‚ด์šฉ ์ˆ˜์ •ํ•˜๊ธฐ

๐ŸŽฏ๐ŸŽฏ ์‹ฌํ™” ์š”๊ตฌ์‚ฌํ•ญ

  • 1. fetch api ์‚ฌ์šฉํ•˜๋Š” ๋ถ€๋ถ„์„ async await์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ฆฌํŒฉํ† ๋งํ•˜๊ธฐ.
  • 2. github issue์—์„œ ๋ผ๋ฒจ์„ ๋ถ™์ด๋Š” ๊ฒƒ์ฒ˜๋Ÿผ, ์šฐ์„ ์ˆœ์œ„์— ๋”ฐ๋ผ์„œ label๋ฅผ ์ถ”๊ฐ€ํ•˜๊ธฐ.
  • 3. ES6 impot & export๋ฅผ ์ด์šฉํ•ด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํŒŒ์ผ์„ ๋ฆฌํŒฉํ† ๋งํ•˜๊ธฐ.

๐Ÿ•ต๏ธโ€โ™‚๏ธ ์ œ์•ฝ์‚ฌํ•ญ

  • 1. User์˜ ์ด๋ฆ„์€ ์ตœ์†Œ 2๊ธ€์ž ์ด์ƒ์ด์–ด์•ผ ํ•œ๋‹ค.
  • 2. TodoItem Contents๋Š” ์ตœ์†Œ 2๊ธ€์ž ์ด์ƒ์ด์–ด์•ผ ํ•œ๋‹ค.

๐Ÿ“ API

User list ๋ถˆ๋Ÿฌ์˜ค๊ธฐ

method uri
GET /api/users
{
 response: [...]
}

User ์ถ”๊ฐ€ํ•˜๊ธฐ

method uri
POST /api/users
{
 requestBody: {
   "name": "string"
 },
 response: {
   "_id": "string",
   "name": "string",
   "todoList": []
  }
}

User ๋ถˆ๋Ÿฌ์˜ค๊ธฐ

method uri
GET /api/users/:userId
{
 response: {
   "_id": "string",
   "name": "string",
   "todoList": [...]
  }
}

User ์‚ญ์ œํ•˜๊ธฐ

method uri
DELETE /api/users/:userId
{
  response: {
  }
}

User์˜ Todo Item ๋ถˆ๋Ÿฌ์˜ค๊ธฐ

method uri
GET /api/users/:userId/items/
{
 response: [...]
}

User์˜ Todo Item ์ถ”๊ฐ€ํ•˜๊ธฐ

method uri
POST /api/users/:userId/items/
{
 requestBody: {
   "contents": "string"
 },
 response: {
   "_id": "string",
   "name": "string",
   "todoList": [...]
  }
}

User์˜ Todo Item ์ „๋ถ€ ์‚ญ์ œํ•˜๊ธฐ

method uri
DELETE /api/users/:userId/items/
{
 response: {
   "_id": "string",
   "name": "string",
   "todoList": []
  }
}

User์˜ Todo Item 1๊ฐœ ์‚ญ์ œํ•˜๊ธฐ

method uri
DELETE /api/users/:userId/items/:itemId
{
 response: {
   "_id": "string",
   "name": "string",
   "todoList": [...]
  }
}

User์˜ Todo Item ๋‚ด์šฉ ์ˆ˜์ •ํ•˜๊ธฐ

method uri
PUT /api/users/:userId/items/:itemId
{
 requestBody: {
   "contents": "string"
 },
 response: {
  "_id": "string",
   "contents": "string",
   "priority": "string",
   "isCompleted": "boolean"
  }
}

User์˜ Todo Item ์šฐ์„ ์ˆœ์œ„ ์ˆ˜์ •ํ•˜๊ธฐ

method uri
PUT /api/users/:userId/items/:itemId/priority
{
 requestBody: {
   "priority": "string" // 'NONE', 'FIRST', 'SECOND'
 },
 response: {
   "_id": "string",
   "contents": "string",
   "priority": "string",
   "isCompleted": "boolean"
  }
}

User์˜ Todo Item complete toggle

method uri
PUT /api/users/:userId/items/:itemId/toggle
{
 response: {
   "_id": "string",
   "contents": "string",
   "priority": "string",
   "isCompleted": "boolean"
  }
}

โš™๏ธ Before Started

Tip ๋กœ์ปฌ์—์„œ ์„œ๋ฒ„ ๋„์›Œ์„œ ์†์‰ฝ๊ฒŒ 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.

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors