Give & Get Example - Backend Web Modules

Let's take a look at some examples of using a backend web module from our Give & Get site (template). 

We use backend web modules to:

  • Create a (fictitious) delivery by calling an external delivery API (deliveries.jsw). Writing this code on the backend lets us securely retrieve the API key from the Secrets Manager and avoids any possible CORS issues we might have encountered when using the Fetch API.
  • Perform data operations on our site's database collections (giveawaysModule.jsw). Writing this code on the backend allows us to centralize all our database interactions in one place, override collection permissions when necessary, and modify the data retrieved from the database before sending it to the frontend.

Let's examine one of the functions from our backend web modules. The getMyGiveaways() function is used to get the giveaways that the current logged-in member has added to the site. The retrieved giveaways are used on the My Giveaways page to show members a list of all the giveaways they added.

Since the My Giveaways page doesn't display all of the information that we store for each giveaway, we can boost performance by only sending it the information it needs. For example, the list of giveaways doesn't display the giveaway descriptions, which can be quite large. So we save some transmission time by not sending the descriptions to the page.

Copy
1

In the web module giveawaysModule.jsw, we start by importing the functionality we need to work with database collections and our site's users.

Copy
1

Then, inside the getMyGiveaways() function we perform a query to find the current user's giveaways from the Giveaways collection. We destructure the query results so that we have the items returned by the query in a variable named giveaways.

Copy
1

Next we use the JavaScript map() function to create a pared-down version of the giveaway list that only contains the fields that are used on the My Giveaways page.

While we're at it, we also repackage some of the values with new keys to make the giveaway objects easy to use on the frontend.

Copy
1

All there's left to do now is return the new list of giveaways.

Copy
1

So that's the definition of the getMyGiveaways() function on the backend. Now, let's see how it's called on the My Giveaways page.

Copy
1

First, we import the getMyGiveaways() function from the backend web module.

Copy
1

Then, in the renderGiveawaysRepeater() function, which is called from the onReady event handler, we call the function and wait for the returned Promise to resolve. When it resolves we set the page's repeater to the returned giveaways list.

Copy
1
Was this helpful?
Yes
No