Talk - Power Up Your BackEnd Applications with Serverless Architecture & Azure SQL

A demo related with the talk Power Up Your BackEnd Applications with Serverless Architecture & Azure SQL using:

Azure SQL
Prisma
Vue.Js
Azure Functions
Azure Static Web Apps

🚀 Resources Used

Visual Studio Code
Node.js - version 14.x
Postman
Azure Functions Core Tools - version 4.x
Azure SQL
Azure Free Account
Azure Static Web Apps
Azure Functions Vs Code Extension
Prisma Vs Code Extension

How to run the application locally?

To execute locally this project you will need to follow the steps bellow:

First you need to go to the folder: client and run the command:

> npm install

After to install all the Node.Js packages, now you can execute the command:

> npm run serve

Now, open your browser on http://localhost:8080/
Inside the project you will see a file: src/Api.js. This file contains all the Back-End request information (local or Azure Functions). If you want to test the Front-End, just choose which url you want to test in the Back-End:

/**
 * file: src/services/Api.js
 * data: 01/03/2022
 * description: file responsible for initializing 'axios' and HTTP base url requests
 * author: Glaucia Lemos <twitter: @glaucia_lemos86>
 */

import axios from 'axios';

export default () => axios.create({
  // => Back-End (local) 'baseURL'-> will make communication btw Front-End with Back-End
  // baseURL: 'http://localhost:3001/api/v1',

  // ==> Back-End (azure functions)
  baseURL: 'http://localhost:7071/api',
});

Back-End (local): http://localhost:3001/api/v1
Back-End (Azure Functions): http://localhost:7071/api

First you need to go to the folder: api and run the command:

> npm install

Include the Azure SQL Server connection string creating an .env file:

# Database connection string
DATABASE_URL="sqlserver://DB_SERVER_NAME.database.windows.net:1433;database=DB_NAME;user=DB_USER@DB_SERVER_NAME;password={PASSWORD};encrypt=true"

# Shadow database connection string for development
SHADOW_DATABASE_URL="sqlserver://DB_SERVER_NAME.database.windows.net:1433;database=DB_NAME;user=DB_USER@DB_SERVER_NAME;password={PASSWORD};encrypt=true"

Now create a file called: local.settings.json (root of the project) and include this information below:

{
  "IsEncrypted": false,
  "Values": {
    "FUNCTIONS_WORKER_RUNTIME": "node",
    "AzureWebJobsStorage": ""
  },
  "Host": {
    "LocalHttpPort": 7071,
    "CORS": "*"
  }
}

Now you can execute the command:

> npm run dev

You will see the message saying the application is running in the port: http://localhost:7071/api/

Objective	HTTP Verb	Route
CreateEmployee	POST	http://localhost:7071/api/employees
GetEmployees	GET	http://localhost:7071/api/employees
GetEmployee	GET	http://localhost:7071/api/{id}
UpdateEmployee	PUT	http://localhost:7071/api/{id}
DeleteEmployee	DELETE	http://localhost:7071/api/{id}