Code examples

Assuming your project looks like the screen shot above, mockapi.io will generate the following endpoints:

Method	URL	Payload	Response	Description
GET	/users		User[]	Get a list of users
GET	/users/{userId}		User	Get a user by ID
POST	/users	User	User	Create a new user
PUT (or PATCH)	/users/{userId}	User	User	Update a user
Delete	/users/{userId}		User	Delete a user
GET	/users/{userId}/tasks or /tasks		Task[]	Get a list of tasks for a user
GET	/users/{userId}/tasks/{taskId} or /tasks/{taskId}		Task	Get a task by ID
POST	/users/{userId}/tasks or /tasks	Task	Task	Create a new task for a user
PUT (or PATCH)	/users/{userId}/tasks/{taskId} or /tasks/{taskId}	Task	Task	Update a task for a user
Delete	/users/{userId}/tasks/{taskId} or /tasks/{taskId}		Task	Delete a task

CRUD

NOTE All examples are written in Javascript. A couple of things to note here are (1) mockapi.io expects content-type:application/json header, (2) data should be sent as a JSON inside the request body.

Get tasks

fetch('https://PROJECT_TOKEN.mockapi.io/users/1/tasks', {
  method: 'GET',
  headers: {'content-type':'application/json'},
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(tasks => {
  // Do something with the list of tasks
}).catch(error => {
  // handle error
})

Create a new task

const newTask = {
  content: 'Check out mockapi.io',
  completed: false,
};

fetch('https://PROJECT_TOKEN.mockapi.io/users/1/tasks', {
  method: 'POST',
  headers: {'content-type':'application/json'},
  // Send your data in the request body as JSON
  body: JSON.stringify(newTask)
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(task => {
  // do something with the new task
}).catch(error => {
  // handle error
})

Mark tasks completed

fetch('https://PROJECT_TOKEN.mockapi.io/user/1/tasks/1', {
  method: 'PUT', // or PATCH
  headers: {'content-type':'application/json'},
  body: JSON.stringify({completed: true})
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(task => {
  // Do something with updated task
}).catch(error => {
  // handle error
})

Delete tasks

fetch('https://<PROJECT_TOKEN.mockapi.io/users/1/tasks/1', {
  method: 'DELETE',
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(task => {
  // Do something with deleted task
}).catch(error => {
  // handle error
})

Filtering

Filtering is implemented using search parameters

Parameter	Type	Example	Descripton
search	String	search=hello	Get all items matching string hello in any of the fields
filter	String	filter=hello	Get all items matching string hello in any of the fields
field_name	String	title=hello	Get all items that have title field matching string hello

Get all tasks that match `hello` string

const url = new URL('https://PROJECT_TOKEN.mockapi.io/users/1/tasks');
url.searchParams.append('title', 'hello');

fetch(url, {
  method: 'GET',
  headers: {'content-type':'application/json'},
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(tasks => {
  // mockapi returns only tasks that match `hello` string
}).catch(error => {
  // handle error
})

Get tasks that are not completed

const url = new URL('https://PROJECT_TOKEN.mockapi.io/users/1/tasks');
url.searchParams.append('completed', false);

fetch(url, {
  method: 'GET',
  headers: {'content-type':'application/json'},
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(tasks => {
  // mockapi returns only incomplete tasks
}).catch(error => {
  // handle error
})

Pagination

Pagination is implemented using search parameters

Parameter	Type	Example	Descripton
page	Number	page=1	Get first page
p	Number	p=1	Get first page
limit	Number	limit=10	Get 10 items per page
l	Number	l=10	Get 10 items per page

Get first 10 tasks that are not completed

const url = new URL('https://PROJECT_TOKEN.mockapi.io/users/1/tasks');
url.searchParams.append('completed', false);
url.searchParams.append('page', 1);
url.searchParams.append('limit', 10);

fetch(url, {
  method: 'GET',
  headers: {'content-type':'application/json'},
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(tasks => {
  // mockapi returns first 10 tasks that are not completed
}).catch(error => {
  // handle error
})

Sorting

Sorting is implemented using search parameters

Parameter	Type	Example	Descripton
sortBy	field_name	sortBy=title	Sort items by title
sortby	field_name	sortby=title	Sort items by title
orderBy	field_name	orderBy=title	Sort items by title
orderby	field_name	orderby=title	Sort items by title
order	asc|desc	order=desc	Sort items in the descending order

Sort tasks by title in ascending order

const url = new URL('https://PROJECT_TOKEN.mockapi.io/users/1/tasks');
url.searchParams.append('sortBy', 'title');
url.searchParams.append('order', 'desc'); // order parameter is optional and will default to `asc`

fetch(url, {
  method: 'GET',
  headers: {'content-type':'application/json'},
}).then(res => {
  if (res.ok) {
      return res.json();
  }
  // handle error
}).then(tasks => {
  // list of tasks sorted by title in descending order
}).catch(error => {
  // handle error
})