์ด๋ฒ ๋ฏธ์ ์ Ajax๋ฅผ ์ด์ฉํ์ฌ TodoList๋ฅผ ๋ฐ์ ์ํค๋ ๋ฏธ์ ์ ๋๋ค. ๋น๋๊ธฐ ํต์ ์ผ๋ก ๋ฐ์ดํฐ๋ฅผ ๊ด๋ฆฌํ ๊ฒฝ์ฐ ์๋ฐ์คํฌ๋ฆฝํธ์ ๋น๋๊ธฐ๋ผ๋ ํน์ฑ์ ๋์ฑ ๊น์ด์๊ฒ ์ดํดํ ์ ์์ต๋๋ค
- 1. User ์ถ๊ฐํ๊ธฐ
- 2. User์ ํฌ๋๋ฆฌ์คํธ ๋ถ๋ฌ์ค๊ธฐ
- 3. User ์ญ์ ํ๊ธฐ
- 3. todoItem ์ถ๊ฐํ๊ธฐ
- 4. todoItem ๋ถ๋ฌ์ค๊ธฐ
- 5. todoItem completeํ๊ธฐ
- 6. todoItem ์ญ์ ํ๊ธฐ
- 7. todoItem contents ๋ด์ฉ ์์ ํ๊ธฐ
- 1. ๋ฐ์ดํฐ๋ฅผ ๋ถ๋ฌ์ค๊ธฐ์ ๋ก๋ฉ๋ฐ๋ฅผ ์ด์ฉํด, ์ฌ์ฉ์๊ฐ ๋ฐ์ดํฐ๊ฐ ๋ถ๋ฌ์์ง๊ณ ์๋ค๋ ๊ฒ์ ๋ณด์ฌ์ค๋๋ค.
- 2. fetch api ์ฌ์ฉํ๋ ๋ถ๋ถ์ async await์ ์ฌ์ฉํ์ฌ ๋ฆฌํฉํ ๋งํฉ๋๋ค.
- 3. github issue์์ ๋ผ๋ฒจ์ ๋ถ์ด๋ ๊ฒ์ฒ๋ผ, ์ฐ์ ์์์ ๋ฐ๋ผ์ badge๋ฅผ ์ถ๊ฐํฉ๋๋ค.
- 4. ES6 impot & export๋ฅผ ์ด์ฉํด ์๋ฐ์คํฌ๋ฆฝํธ ํ์ผ์ ๋ฆฌํฉํ ๋งํฉ๋๋ค.
- 1. User์ ์ด๋ฆ์ ์ต์ 2๊ธ์ ์ด์์ด์ด์ผ ํฉ๋๋ค.
method | uri |
---|---|
GET | /api/users |
{
response: [...]
}
method | uri |
---|---|
POST | /api/users |
{
requestBody: {
"name": "string"
},
response: {
"_id": "string",
"name": "string",
"todoList": []
}
}
method | uri |
---|---|
GET | /api/users/:userId |
{
response: {
"_id": "string",
"name": "string",
"todoList": [...]
}
}
method | uri |
---|---|
DELETE | /api/users/:userId |
{
response: {}
}
method | uri |
---|---|
GET | /api/users/:userId/items/ |
{
response: [...]
}
method | uri |
---|---|
POST | /api/users/:userId/items/ |
{
requestBody: {
"contents": "string"
},
response: {
"_id": "string",
"name": "string",
"todoList": [...]
}
}
method | uri |
---|---|
DELETE | /api/users/:userId/items/ |
{
response: {
"_id": "string",
"name": "string",
"todoList": []
}
}
method | uri |
---|---|
DELETE | /api/users/:userId/items/:itemId |
{
response: {
"_id": "string",
"name": "string",
"todoList": [...]
}
}
method | uri |
---|---|
PUT | /api/users/:userId/items/:itemId |
{
requestBody: {
"contents": "string"
},
response: {
"_id": "string",
"contents": "string",
"priority": "string",
"isCompleted": "boolean"
}
}
method | uri |
---|---|
PUT | /api/users/:userId/items/:itemId/priority |
{
requestBody: {
"priority": "string" // 'NONE', 'FIRST', 'SECOND'
},
response: {
"_id": "string",
"contents": "string",
"priority": "string",
"isCompleted": "boolean"
}
}
method | uri |
---|---|
PUT | /api/users/:userId/items/:itemId/toggle |
{
response: {
"_id": "string",
"contents": "string",
"priority": "string",
"isCompleted": "boolean"
}
}
'ํ๋ฅญํ ์์ฌ์ํต์ ๋ธ๋์ปคํผ์ฒ๋ผ ์๊ทน์ ์ด๋ฉฐ, ํ์ ์ ๋ค๊ธฐ๊ฐ ์ด๋ ต๋ค'.
A.M. ๋ฆฐ๋๋ฒ๊ทธ(๋ฏธ๊ตญ์ ์๊ฐ, ์ํ๊ฐ) -
๋ธ๋์ปคํผ์ฒ๋ผ ์๋ก๋ฅผ ์๊ทนํด์ฃผ๊ณ , ๋๊ธฐ๋ถ์ฌ ํด์ฃผ๋ฉฐ, ๊ทธ ์ฑ์ฅ๊ณผ์ ์ผ๋ก ์ธํด ์๋ฏธ์๋ ๊ฐ์น๋ฅผ ๋ง๋ค์ด๋ด๊ณ ์ ํ๋
ํ๋ก ํธ์๋ ์ฝ๋๋ฆฌ๋ทฐ ๋ชจ์ โ๏ธ Black Coffee์
๋๋ค.
๋ก์ปฌ์์ ์น์๋ฒ๋ฅผ ๋์ html, css, js ๋ฑ์ ์ค์๊ฐ์ผ๋ก ์์ฝ๊ฒ ํ
์คํธํด ๋ณผ ์ ์์ต๋๋ค. ์ด๋ฅผ ์ํด์๋ ์ฐ์ npm์ด ์ค์น๋์ด ์์ด์ผ ํฉ๋๋ค. ๊ตฌ๊ธ์ npm install
์ด๋ ํค์๋๋ก ๊ฐ์์ ์ด์์ฒด์ ์ ๋ง๊ฒ๋ npm์ ์ค์นํด์ฃผ์ธ์. ์ดํ ์๋์ ๋ช
๋ น์ด๋ฅผ ํตํด ์ค์๊ฐ์ผ๋ก ์นํ์ด์ง๋ฅผ ํ
์คํธํด๋ณผ ์ ์์ต๋๋ค.
npm install -g live-server
์คํ์ ์๋์ ์ปค๋งจ๋๋ก ํ ์ ์์ต๋๋ค.
live-server ํด๋๋ช
์๋ ๋งํฌ๋ค์ ์๋ ๋ฆฌ๋ทฐ ๊ฐ์ด๋๋ฅผ ๋ณด๊ณ , ์ข์ ์ฝ๋ ๋ฆฌ๋ทฐ ๋ฌธํ๋ฅผ ๋ง๋ค์ด ๋๊ฐ๋ ค๊ณ ํฉ๋๋ค.
๋ง์ฝ ๋ฏธ์ ์ํ ์ค์ ๊ฐ์ ์ฌํญ์ด ๋ณด์ธ๋ค๋ฉด, ์ธ์ ๋ ์์ ๋กญ๊ฒ PR์ ๋ณด๋ด์ฃผ์ธ์.
๋ฒ๊ทธ๋ฅผ ๋ฐ๊ฒฌํ๋ค๋ฉด, Issues ์ ๋ฑ๋ก ํ @eastjun์๊ฒ dm์ ๋ณด๋ด์ฃผ์ธ์.
This project is MIT licensed.