Guide

How to replace your backend API easier with Proxytool

Marcell Simon
Marcell Simon

Moving from one backend to another can be extremely fragile and stressful. The switch between your old and new backend APIs can become your worst nightmare, especially if you manage a large company that houses vast volumes of data and complex data structures. However, switching APIs has never been simpler, thanks to Proxytool! Read on to find out how Proxytool's mock API can do the unexpected for your Web and Mobile Apps.

Say Goodbye to Downtime with Proxytool

Achieve zero downtime on the development side with Proxytool. Reducing and eliminating downtime can be too much of a hassle, especially when running a big organization. But do not worry, we have got just the solution for you!

Proxytool streamlines the connection between your new API and pre-existing frontend application. Your frontend code must no longer be changed to accommodate the new backend API. You can operate with your new API without downtime by gradually turning off rules and adjusting endpoints.

The development stage of your application is the best time to use Proxytool since mocking is an essential step in evaluating your application's adaptability and compatibility with various features and elements. For instance, Proxytool's dynamic mocking can support test-driven development whether you're creating a new application or a new feature for an existing one. Proxytool allows you to rigorously test both the internal and external components of your application while employing mock testing with more up-to-date, efficient algorithms. Check out our blog on Mocking 2.0 for more information.

However, for other stages like production and deployment, it is not suggested to use Proxytool as it deviates from its intended purpose.

Example: A Restaurant Application

Here, we take an example of a restaurant application that receives information from its backend regarding the name, type, and coordinates of various restaurants and implements it as a pin on a real-time map. The old backend is currently in use and has its data in the following format:

[
  {
    "name": "Pasta Pomodoro",
    "type": "italian",
    "latitude": "40.7143528",
    "longitude": "-74.0059731"
  },
  {
    "name": "Salad Bar",
    "type": "vegan",
    "latitude": "40.4143528",
    "longitude": "-74.0052731"
  }
]

The data structure in this backend carries the place's name, type, latitude, and longitude. However, we wish to move to a different service provider that has a more stable and scalable solution. This will introduce several new features, for example, a new attribute, Rating, in the application.

{
  "status": "success",
  "response": [
    {
      "basicInfo": {
        "name": "Pasta Pomodoro",
        "rating": 4.3,
        "categories": [ "italian", "pasta" ]
      },
      "coordinates": [ 40.7143528, -74.0059731 ]
    },
    {
      "basicInfo": {
        "name": "Salad Bar",
        "rating": 4.3,
        "categories": [ "vegan", "salad" ]
      },
      "coordinates": [ 40.4143528, -74.0052731 ]
    }
  ]
}

To execute this idea, the new backend will store the place's name, type, coordinates, category, and rating. The structure of the new backend goes as follows:

The old and new backends have a similar purpose, i.e., holding the data for the pins on the map. However, they form around different data structures. The data representation is dissimilar as in the new backend, the coordinates are stored as a tuple, unlike the latitude and longitude in the old backend. Plus, we have a ‘Rating’ feature as well in the new backend.

The transition from the old to the new backend will require modifications and adjustments on the frontend layer. If you try to run the same frontend code with a new backend without integrating them as necessary, you will encounter errors or undesired information displays. While it may be time- and cost-effective in some scenarios, this can usually result in your front end being unable to handle any data. Specifically for large organizations where data has to be managed and altered on more than one front, it can be highly challenging and complicated.

By replacing the API URL with the new backend API URL in our frontend restaurant application, this is what the application looks like:

Here, the reason why no pins or data are seen is that a new backend API URL was added without making it compatible and workable with the frontend. That’s where Proxytool comes in! With a mock API linked to your new backend, you can customize your requests and responses to bridge the gaps between your old and new data structures without compromising your application's performance or functionalities on the front end.  

How to Begin: Adding a New Project

Proxytool was created with ease of use, making it simple and quick to add new projects and update existing ones. If you don't already have an account, what are you waiting for? Sign Up right away to ensure you never miss out on any wonderful features.

Once successfully signed in, you will be directed to the "Project Library". Click on "Add New Project" to start a new project. Enter your project's name and the backend URL you wish to use. Proxytool offers its backend, https://echo.proxytool.app. It is an echo server that responds with the request parameters. In our case, it will be the new backend's API.

After you click on CREATE, the project window takes you to the RULES tab. You can add and alter rules and fix the path for each.

Once you have added a rule, you can modify or add custom code for the requests and responses. You can manipulate the response from the mock server and the requests.

You can make simple modifications to the request, like changing the query or header. Add or remove parameters, and modify according to whatever suits best.

Switching between the Old and New Backend APIs

Proxytool brings you a simple, uncomplicated way to replace API with a new one without disturbing the existing frontend structure of your application. Don't want your front end suffering because of changes in the backend? Continue reading to find out how it’s done.

All you have to do is modify the response of the mock server. Add your custom code and modify the response object as you wish. You can change the parameters and direct the response depending on your application.

For the restaurant application, the code modifies the response to fit the format and structure of the old backend while retaining the structural integrity of the new backend. It also caters to the new feature, rating.

Integrating Proxytool Mock API with Your Web or Mobile Application

Now that you have used Proxytool’s mock API to ensure the front end can handle the new data structure and operate normally, the next step is to integrate your mock API with your application to see if it works.
Click the copy to clipboard icon to copy and append the URL and the path.

You can integrate the copied URL within your mobile or web application. After adding it to our Restaurant Application, the following result is displayed.

By integrating the mock API with our frontend application, we modify the server's response so that the front end receives the data from the new backend the old way. And it works just fine!

Wait, There’s More!

That’s not all of it! Proxytool offers additional features to make everything more convenient and time-saving.

Altering Rule

With Proxytool, it is possible to mock just a piece of your data on either the request or response side. Partial mock enables you to test just the code unit you are concerned with rather than testing the entire code.

For example, you are introducing a new method in your code. How will this addition work with the existing code? You can mock the response entirely. However, this may eliminate your existing endpoints. With Proxytool, you just have to change and replace the parameters in the existing response.

For example, in our restaurant application, if we wish to change the 'rating' for all places, we can use the Altering Rule to implement that.

Proxytool allows you to alter the rule instead of having to edit the entire code block. When you finish the frontend changes, you can turn off/delete the rule for the end-point.  

Conclusion

With Proxytool, we aim to deliver better, more effective mocking tools. For entities that function resource- and time-intensively, our goal is to enable you to smoothly transition between backend APIs without disturbing your frontend environment.

If you are someone having trouble switching from an old backend to a new one, get started with Proxytool right away!