Fractured2K / todo-react-api-demo

Learn react with a real api.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

TODO API DOCUMENTATION

Gets todos

Method Url: /todos

HTTP method: [GET]

Response

200 (OK)

If you successfully fetch all todos the endpoint will return an HTTP response with a status code 200 and a body as below.

example:

[
    {
       id: 1,
       todo: "Walk the dog"
    }
]

Get todo

Method Url: /todos/:id

HTTP method: [GET]

example call:

axios.get('http://localhost:5000/todos/1')
     .then((res) => {
         this.setState({
             todo: res.data.todo
         })
     })
     .catch(err => {
       console.log(err)
     })

Response

200 (OK)

If you successfully fetch a todo the endpoint will return an HTTP response with a status code 200 and a body as below.

example:

{
    id: 1,
    todo: "Walk the dog"
}

Create todo

Method Url: /todos

HTTP method: [POST]

example call:

axios.post('http://localhost:5000/todos/')
     .then((res) => {
         this.setState({
             todos: [...this.state.todos, res.data.todo]
         })
     })
     .catch(err => {
       console.log(err)
     })

Response

200 (OK)

If you successfully created a todo the endpoint will return an HTTP response with a status code 200 and a body as below.

example:

{
    id: 1,
    todo: "New todo"
}

Update todo

Method Url: /todos

HTTP method: [PUT]

example call:

axios.put('http://localhost:5000/todos/', { id: 1, todo: "Updated todo" })
     .then((res) => {
         this.setState({
             todo: res.data.todo
         })
     })
     .catch(err => {
       console.log(err)
     })

Response

200 (OK)

If you successfully update a todo the endpoint will return an HTTP response with a status code 200 and a body as below.

example:

{
    id: 1,
    todo: "Updated todo"
}

Delete todo

Method Url: /todos/:id

HTTP method: [DELETE]

example call:

axios.delete('http://localhost:5000/todos/1')
     .then((res) => {
         this.setState({
             message: res.data.message
         })
     })
     .catch(err => {
       console.log(err)
     })

Response

200 (OK)

If you successfully delete a todo the endpoint will return an HTTP response with a status code 200 and a body as below.

example:

{
    message: "Todo successfully deleted"
    id: 1
}

About

Learn react with a real api.


Languages

Language:JavaScript 78.9%Language:HTML 16.0%Language:CSS 5.0%