How to use it
fakeStoreApi can be used with any type of shopping project that needs products, carts, and users in JSON format. you can use examples below to check how fakeStoreApi works and feel free to enjoy it in your awesome projects!
Products
Get all products
fetch('https://fakestoreapi.com/products')
.then(res=>res.json())
.then(json=>console.log(json))
//output
[
{
id:1,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
},
/*...*/
{
id:30,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
]
Get a single product
fetch('https://fakestoreapi.com/products/1')
.then(res=>res.json())
.then(json=>console.log(json))
//output
{
id:1,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
Limit results
fetch('https://fakestoreapi.com/products?limit=5')
.then(res=>res.json())
.then(json=>console.log(json))
//output
[
{
id:1,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
/*...*/
{
id:5,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
]
Sort results
fetch('https://fakestoreapi.com/products?sort=desc')
.then(res=>res.json())
.then(json=>console.log(json))
Default value is in ascending mode, you can use with 'desc' or 'asc' as you want.
//output
[
{
id:30,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
/*...*/
{
id:1,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
]
Get all categories
fetch('https://fakestoreapi.com/products/categories')
.then(res=>res.json())
.then(json=>console.log(json))
//output
[
"electronics",
"jewelery",
"men's clothing",
"women's clothing"
]
Get products in a specific category
fetch('https://fakestoreapi.com/products/category/jewelery')
.then(res=>res.json())
.then(json=>console.log(json))
You can also use limit(Number) and sort(asc|desc) as a query string to get your ideal results
//output
[
{
id:5,
title:'...',
price:'...',
category:'jewelery',
description:'...',
image:'...'
}
/*...*/
{
id:8,
title:'...',
price:'...',
category:'jewelery',
description:'...',
image:'...'
}
]
Add new product
fetch('https://fakestoreapi.com/products',{
method:"POST",
body:JSON.stringify(
{
title: 'test product',
price: 13.5,
description: 'lorem ipsum set',
image: 'https://i.pravatar.cc',
category: 'electronic'
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
If you send an object like the code above, it will return you an object with a new id. remember that nothing in real will insert into the database. so if you want to access the new id you will get a 404 error.
//output
{
id:31,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
Update a product
fetch('https://fakestoreapi.com/products/7',{
method:"PUT",
body:JSON.stringify(
{
title: 'test product',
price: 13.5,
description: 'lorem ipsum set',
image: 'https://i.pravatar.cc',
category: 'electronic'
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
fetch('https://fakestoreapi.com/products/7',{
method:"PATCH",
body:JSON.stringify(
{
title: 'test product',
price: 13.5,
description: 'lorem ipsum set',
image: 'https://i.pravatar.cc',
category: 'electronic'
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
It will return you an object with sent id. remember that nothing in real will update in the database.
//output
{
id:7,
title:'new title',
price:'new price',
category:'new category',
description:'new description',
image:'new image url'
}
Delete a product
fetch('https://fakestoreapi.com/products/6',{
method:"DELETE"
})
.then(res=>res.json())
.then(json=>console.log(json))
The product will not be deleted on the database. but if you sent data successfully it will return you the fake deleted product.
//output
{
id:6,
title:'...',
price:'...',
category:'...',
description:'...',
image:'...'
}
Cart
Get all carts
fetch('https://fakestoreapi.com/carts')
.then(res=>res.json())
.then(json=>console.log(json))
//output
[
{
id:1,
userId:1,
date:2020-10-10,
products:[{productId:2,quantity:4},{productId:1,quantity:10},{productId:5,quantity:2}]
},
/*...*/
{
id:20,
userId:10,
date:2019-10-10,
products:[{productId:1,quantity:5},{productId:5,quantity:1}]
}
]
Get a single cart
fetch('https://fakestoreapi.com/carts/5')
.then(res=>res.json())
.then(json=>console.log(json))
//output
{
id:5,
userId:1,
date:...,
products:[...]
}
Limit results
fetch('https://fakestoreapi.com/carts?limit=5')
.then(res=>res.json())
.then(json=>console.log(json))
//output
[
{
id:1,
userId:1,
date:...,
products:[...]
},
/*...*/
{
id:5,
userId:1,
date:...,
products:[...]
}
]
Sort results
fetch('https://fakestoreapi.com/carts?sort=desc')
.then(res=>res.json())
.then(json=>console.log(json))
The default value is in ascending mode, you can use it with 'desc' or 'asc' as you want.
//output
[
{
id:20,
userId:1,
date:...,
products:[...]
},
/*...*/
{
id:1,
userId:1,
date:...,
products:[...]
}
]
Get carts in a date range
fetch('https://fakestoreapi.com/carts?startdate=2019-12-10&enddate=2020-10-10')
.then(res=>res.json())
.then(json=>console.log(json))
If you don't add any start date it will fetch from the beginning of time and if you don't add any end date it will fetch until now. You can also use limit(Number) and sort(asc|desc) as a query string to get your ideal results
//output
[
{
id:1,
userId:1,
date:2019-12-10,
products:[...]
},
/*...*/
{
id:4,
userId:1,
date:2020-10-10,
products:[...]
}
]
Get user carts
fetch('https://fakestoreapi.com/carts/user/2')
.then(res=>res.json())
.then(json=>console.log(json))
You can also use date range as query string to get your ideal results
//output
[
{
id:5,
userId:2,
date:2019-10-03,
products:[...]
},
/*...*/
{
id:6,
userId:2,
date:2020-10-10,
products:[...]
}
]
Add a new product
fetch('https://fakestoreapi.com/carts',{
method:"POST",
body:JSON.stringify(
{
userId:5,
date:2020-02-03,
products:[{productId:5,quantity:1},{productId:1,quantity:5}]
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
If you send an object like the code above, it will return you an object with a new id. remember that nothing in real will insert into the database. so if you want to access the new id you will get a 404 error.
//output
{
id:21
userId:5,
date:2020-02-03,
products:[{productId:5,quantity:1},{productId:1,quantity:5}]
}
Update a product
fetch('https://fakestoreapi.com/carts/7',{
method:"PUT",
body:JSON.stringify(
{
userId:3,
date:2019-12-10,
products:[{productId:1,quantity:3}]
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
fetch('https://fakestoreapi.com/carts/7',{
method:"PATCH",
body:JSON.stringify(
{
userId:3,
date:2019-12-10,
products:[{productId:1,quantity:3}]
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
It will return you an object with sent id. remember that nothing in real will update in the database.
//output
{
id:7,
userId:3,
date:2019-12-10,
products:[{productId:1,quantity:3}]
}
Delete a cart
fetch('https://fakestoreapi.com/carts/6',{
method:"DELETE"
})
.then(res=>res.json())
.then(json=>console.log(json))
The cart will not be deleted on the database. but if you sent data successfully it will return you the fake deleted cart.
//output
{
id:6,
userId:...,
date:...,
products:[...]
}
Users
Get all users
fetch('https://fakestoreapi.com/users')
.then(res=>res.json())
.then(json=>console.log(json))
//output
[
{
id:1,
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
},
/*...*/
{
id:20,
email:'...',
username:'...',
password:'...',
name:{
firstname:'...',
lastname:'...'
},
address:{
city:'...',
street:'...',
number:...,
zipcode:'...',
geolocation:{
lat:'...',
long:'...'
}
},
phone:'...'
}
]
Get a single user
fetch('https://fakestoreapi.com/users/1')
.then(res=>res.json())
.then(json=>console.log(json))
//output
{
id:1,
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
}
Limit results
fetch('https://fakestoreapi.com/users?limit=5')
.then(res=>res.json())
.then(json=>console.log(json))
//output
[
{
id:1,
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
},
/*...*/
{
id:5,
email:'...',
username:'...',
password:'...',
name:{
firstname:'...',
lastname:'...'
},
address:{
city:'...',
street:'...',
number:...,
zipcode:'...',
geolocation:{
lat:'...',
long:'...'
}
},
phone:'...'
}
]
Sort results
fetch('https://fakestoreapi.com/users?sort=desc')
.then(res=>res.json())
.then(json=>console.log(json))
The default value is in ascending mode, you can use it with 'desc' or 'asc' as you want.
//output
[
{
id:20,
email:'...',
username:'...',
password:'...',
name:{
firstname:'...',
lastname:'...'
},
address:{
city:'...',
street:'...',
number:...,
zipcode:'...',
geolocation:{
lat:'...',
long:'...'
}
},
phone:'...'
},
/*...*/
{
id:1,
email:'...',
username:'...',
password:'...',
name:{
firstname:'...',
lastname:'...'
},
address:{
city:'...',
street:'...',
number:...,
zipcode:'...',
geolocation:{
lat:'...',
long:'...'
}
},
phone:'...'
}
]
Add a new user
fetch('https://fakestoreapi.com/users',{
method:"POST",
body:JSON.stringify(
{
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
If you send an object like the code above, it will return you an object with a new id. remember that nothing in real will insert into the database. so if you want to access the new id you will get a 404 error.
//output
{
id:21,
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
}
Update a users
fetch('https://fakestoreapi.com/users/7',{
method:"PUT",
body:JSON.stringify(
{
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
fetch('https://fakestoreapi.com/users/7',{
method:"PATCH",
body:JSON.stringify(
{
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
}
)
})
.then(res=>res.json())
.then(json=>console.log(json))
It will return you an object with sent id. remember that nothing in real will update in the database.
//output
{
id:7,
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
}
Delete a user
fetch('https://fakestoreapi.com/users/6',{
method:"DELETE"
})
.then(res=>res.json())
.then(json=>console.log(json))
The user will not be deleted on the database. but if you sent data successfully it will return you the fake deleted user.
//output
{
id:6,
email:'[email protected]',
username:'johnd',
password:'m38rmF$',
name:{
firstname:'John',
lastname:'Doe'
},
address:{
city:'kilcoole',
street:'7835 new road',
number:3,
zipcode:'12926-3874',
geolocation:{
lat:'-37.3159',
long:'81.1496'
}
},
phone:'1-570-236-7033'
}
Login
User login
fetch('https://fakestoreapi.com/auth/login',{
method:'POST',
body:JSON.stringify({
username: "mor_2314",
password: "83r5^_"
})
})
.then(res=>res.json())
.then(json=>console.log(json))
//output
{
token: "eyJhbGciOiJIUzI1NiIsInR"
}
You can use any of the users' username and password available in users API to get token. any other usernames return error.