This article is contributed. See the original author and article here.

Getting started with Data API builder for Azure SQL Database or SQL Server


 


kevin_comba_0-1688562754496.png


 


What is Data API builder?


Data API builder for Azure Databases provides modern REST and GraphQL endpoints to your Azure Databases. Database objects can be safely exposed via REST or GraphQL endpoints with Data API builder, allowing your data to be accessed using modern approaches on any platform, language, or device. Granular security is ensured by an integrated and configurable policy engine; integration with Azure SQL,


SQL Server, PostgreSQL, MySQL, and Cosmos DB provides developers with unprecedented productivity.


Data API Builder Features



  1. REST operations like CRUD ( POST, GET, PUT, PATCH, DELETE) , filtering, sorting and pagination.

  2. GraphQL operations like queries and mutation, queries and mutations.

  3. Support authentication via OAuth2/JWT.

  4. Role-based authorization using received claims.

  5. Allow collections, tables, views and stored procedures to be accessed via REST and GraphQL.

  6. Full integration with Static Web Apps via Database Connection feature when running in Azure.

  7. Easy development via dedicated CLI.

  8. Open Source, you can always contribute


Our Focus.


In this blog, I’m going to walk you through a simple process to get started with Data API Builder with Microsoft SQL Database deployed on Azure. This can also be done using Azure Cosmos Db, Azure Database for PostgreSQL and Azure MySQL Database.


Prerequisites.



  • Basic understanding of Rest CRUD operations like POST and GET

  • Basic understanding of a relational database like Microsoft SQL or MYSQL

  • Willingness to follow along and learn as the above two prerequisites are not a must.


Requirements to get started.


Please click the below links to download .Net 6 and Vs Code editor, you can search Live Preview and Thunder client in the Vs code Extension Tab and install them.



Procedure



  1. Provision and deploy Microsoft SQL on Azure

  2. Create a Data API builder.

  3. Test our API with Thunder client & Insomnia

  4. Link our Azure SQL DB via Data API Builder to our simple HTML Page to view our Data.


kevin_comba_1-1688562810119.png


 


Provision and deploy Microsoft SQL on Azure


 



 


1.jpg


 



  • Search for SQL databases


 


Inked2.jpg


 



  • Click create to start provisioning your service.


 


Inked3.jpg


 



  • Select your subscription, create a resource group, enter a database name and select elastic pool no for this is just a demo project.


 


4.jpg


 



  • Create your SQL server and select a location.


 


Inked6.jpg


 



  • For authentication I have selected both SQL and Azure Active directory, but SQL alone is enough for authenticating this project. Add sever admin and password and keep the safe because we will need them later.


 


InkedInked5.jpg


 


 



  • After creating the SQL server, select locally – redundant backup for demo purposes.


 


Inked7.jpg


 



  • For these options, let’s go with the defaults.


 


Inked9.jpg


 


 



  • For these options, let’s go with the defaults.


 


Inked10.jpg


 



  • Create tags to identify your services on your resource group and create Review + create


 


Inked11.jpg


 


 



  • Click go to resources after deployment is complete


 


Inked13.jpg


 


 



  • On the overview you will see all the essential details of our SQL Database and SQL Server.


 


Inked14.jpg


 


 


 



  • Click on the Query editor and sign in with either SQL Server auth or Azure Active Directory


 


Inked16.jpg


 



  • You can view your database name below


 


Inked17.jpg


 


 



  • Click new query and add this code below to create two tables (Brand & Category) then click run to execute these queries.


 


Inked18.jpg


 


 


 



  • Add this insert statements to insert data in our database.


 


Inked20.jpg


 


 



  • click run to execute and check the message below ‘query succeeded’.


 


Inked22.jpg


 


 



  • refresh to view the newly created tables.


 


Inked23.jpg


 



  • You can easily view tables available in our database


 


Inked24.jpg


 


 



  • Run the below SQL Statement to confirm data inside our table.


 


Inked25.jpg


 


 


Inked26.jpg


 



  • On the connection string copy ADO.NET(SQL authentication) we will use it late.(NB: do not expose your connection string with password, I will do so for demo purposes)


 


Inked28.jpg


 


Create a Data API builder.


 



  • Back to our windows open windows PowerShell and type dotnet, if the below message doesn’t appear. Install .NET 6.0


kevin_comba_24-1688562888616.png


 



  • Run the below command to install Data API Builder locally.


 


kevin_comba_25-1688562888618.png


 



  • Confirm installation was successful by running the below command.


 


kevin_comba_26-1688562888619.png


 


Test our API with Thunder client & Insomnia


 


 



  • Open any folder you want to work on with VS Code then open your terminal. Run dab init –database-type “mssql” –connection-string “enter-your-connection-string-we-copied-in-the-above-steps”. Its good practice to use .env file on your root folder and call it on our connection string ie dab init –database-type “mssql” –connection-string “@env(‘my-connection-string’)”


 


Inked32.jpg


 



  • The command generates a config file called dab-config.json looking like this:


 


Inked33.jpg


 



  • Data-source will directly enable us to specify the database we are using and connection-string.The runtime will specify that our Data API will be consumed by both Rest endpoint is made available at the path `/api/` and GraphQL endpoint is available at `/graphql`. Under host we specify the mode of our data API either production or development, cors enables us to set origins example if yourdormain.com is your client app which will be sending request to your API you should add it under origins. Under authentication you can specify how you want to be authenticated.


 


kevin_comba_29-1688563499583.png


 


 



  • Add the below code for the brand category entities. This entities maps directly to your tables on Azure SQL database, wo do this by specifying the source. Permissions lets use specify the actions, “*” means all operations Create Edit Read Delete are enabled. With role you can assign people roles to do this actions above, anonymous will let anyone do all the actions.


 


kevin_comba_30-1688563499587.png


 



  • To start run the code below.


 


kevin_comba_31-1688563499589.png


 



 


kevin_comba_32-1688563499593.png


 



  • launch your Thunder client VS code extension( if on windows use CTRL + SHIFT + R). create a new request, select GET and https://localhost:5001/api/category. Click send and you should get a response from our deployed Azure SQL database.


 


kevin_comba_33-1688563499596.png


 


 



 


kevin_comba_34-1688563499598.png


 



  • The GET verb also supports several query parameters (also case sensitive) that allow you to manipulate and refine the requested data:

    • $orderby: return items in the specified order

    • $first: the top n items to return

    • $filter: expression to filter the returned items

    • $select: list of field names to be returned




 


kevin_comba_35-1688563499602.png


 


 



  • The query parameters select will Only select CategoryID field after you click send.


 


kevin_comba_36-1688563499604.png


 



  • The query parameters `filter` and `eq` will return CategoryName equal to Category x after you click send.


 


kevin_comba_37-1688563499606.png


 



  • Data API offers validations, example you can’t just send categoryName as the only field because our table requires both categoryName and categoryID. An error will be returned.


 


kevin_comba_38-1688563499608.png


 


 



  • REST Endpoint POST: create a new category after you add the json object below with that data and  click send.


 


kevin_comba_39-1688563499612.png


 



  • REST Endpoint POST: create a new category after you add the json object below with that data and  click send.


 


kevin_comba_40-1688563499614.png


 



  • REST Endpoint PUT: will update a category after you add the json object below with that data and  click send.


 


kevin_comba_41-1688563499617.png


 


 



  • Whenever you need to access a single item, you can get the item you want through a GET request by specifying its primary key example CategoryID


 


kevin_comba_42-1688563499620.png


 



  • To delete a record by specifying its primary key example CategoryID and set the HTPP request to delete, and click send.


 


kevin_comba_43-1688563499621.png


 



  • GraphQL endpoint is available at `/graphql`, set the HTPP request to post and provide the schema below and click send. For this example we need REST client like Postman or Insomnia to query. I have used Insomnia.


 


Inked50.jpg


 


 


 



  • This is how we filter using the filter method.


Inked51.jpg


 



  • This is how we orderBy descending or ascending.


 


Inked52.jpg


 


 


 


Link our Azure SQL DB via Data API Builder to our simple HTML Page to view our Data.


 For this demo am using a simple html page with jQuery and bootstrap. is helping me to make the HTTP request to our API server using fetch, get the response and append it to our html page dynamically.



  • Step one – add this code in index.html. and right click on the code to open with live server. Copy the URL displayed after the html page loads.


kevin_comba_47-1688563499636.png


 


 



  • Step two – Paste the URL below on the dab-config.json on origins. Save your code. On your terminal `CTRL + C` to terminate the  Data API server and start it again using `dab start`.


Inked54.jpg


 



  • There you go it, successfully connected your static web app with Data API builder for Azure Databases engine.


kevin_comba_49-1688563499646.png


 


 


Read more:



 


 

Brought to you by Dr. Ware, Microsoft Office 365 Silver Partner, Charleston SC.