json-service-editor

pianoboy — Wed, 14 Jun 2023 14:00:11 +0000

If you are planning to create a front-end DEMO for demonstration, but do not have support from server personnel; If you are developing a front-end page but the server is not well developed; So json-service-editor is a good choice!

git: https://github.com/zhuqingyv/json-service-editor
npm: https://www.npmjs.com/package/json-service-editor

Quick Start

npm install json-service-editor -g

.json-service.json


{
  "url": "src/demo.json",
  "port": 3000
}

run

json-service-editor

Now you have started a local JSON read and write service with port 3000.

Interface

Here are the most basic read and write interfaces get and set

Get JSonValue

fetch('http://localhost:3000/get/demo.json', {
  method: 'GET',
})

Set JSonValue

fetch('http://localhost:3000/set/demo.json', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({ message: 'hello world!' }),
})

Options

There are two types of configuration files provided here, one is. json service. json and the other is. json service. js. If both js and json configurations exist in the running directory, the js script takes precedence.

Option	.json-service.js	.json-service.json	description
url	✅	✅	File relative path
port	✅	✅	Service port
service	✅	❌	Custom Service Configuration

Here are some code demonstrations:

module.exports = () => {
  const url = "src/demo.json";
  const port = 3110;
  return {
    url,
    port,
    service: {
      '/post': {
        methods: 'post',
        handle: ({ json, params, res, req }) => {
          res.json(200, { message: 'pass!' });
        }
      },

      '/get': {
        methods: 'get',
        handle: ({ json, params, res, req }) => {
          res.json(200, { message: 'pass!' });
        }
      }
    }
  }
};

Simpler Browser API (Base on FetchAPI)

First:

npm install json-service-editor

Code:

import JsonServiceEditorCore from 'json-service-editor';

const serviceSDK = new JsonServiceEditorCore({
  baseUrl: 'http://localhost:3000',
  fileName: 'demo.json'
});

const { getValue, setValue } = serviceSDK;

getValue(
  // success callback
  () => {},
  // fail callback
  () => {}
)

DEV Community: pianoboy

json-service-editor

Interface

Options

Simpler Browser API (Base on FetchAPI)