Sharing Code and Resources

By Ashwin Venugopal -

 





Setting Up The API

Only Blazor WebAssembly requires access to the Web API because it lacks direct access to the database. For Blazor Server, it's likely that the most prevalent architecture involves utilizing a Web API as well. We need to transfer the files we can share into a different library. To accomplish this, please follow these steps:

  • Right-click on the MyBlog solution and select Add | New Project.

  • Search for Class Library (.NET Core) and then click Next.

  • Name the project MyBlog.Data.Shared and keep the location as is and then click Create.  

  • Select target framework .NET 5.0 (Current) and then click Create.

  • Right-click on the Dependencies node under the MyBlogWebAssembly.Client project. Click Add project reference, check the MyBlog.Data.Shared and MyBlog.Shared checkboxes, and then click OK.

  • Move the following files from the MyBlog.Data project to MyBlog.Data. Shared:

Extension - folder

Interfaces - folder

Models/BlogPost.cs

Models/Category.cs

Models/Tag.cs

MyBlogApiClientSide.cs

These are the files that are the same regardless of the hosting model.

  • We need to add some NuGet Packages to get things working. Right-click in the Dependencies node under the MyBlog.Data.Shared project and select Manage NuGet Packages.

  • Search for Newtonsoft.Json and then click Install.

  • Search for Microsoft.AspNetCore.Components.WebAssembly. Authentication and then click Install.

  • Search for Microsoft.Extensions.Http and then click Install.

  • Now we need to reference the new project. Right-click on the Dependencies node under the MyBlog.Data project and click Add project reference.

  • Check MyBlog.Data.Shared and then click OK.

  • Right-click on the Dependencies node under the MyBlog.Shared project and then click Add project reference.

  • Check MyBlog.Data.Shared and then click OK.

Now we have moved the classes that are shareable to a new library.

Moving The Components

Initially, we need to set up a new project and transfer some files. To achieve this, follow the steps below:

  • Right-click on the MyBlog solution and select Add | New project.

  • Search for Razor and you should find a template called Razor Class Library. Select that template and click Next.

  • Name the project MyBlog.Shared, leave the location as is (it should be in the correct folder already), and then click Next.

  • Select Target Framework .NET 5.0 (Current) and make sure Support pages and views are unchecked. Then, click Create.

  • Add a reference to the MyBlog.Data.Shared project by right-clicking the Dependencies node under the MyBlog.Shared project and selecting Add project reference. Check the MyBlog.Data.Shared checkbox and then click OK.

  • Add a NuGet package by right-clicking Dependencies under the MyBlog.Shared node and selecting Manage NuGet Packages.

  • Search for Markdig and then click Install.

  • Tick the Include pre-release box. Search for Microsoft.AspNetCore.Components.Web.Extensions and then click Install. Untick the Include pre-release box.

  • Search for Microsoft.AspNetCore.Components.WebAssembly. Authentication and then click Install.

  • Now we need to add some namespaces. Open the _Imports.razor file and replace the content.

  • Right-click on the MyBlog.Shared project and then select Add | New Folder. Name the folder Components.

  • Now, move all the files except LoginDisplay.razor from the Components folder in the MyBlogServerSide project to the Components folder in the MyBlog.Shared project. The Login display differs a bit depending on the hosting platform, so we don't want to share that one.

  • Right-click on the MyBlog.Shared project and then select Add | New Folder. Name the folder Pages.

  • Move the Admin folder from the Pages folder in the MyBlogServerSide project to the Pages folder in the MyBlog.Shared project.

  • Move the Index.razor and Post.razor files from the Pages folder in the MyBlogServerSide project to the Pages folder in the MyBlog.Shared project.

  • Right-click on the MyBlog.Shared project and then select Add | New Folder. Name the folder Shared.

  • Move the NavMenu.razor file from the Shared folder in the MyBlogServerSide project to the Shared folder in the MyBlog.Shared project.

  • Add a reference to the MyBlog.Shared project by right-clicking the Dependencies node under the MyBlogServerSide project and selecting Add project reference. Check the MyBlog.Shared checkbox and then click OK.

Now we have moved all the files we want to share between the projects and configured the MyBlogServerSide project.

Conclusion

We have successfully set up an API and moved all the files from the shared folder.

































Comments

Post a Comment

Popular posts from this blog

How AMI Store & Restore Works?

By Ashwin Venugopal -
Image
  CreateStoreImageTask The CreateStoreImageTask API stores an AMI as a single object in an S3 bucket. The API initiates a task that collects all the data from the AMI and its associated snapshots, subsequently using an S3 multipart upload to store this data in an S3 object. It gathers all elements of the AMI, including most of the non-Region-specific metadata and all EBS snapshots included in the AMI, and consolidates them into a single object in S3. During the upload process, the data is compressed to minimize the space utilized in S3, which means that the S3 object could be smaller than the total sizes of the snapshots in the AMI. If the account making this API call has access to AMI and snapshot tags, they will be retained. The S3 object shares the same ID as the AMI, except it has a .bin extension. Additionally, the S3 metadata tags for the object include the AMI name, AMI description, AMI registration date, AMI owner account, and a timestamp indicating when the store operation...
Read more

Information Protection Scanner: Resolve Issues with Information Protection Scanner Deployment

By Ashwin Venugopal -
Image
  About If you are experiencing problems with the Microsoft Purview Information Protection scanner, check the health of your deployment by utilizing the Start-ScannerDiagnosticsPowerShell cmdlet to start the scanner diagnostic tool. The diagnostics tool checks the following details and then creates a log files with the results: Whether the database is up to date. Whether network URLs are accessible. Whether there's a valid authentication token and policy can be acquired. Whether the profile is defined in the Azure portal. Whether offline/online configuration exists and can be acquired. Whether the rules configured are valid.  The Start-ScannerDiagnostics command does not perform a comprehensive check of prerequisites. If you encounter problems with the scanner, you need to verify that your system meets the scanner's requirements, and that your scanner's configuration and installation are finished.  Verify Scanning Details Per Scanner Node and Repository Run the Get-ScanSt...
Read more

Create A Store Image Task

By Ashwin Venugopal -
Image
  Introduction When you save an AMI in an S3 bucket, a task for storing the image is initiated. This store image task allows you to track the progress and result of the procedure. Securing your AMIs It is crucial to verify that the S3 bucket is set up with adequate security to protect the content of the AMI and that this security is upheld for the entire duration that the AMI objects are stored in the bucket. If this cannot be achieved, it is advisable to refrain from using these APIs. Make sure that public access to the S3 bucket is prohibited. It is suggested to activate Server-side encryption for the S3 buckets where you keep the AMIs, even though it’s not mandatory. When AMI snapshots are transferred to the S3 object, they are sent over TLS connections. It is possible to save AMIs that contain encrypted snapshots; however, the snapshots will be decrypted during the storing process. Identify the source AMI used to create a new Amazon EC2 AMI You can determine the AMI that was us...
Read more