Chapter 1: Complete Serverless Architectures

Activity 1: Creating a Serverless Application for Viewing User Data

1. Open the Azure Portal and click on the New Collection option to create a new collection called users in the Cosmos DB database named serverless.
2. Click on Documents inside the Collection, and then click on the New Document option to insert user data into the Cosmos DB. Create a user using the following JSON:

   {

     "name": "Daniel",

     "emailAddress": "[email protected]"

   }

3. Using the function from Exercise 4, Displaying Product Data on your Serverless Website, as a template, read the user data from the Cosmos DB and return it. Make the following changes to the function body:

   public static async Task<List<User>> Run([HttpTrigger(AuthorizationLevel.Function, "get", Route = null)]HttpRequest req, ILogger log)

   

   Figure 1.61: Function reading users from Cosmos DB

4. Now, use the index.html file from Exercise 4, Displaying Product Data on your Serverless Website, as a template, and create an index.html file in a folder called website. Adjust it to read from the GetUsers function using the following code:

   fetch('http://localhost:7071/api/GetUsers')

   Display the data in a table, using the following code for the function body:

   function rowOfDataFromObject(data){

     let row = document.createElement('tr');

     let nameTableElement = document.createElement('td');

     nameTableElement.appendChild(document.createTextNode(data.name))

     row.appendChild(nameTableElement);

     let emailTableElement = document.createElement('td');

     emailTableElement.appendChild(document.createTextNode(data.email))

     row.appendChild(emailTableElement);

     return row;

Figure 1.62: index.html displaying users