background

As mentioned above, although YApi is a powerful APi management test platform, there are some defects that can not be ignored, such as:

  1. The directory level has only one level, which is not friendly to complex service systems.
  2. Users can be added only through registration. The administrator cannot create users or new administrators.

So how do we start to modify the source code, add some of their own Idea into it?

Development environment, launch!

Remember the command to start the service at the last step of the deployment environment:

node server/app.js
Copy the code

This command started the service, but it was not hot deployed, and the code we changed was not immediately reflected on the page. Instead, the service had to be packaged and restarted.

Is there a developer model? The answer is yes

All we need to do now is replace the above command with our development environment startup command:

npm run dev-client
npm run dev-server
Copy the code

Note that these two commands are executed with a portion of the Linux command, so running them on the Windows console will cause an error. If you want to run them on Windows, you can use gitbash:

  1. Git installation
  2. Right click under Vendors and select the ‘Git Bash Here’ command
  3. Execute commands to start the environment (open two Windows to execute separately)

So we started the project in development mode, ready for hot deployment

To modify the

Taking requirement 1 mentioned at the beginning of this article as an example, I want to add multilevel directories to YApi. How do I do this? First we need to understand the technology stack used by YApi:

Back end: Koa Mongoose Front end: React Redux

For the technology stack, the code directory structure is analyzed

-- vendors |-- CHANGELOG.md |-- LICENSE |-- README.md |-- client |-- common |-- config_example.json |-- doc |-- exts |--  nodemon.json |-- npm-debug.log |-- package.json |-- plugin.json |-- server |-- static |-- test |-- webpack.alias.js |--  yapi-base-flow.jpg |-- ydocfile.js `-- ykit.config.jsCopy the code

Under client, the code for the interface is displayed. Under Server, the entity model, controller and API related to database operation are displayed. Then we have the idea to add parentId property to the existing menu to construct tree structure, rewrite the interface rendering logic, and blah, blah, blah, blah, blah, blah, blah, blah, blah.

Packaging releases

After another hundred million changes, our YApi has a multilevel directory

But if we use

  node server/app.js
Copy the code

Start the service and find that the modification does not take effect. Why? Since the code is not repackaged after modification, this command starts the same static resources and services as before.

  ykit pack -m
Copy the code

Package again, and run again

  node server/app.js
Copy the code

Just start the production environment