Expose Custom APIs

Expose a custom API for a car rental management platform.

Intermediate Last updated: 19 May 2025

Open Example Preview

About

In this example, we demonstrate how to expose an API endpoint from a site. We create a car rental management platform and define an HTTP function. The car rental management system uses the Wix Data API to retrieve and display car data in a repeater, and allow employees to update a car’s price. The HTTP function creates a custom API to retrieve car data, which can be called by external applications.

APIs

• $w.Button API
• $w.Repeater API
• $w.Image API
• $w.Text API
• wix-http-functions
• Data

How we built it

We added the following to our site:

Page Elements

• A repeater to display the car data in the Cars collection.
• A dropdown element to select a car model.
• A text input element to enter a price of the selected car model.
• A button to update the car model’s price.

Collections

Cars: A collection containing data about the car models. Cars Location: A reference collection listing the available locations for the car models.

Frontend Code

Home

The code in this file manages the retrieval, display, and updating of car data for the rental management platform.

In this file, we:

• Declare variables to hold the car data, selected car model, and price input value.
• Retrieve car data from the Cars collection and populate the dropdown options and repeater.
• Implement event handlers for selecting a car model and inputting a price.
• Enable and disable the state of the update button based on valid user input.
• Define an object to hold the car item details for updating the collection.
• Implement an event handler to update the car item in the collection when the update button is clicked.
• Refresh the repeater after an update to display the most current data.

Backend Code

http-functions.js

The code in this file defines an HTTP function for retrieving car data from the Cars collection, allowing external applications to access the car data in JSON format by making a GET request to the following URL:

“https://velo-examples.wixstudio.com/data-example-sdk/_functions-dev/cars”

We defined the following function:

• get_cars(request): This function queries the Cars collection and returns the data, including the referenced car location details, as a JSON response. It also returns the appropriate HTTP status code based on the success or failure of the request.

Code Snippets

Get Help

Join the community

Join the Wix Studio community on Discord, where experienced developers and fellow creators come together to share tips, troubleshoot issues, and collaborate.

Hire a developer

Building a coded solution on your own can be challenging. Let an experienced Wix developer build it for you, so you can keep working on your site or business. Visit the Wix Marketplace to find a trusted developer.