DEV Community

jSON Server with ReactJS

Mario Rodeghiero on July 05, 2018

jSON Server with ReactJS JSON Server helps you to set up a REST API simply and quickly. As they report in the Github repository, you can...
Collapse
 
mariorodeghiero profile image
Mario Rodeghiero

Hi ariana, I have two repositories in my Github:

In development yet: github.com/mariorodeghiero/react-p...

github.com/mariorodeghiero/react-g...

 
mariorodeghiero profile image
Mario Rodeghiero

JSON-server is ideal for a development environment, but you can still make a GET and POST.
If you want to use a real-time data server, it would be better to use the firebase. and to perform GET and POST you can use the Https://github.com/axios/axios.

This link has a repository using firebase and axios: github.com/mariorodeghiero/reactjs...

Collapse
 
ashifmohammad profile image
Ashif Zafar • Edited

is it still possible to run json-server on node < 10 version?

Collapse
 
mariorodeghiero profile image
Mario Rodeghiero

I think it works yet, I didn't find any note about it, but you can check more details here: github.com/typicode/json-server
thanks

Collapse
 
stefanvrecic profile image
StefanVrecic

If your client is on 3000 and your API is on 3001, do you not get a 403 error? I'm doing a little job takehome test and I've been provided with the server/API which I'm not allowed to edit, it's using JSON-server.

Whenever I run my client and API, one of them goes on 3002 (or I could specify a different port) - they can't run on the same port, and also trying to access localhost:3002/api returns a 403 error, which I'm assuming is because cors is not enabled. How does yours work?

Collapse
 
q118 profile image
Shelby Anne

You just need to open another console window and run both commands at the same time. One for 3000 and one for 3001 :)

Collapse
 
vlatdina profile image
vlatdina • Edited

Thank you for this article.

Can you plz tell me why Im getting this error constantly? :( :(

Unhandled Rejection(TypeError): data.map is not a function

Collapse
 
mariorodeghiero profile image
Mario Rodeghiero • Edited

Thanks !
Probably because your "data" isn't an array.
If you agree, share your repository link and I can try to help you.

Collapse
 
rapidtables1 profile image
rapidtables

Thank you Mario for this article, I have been looking similar to that, along the way found nice JSON tool, jsonformatter.org which helped me to formate and validate json data.

Collapse
 
mariorodeghiero profile image
Mario Rodeghiero

Thank you for liking this article. interesting this link you reported, thanks for sharing ✌🏼

Collapse
 
johannchopin profile image
johannchopin

Really nice article 👏 Do you think that the tool Restapify could be a nice way to mock Rest API like json-server do? 😄

Collapse
 
andreshkurko profile image
AndreSkurko

Hey. Tell me how to configure json-server on firebase so that it is always active?

Collapse
 
mariorodeghiero profile image
Mario Rodeghiero

Hi CodingDevHub,
You can use only firebase.
In this repository github.com/mariorodeghiero/reactjs..., I have an example with React and firebase.

Collapse
 
rashidbik7 profile image
RashidBik7

it dose not work for me the error says "Cross-origin request blocked"

Collapse
 
changtraisitinh profile image
Hiep Nguyen

ii using mockoon for mockup api server