Blazor - Connect With Amazon DynamoDB Using AWS SDK

In this article, we will see how to create a Blazor application and connect with Amazon DynamoDB using AWS SDK. We will see how to create a Blazor application and connect with Amazon DynamoDB using AWS SDK.

In this article, we will see how to create a Blazor application and connect with Amazon DynamoDB using AWS SDK.

I have already explained about Blazor framework in my previous C# Corner articles. Please refer below articles to get the basic idea about Blazor framework.

Blazor is an experimental .NET web framework using C#/Razor and HTML that runs in the browser with WebAssembly. Blazor provides the benefits of a client-side web UI framework using .NET.
 
In the first article, I explained about how to connect Blazor app with CosmosDB using “Microsoft.Azure.DocumentDB.Core” NuGet package. In the second article, I have explained how to connect Blazor with PostgreSQL using Entity Framework Core.
 
Here, we will see how to connect the Blazor app with an Amazon DynamoDB table.
 
Please refer my previous article Getting Started With AWS Free Tier And Connect DynamoDB With .NET for more details about Amazon DynamoDB. I explained how to create a free AWS account for one year and how to connect DynamoDB with .NET WinForms application.
 
In this article, we will create a Student app in Blazor and will see all CRUD operations. We will use AWS SDK to connect DynamoDB with Blazor.
 
Please open Visual Studio 2017 (I am using free community edition) and create a Blazor app. Choose an ASP.NET Core Web Application project template.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK 
 
We can choose Blazor (ASP.NET Core hosted) template.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK
 
Our solution will be ready in a moment. Please note that there are three projects created in our solution - “Client”, “Server”, and “Shared”.

The client project contains all the client-side libraries and Razor Views, while the server project contains the Web API Controller and other business logic. The shared project contains the commonly shared files, like models and interfaces.

Blazor - Connect with Amazon DynamoDB Using AWS SDK
 
By default, Blazor created many files in these three projects. We can remove all the unwanted files like “Counter.cshtml”, “FetchData.cshtml”, “SurveyPrompt.cshtml” from Client project and “SampleDataController.cs” file from Server project and delete “WeatherForecast.cs” file from shared project too.
 
We can add “AWSSDK.DynamoDBv2” NuGet package to Shared project and server project. Both projects need this package. This SDK is used for creating connectivity between Blazor app and DynamoDB.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK
 
As I told earlier, we will create a Student app. First, we can create a student model in a shared project. Please create a “Models” folder and create a Student class file inside this folder.
 
Student.cs 

  1. using Amazon.DynamoDBv2.DataModel;  
  2. namespace BlazorDynamoDBStudentApp.Shared.Models {  
  3.     [DynamoDBTable("Student")]  
  4.     public class Student {  
  5.         [DynamoDBHashKey]  
  6.         public string StudentId {  
  7.             get;  
  8.             set;  
  9.         }  
  10.         public string Name {  
  11.             get;  
  12.             set;  
  13.         }  
  14.         public string Class {  
  15.             get;  
  16.             set;  
  17.         }  
  18.         public int Physics {  
  19.             get;  
  20.             set;  
  21.         }  
  22.         public int Maths {  
  23.             get;  
  24.             set;  
  25.         }  
  26.         public int Chemistry {  
  27.             get;  
  28.             set;  
  29.         }  
  30.         public int IsDeleted {  
  31.             get;  
  32.             set;  
  33.         }  
  34.     }  
  35. }  
Please note that we have used “DynamoDBTable” attribute to Student class and “DynamoDBHashKey” attribute to StudentId property in this class. This will create a Hashkey (Primary Key) in DynamoDB while creating the table.

We are using an Interface to define all the CRUD operations for our application. Please create “IDataAccessProvider” interface and copy below code to this file.

IDataAccessProvider.cs
  1. using System.Collections.Generic;  
  2. using System.Threading.Tasks;  
  3. namespace BlazorDynamoDBStudentApp.Shared.Models {  
  4.     public interface IDataAccessProvider {  
  5.         Task AddStudentRecord(Student student);  
  6.         Task UpdateStudentRecord(Student student);  
  7.         Task DeleteStudentRecord(string studentId);  
  8.         Task < Student > GetStudentSingleRecord(string studentId);  
  9.         Task < IEnumerable < Student >> GetStudentRecords();  
  10.     }  
  11. }  

We have defined the signature for our DataAcess class in this Interface.

We can create a new folder “DataAccess” in Server project and create the “DynamoDBInitializer” class.

DynamoDBInitializer.cs

  1. using Amazon;  
  2. using Amazon.DynamoDBv2;  
  3. using Amazon.DynamoDBv2.Model;  
  4. using Amazon.Runtime;  
  5. using System.Collections.Generic;  
  6. using System.Threading;  
  7. using System.Threading.Tasks;  
  8. namespace BlazorDynamoDBStudentApp.Server.DataAccess {  
  9.     public static class DynamoDBInitializer {  
  10.         private  
  11.         const string accessKey = "Your access Key";  
  12.         private  
  13.         const string secretKey = "Your secret Key";  
  14.         public static AmazonDynamoDBClient client;  
  15.         public static async Task InitializeDynamoDB() {  
  16.             string tableName = "Student";  
  17.             string hashKey = "StudentId";  
  18.             //Creating credentials and initializing DynamoDB client  
  19.             var credentials = new BasicAWSCredentials(accessKey, secretKey);  
  20.             client = new AmazonDynamoDBClient(credentials, RegionEndpoint.APSouth1);  
  21.             //Verify table  
  22.             var tableResponse = await client.ListTablesAsync();  
  23.             if (!tableResponse.TableNames.Contains(tableName)) {  
  24.                 //Table not found, creating table  
  25.                 await client.CreateTableAsync(new CreateTableRequest {  
  26.                     TableName = tableName,  
  27.                         ProvisionedThroughput = new ProvisionedThroughput {  
  28.                             ReadCapacityUnits = 3,  
  29.                                 WriteCapacityUnits = 1  
  30.                         },  
  31.                         KeySchema = new List < KeySchemaElement > {  
  32.                             new KeySchemaElement {  
  33.                                 AttributeName = hashKey,  
  34.                                     KeyType = KeyType.HASH  
  35.                             }  
  36.                         },  
  37.                         AttributeDefinitions = new List < AttributeDefinition > {  
  38.                             new AttributeDefinition {  
  39.                                 AttributeName = hashKey, AttributeType = ScalarAttributeType.S  
  40.                             }  
  41.                         }  
  42.                 });  
  43.                 bool isTableAvailable = false;  
  44.                 while (!isTableAvailable) {  
  45.                     //"Waiting for table to be active...  
  46.                     Thread.Sleep(5000);  
  47.                     var tableStatus = await client.DescribeTableAsync(tableName);  
  48.                     isTableAvailable = tableStatus.Table.TableStatus == "ACTIVE";  
  49.                 }  
  50.             }  
  51.         }  
  52.     }  
  53. }  

This is a static class. We have given the AWS access key and secret key inside this class. (You may create a config file for this purpose.)

We will call this static class while initializing the application. We have given the DynamoDB Table name inside this class. Every time application runs, this class will check the existence of DynamoDB Table and if not exists, it will create a new Table using the given credentials.
 
It also creates a static “AmazonDynamoDBClient” client variable and it will be used for creating AWS context in all CRUD operations.
We can create a “DataAccessDynamoDBProvider” class now. This class will implement all the CRUD actions we defined in IDataAccessProvider interface.
 
DataAccessDynamoDBProvider.cs
  1. using Amazon.DynamoDBv2.DataModel;  
  2. using Amazon.DynamoDBv2.DocumentModel;  
  3. using Amazon.DynamoDBv2.Model;  
  4. using BlazorDynamoDBStudentApp.Shared.Models;  
  5. using Microsoft.Extensions.Logging;  
  6. using System;  
  7. using System.Collections.Generic;  
  8. using System.Linq;  
  9. using System.Threading.Tasks;  
  10. namespace BlazorDynamoDBStudentApp.Server.DataAccess {  
  11.     public class DataAccessDynamoDBProvider: IDataAccessProvider {  
  12.         private readonly ILogger _logger;  
  13.         public DataAccessDynamoDBProvider(ILoggerFactory loggerFactory) {  
  14.             _logger = loggerFactory.CreateLogger("DataAccessDynamoDBProvider");  
  15.         }  
  16.         public async Task AddStudentRecord(Student student) {  
  17.             //Set a local DB context  
  18.             var context = new DynamoDBContext(DynamoDBInitializer.client);  
  19.             student.StudentId = Guid.NewGuid().ToString();  
  20.             student.IsDeleted = 0;  
  21.             //Save an Student object  
  22.             await context.SaveAsync < Student > (student);  
  23.         }  
  24.         public async Task UpdateStudentRecord(Student student) {  
  25.             //Set a local DB context  
  26.             var context = new DynamoDBContext(DynamoDBInitializer.client);  
  27.             //Getting an Student object  
  28.             List < ScanCondition > conditions = new List < ScanCondition > ();  
  29.             conditions.Add(new ScanCondition("StudentId", ScanOperator.Equal, student.StudentId));  
  30.             var allDocs = await context.ScanAsync < Student > (conditions).GetRemainingAsync();  
  31.             var editedState = allDocs.FirstOrDefault();  
  32.             if (editedState != null) {  
  33.                 editedState = student;  
  34.                 //Save an Student object  
  35.                 await context.SaveAsync < Student > (editedState);  
  36.             }  
  37.         }  
  38.         public async Task DeleteStudentRecord(string studentId) {  
  39.             const string tableName = "Student";  
  40.             var request = new DeleteItemRequest {  
  41.                 TableName = tableName,  
  42.                     Key = new Dictionary < string, AttributeValue > () {  
  43.                         {  
  44.                             "StudentId",  
  45.                             new AttributeValue {  
  46.                                 S = studentId  
  47.                             }  
  48.                         }  
  49.                     }  
  50.             };  
  51.             var response = await DynamoDBInitializer.client.DeleteItemAsync(request);  
  52.         }  
  53.         public async Task < Student > GetStudentSingleRecord(string id) {  
  54.             var context = new DynamoDBContext(DynamoDBInitializer.client);  
  55.             //Getting an Student object  
  56.             List < ScanCondition > conditions = new List < ScanCondition > ();  
  57.             conditions.Add(new ScanCondition("StudentId", ScanOperator.Equal, id));  
  58.             var allDocs = await context.ScanAsync < Student > (conditions).GetRemainingAsync();  
  59.             var student = allDocs.FirstOrDefault();  
  60.             return student;  
  61.         }  
  62.         public async Task < IEnumerable < Student >> GetStudentRecords() {  
  63.             var context = new DynamoDBContext(DynamoDBInitializer.client);  
  64.             //Getting an Student object  
  65.             List < ScanCondition > conditions = new List < ScanCondition > ();  
  66.             conditions.Add(new ScanCondition("IsDeleted", ScanOperator.Equal, 0));  
  67.             var allDocs = await context.ScanAsync < Student > (conditions).GetRemainingAsync();  
  68.             return allDocs;  
  69.         }  
  70.     }  
  71. }  

I have defined all the CRUD operations inside this class. All methods are asynchronous and self-explanatory. We will call these methods from our Web API controller.

We can add “StudentsController” controller now. This API controller will call all the methods in DataAccessDynamoDBProvider class.
 
StudentsController.cs
  1. using BlazorDynamoDBStudentApp.Shared.Models;  
  2. using Microsoft.AspNetCore.Mvc;  
  3. using System.Collections.Generic;  
  4. using System.Threading.Tasks;  
  5. namespace BlazorDynamoDBStudentApp.Server.Controllers {  
  6.     public class StudentsController: Controller {  
  7.         private readonly IDataAccessProvider _dataAccessProvider;  
  8.         public StudentsController(IDataAccessProvider dataAccessProvider) {  
  9.                 _dataAccessProvider = dataAccessProvider;  
  10.             }  
  11.             [HttpGet]  
  12.             [Route("api/Students/Get")]  
  13.         public async Task < IEnumerable < Student >> Get() {  
  14.                 return await _dataAccessProvider.GetStudentRecords();  
  15.             }  
  16.             [HttpPost]  
  17.             [Route("api/Students/Create")]  
  18.         public async Task Create([FromBody] Student student) {  
  19.                 if (ModelState.IsValid) {  
  20.                     await _dataAccessProvider.AddStudentRecord(student);  
  21.                 }  
  22.             }  
  23.             [HttpGet]  
  24.             [Route("api/Students/Details/{id}")]  
  25.         public async Task < Student > Details(string id) {  
  26.                 return await _dataAccessProvider.GetStudentSingleRecord(id);  
  27.             }  
  28.             [HttpPut]  
  29.             [Route("api/Students/Edit")]  
  30.         public async Task Edit([FromBody] Student student) {  
  31.                 if (ModelState.IsValid) {  
  32.                     await _dataAccessProvider.UpdateStudentRecord(student);  
  33.                 }  
  34.             }  
  35.             [HttpDelete]  
  36.             [Route("api/Students/Delete/{studentId}")]  
  37.         public async Task DeleteConfirmed(string studentId) {  
  38.             await _dataAccessProvider.DeleteStudentRecord(studentId);  
  39.         }  
  40.     }  
  41. }  

We have defined all the HTTP, GET, PUT, DELETE, and POST methods for our CRUD actions inside this controller. Please note all these methods are asynchronous.

We can modify the “ConfigureServices” method in Startup class in the Server project.
 
Please inject the dependency for “DataAccessDynamoDBProvider” class inside this method.
 
We must call the “InitializeDynamoDB” from “DynamoDBInitializer” class also in this method.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK

When our application starts, this dependency will be injected into service.

We have added all the files for shared and server project. We can now add the Razor views for our Client project. Please refer my previous Blazor articles for more details about Razor views.
 
We can modify the “NavMenu.cshtml” now. This is a Razor view file and used for controlling the navigation.
 
NavMenu.cshtml
  1. <div class="top-row pl-4 navbar navbar-dark">  
  2.     <a class="navbar-brand" href="">Student App</a>  
  3.     <button class="navbar-toggler" onclick=@ToggleNavMenu>  
  4.         <span class="navbar-toggler-icon"></span>  
  5.     </button>  
  6. </div>  
  7. <div class=@(collapseNavMenu ? "collapse" : null) onclick=@ToggleNavMenu>  
  8.     <ul class="nav flex-column">  
  9.         <li class="nav-item px-3">  
  10.             <NavLink class="nav-link" href="" Match=NavLinkMatch.All>  
  11.                 <span class="oi oi-home" aria-hidden="true"></span> Home </NavLink>  
  12.         </li>  
  13.         <li class="nav-item px-3">  
  14.             <NavLink class="nav-link" href="/liststudents">  
  15.                 <span class="oi oi-list-rich" aria-hidden="true"></span> Student Details </NavLink>  
  16.         </li>  
  17.     </ul>  
  18. </div>   
  19. @functions   
  20. {   
  21.   bool collapseNavMenu = true;   
  22.   void ToggleNavMenu()   
  23.   {   
  24.     collapseNavMenu = !collapseNavMenu;   
  25.   }   
  26. }  

We already have a NavMenu.cshtml file under Shared folder but replace with above code.

We can add a “ListStudents.cshtml” Razor view file under “Pages” folder now.
 
ListStudents.cshtml
  1. @using BlazorDynamoDBStudentApp.Shared.Models    
  2. @page "/liststudents"    
  3. @inject HttpClient Http    
  4.     
  5. <h1>Student Details</h1>    
  6. <p>    
  7.     <a href="/addstudent">Create New Student</a>    
  8. </p>    
  9. @if (studentList == null)    
  10. {    
  11.     <p><em>Loading...</em></p>    
  12. }    
  13. else    
  14. {    
  15.     <table class='table'>    
  16.         <thead>    
  17.             <tr>    
  18.                 <th>Name</th>    
  19.                 <th>Class</th>    
  20.                 <th>Physics</th>    
  21.                 <th>Chemistry</th>    
  22.                 <th>Maths</th>    
  23.                 <th>Total</th>    
  24.                 <th>Average</th>    
  25.             </tr>    
  26.         </thead>    
  27.         <tbody>    
  28.             @foreach (var student in studentList)    
  29.             {    
  30.                 total = @student.Maths + @student.Physics + @student.Chemistry;    
  31.                 avg = (@student.Maths + @student.Physics + @student.Chemistry) / 3;    
  32.                 <tr>    
  33.                     <td>@student.Name </td>    
  34.                     <td>@student.Class</td>    
  35.                     <td>@student.Physics</td>    
  36.                     <td>@student.Chemistry</td>    
  37.                     <td>@student.Maths</td>    
  38.                     <td>@total</td>    
  39.                     <td>@avg</td>    
  40.                     <td>    
  41.                         <a href='/editstudent/@student.StudentId'>Edit</a>    
  42.                         <a href='/deletestudent/@student.StudentId'>Delete</a>    
  43.                     </td>    
  44.                 </tr>    
  45.             }    
  46.         </tbody>    
  47.     </table>    
  48. }    
  49. @functions {    
  50. Student[] studentList;    
  51. int total;    
  52. float avg;    
  53. protected override async Task OnInitAsync()    
  54. {    
  55.     studentList = await Http.GetJsonAsync<Student[]>("/api/Students/Get");    
  56. }      
  57. }    

Above Razor view file will display all the student information in a HTML table format.

We can add “AddStudent.cshtml” view now.
 
AddStudent.cshtml
  1. @using BlazorDynamoDBStudentApp.Shared.Models    
  2. @page "/addstudent"    
  3. @inject HttpClient Http    
  4. @inject Microsoft.AspNetCore.Blazor.Services.IUriHelper UriHelper    
  5.     
  6. <h2>Create Student</h2>    
  7. <hr />    
  8. <div class="row">    
  9.     <div class="col-md-4">    
  10.         <form>    
  11.             <div class="form-group">    
  12.                 <label for="Name" class="control-label">Name</label>    
  13.                 <input for="Name" class="form-control" bind="@student.Name" />    
  14.             </div>    
  15.             <div class="form-group">    
  16.                 <label for="Class" class="control-label">Class</label>    
  17.                 <input for="Class" class="form-control" bind="@student.Class" />    
  18.             </div>    
  19.             <div class="form-group">    
  20.                 <label for="Physics" class="control-label">Physics</label>    
  21.                 <input for="Physics" class="form-control" bind="@student.Physics" />    
  22.             </div>    
  23.             <div class="form-group">    
  24.                 <label for="Chemistry" class="control-label">Chemistry</label>    
  25.                 <input for="Chemistry" class="form-control" bind="@student.Chemistry" />    
  26.             </div>    
  27.             <div class="form-group">    
  28.                 <label for="Maths" class="control-label">Maths</label>    
  29.                 <input for="Maths" class="form-control" bind="@student.Maths" />    
  30.             </div>    
  31.             <div class="form-group">    
  32.                 <input type="button" class="btn btn-default" onclick="@(async () => await CreateStudent())" value="Save" />    
  33.                 <input type="button" class="btn" onclick="@Cancel" value="Cancel" />    
  34.             </div>    
  35.         </form>    
  36.     </div>    
  37. </div>    
  38. @functions {    
  39.     
  40. Student student = new Student();    
  41.     
  42. protected async Task CreateStudent()    
  43. {    
  44.     await Http.SendJsonAsync(HttpMethod.Post, "/api/Students/Create", student);    
  45.     UriHelper.NavigateTo("/liststudents");    
  46. }    
  47.     
  48. void Cancel()    
  49. {    
  50.     UriHelper.NavigateTo("/liststudents");    
  51. }    
  52. }    
Please add below two Razor view files inside the Pages folder.
 
EditStudent.cshtml
  1. @using BlazorDynamoDBStudentApp.Shared.Models    
  2. @page "/editstudent/{StudentId}"    
  3. @inject HttpClient Http    
  4. @inject Microsoft.AspNetCore.Blazor.Services.IUriHelper UriHelper    
  5.     
  6. <h2>Edit</h2>    
  7. <h4>Student</h4>    
  8. <hr />    
  9. <div class="row">    
  10.     <div class="col-md-4">    
  11.         <form>    
  12.             <div class="form-group">    
  13.                 <label for="Name" class="control-label">Name</label>    
  14.                 <input for="Name" class="form-control" bind="@student.Name" />    
  15.             </div>    
  16.             <div class="form-group">    
  17.                 <label for="Class" class="control-label">Class</label>    
  18.                 <input for="Class" class="form-control" bind="@student.Class" />    
  19.             </div>    
  20.             <div class="form-group">    
  21.                 <label for="Physics" class="control-label">Physics</label>    
  22.                 <input for="Physics" class="form-control" bind="@student.Physics" />    
  23.             </div>    
  24.             <div class="form-group">    
  25.                 <label for="Chemistry" class="control-label">Chemistry</label>    
  26.                 <input for="Chemistry" class="form-control" bind="@student.Chemistry" />    
  27.             </div>    
  28.             <div class="form-group">    
  29.                 <label for="Maths" class="control-label">Maths</label>    
  30.                 <input for="Maths" class="form-control" bind="@student.Maths" />    
  31.             </div>    
  32.             <div class="form-group">    
  33.                 <input type="button" value="Save" onclick="@(async () => await UpdateStudent())" class="btn btn-default" />    
  34.                 <input type="button" value="Cancel" onclick="@Cancel" class="btn" />    
  35.             </div>    
  36.         </form>    
  37.     </div>    
  38. </div>    
  39. @functions {    
  40.     
  41. [Parameter]    
  42. string StudentId { get; set; }    
  43.     
  44. Student student = new Student();    
  45.     
  46. protected override async Task OnInitAsync()    
  47. {    
  48.     student = await Http.GetJsonAsync<Student>("/api/Students/Details/" + StudentId);    
  49. }    
  50.     
  51. protected async Task UpdateStudent()    
  52. {    
  53.     await Http.SendJsonAsync(HttpMethod.Put, "api/Students/Edit", student);    
  54.     UriHelper.NavigateTo("/liststudents");    
  55.     
  56. }    
  57.     
  58. void Cancel()    
  59. {    
  60.     UriHelper.NavigateTo("/liststudents");    
  61. }      
  62. }  
DeleteStudent.cshtml
  1. @using BlazorDynamoDBStudentApp.Shared.Models    
  2. @page "/deletestudent/{studentId}"    
  3. @inject HttpClient Http    
  4. @inject Microsoft.AspNetCore.Blazor.Services.IUriHelper UriHelper    
  5.     
  6. <h2>Delete</h2>    
  7. <p>Are you sure you want to delete this Student with id :<b> @studentId</b></p>    
  8. <br />    
  9. <div class="col-md-4">    
  10.     <table class="table">    
  11.         <tr>    
  12.             <td>Name</td>    
  13.             <td>@student.Name</td>    
  14.         </tr>    
  15.         <tr>    
  16.             <td>Class</td>    
  17.             <td>@student.Class</td>    
  18.         </tr>    
  19.         <tr>    
  20.             <td>Physics</td>    
  21.             <td>@student.Physics</td>    
  22.         </tr>    
  23.         <tr>    
  24.             <td>Chemistry</td>    
  25.             <td>@student.Chemistry</td>    
  26.         </tr>    
  27.         <tr>    
  28.             <td>Maths</td>    
  29.             <td>@student.Maths</td>    
  30.         </tr>    
  31.     </table>    
  32.     <div class="form-group">    
  33.         <input type="button" value="Delete" onclick="@(async () => await Delete())" class="btn btn-default" />    
  34.         <input type="button" value="Cancel" onclick="@Cancel" class="btn" />    
  35.     </div>    
  36. </div>    
  37. @functions {    
  38.     
  39. [Parameter]    
  40. string studentId { get; set; }    
  41.     
  42. Student student = new Student();    
  43.     
  44. protected override async Task OnInitAsync()    
  45. {    
  46.     student = await Http.GetJsonAsync<Student>    
  47. ("/api/Students/Details/" + studentId);    
  48. }    
  49.     
  50. protected async Task Delete()    
  51. {    
  52.     await Http.DeleteAsync("api/Students/Delete/" + studentId);    
  53.     UriHelper.NavigateTo("/liststudents");    
  54. }    
  55.     
  56. void Cancel()    
  57. {    
  58.     UriHelper.NavigateTo("/liststudents");    
  59. }      
  60. }   
We have completed all the coding part. We can check the application. Please run the application. Our home page looks like below.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK
 
We can create a Student record now.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK

Please note StudentId will be created automatically by the system. I used GUID to create StudentId.

We can create two more student records now. Our records will be displayed like below. I have additionally added Total and Average of three marks Physics, Chemistry and Maths.

Blazor - Connect with Amazon DynamoDB Using AWS SDK 
We can try to edit one student record now.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK

I have edited the name of the student.

We can delete one student record now.

Blazor - Connect with Amazon DynamoDB Using AWS SDK

We have seen all the CRUD actions in this app.

We can now open AWS Management Console and see the DynamoDB table and items (records) there. Please open Services and open DynamoDB from database tab. You can see the student table there. We have created the table with StudentId as partition (Primary) key. Please click the student table.

Blazor - Connect with Amazon DynamoDB Using AWS SDK
 
We can see the previously created records there. (We already deleted one student record),
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK
You can edit the record in AWS console also. For that, please click the partition key. Here StudentId is the partition key. Please click on that link.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK
 
We can take the backup of our table on regular basis. You can even maintain a continuous backup also.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK
 
Please give a name to your backup.
 
Blazor - Connect with Amazon DynamoDB Using AWS SDK

We can restore the data from this backup file when needed. We can create a new table also from this backup file.

In this article, we have created a Blazor app using ASP.NET Core hosted template. After that, we created a DynamoDB table using AWS SDK. We inserted, edited, and deleted Student data from DynamoDB. We also created a DynamoDB table back up in AWS Management Console.
 
We will see more exciting features of Blazor and DynamoDB in upcoming articles. Reference articles on Blazor and Amazon DynamoDB in C# Corner are mentioned below.