Skip to content

Latest commit

 

History

History
117 lines (73 loc) · 5.51 KB

README.md

File metadata and controls

117 lines (73 loc) · 5.51 KB
Raw

.NET Photo Gallery Web Application Sample with Azure Blob Storage

This sample application creates a web photo gallery that allows you to host and view images through a .NET web frontend. The code sample also includes functionality for deleting images. At the end, you have the option of:

  • Build the application and push the Docker image to Docker Hub with Github Actions.
  • Create the infraestrure Azure Blob Storage and Azure Container Instances using Bicep with Github Actions.

Azure Blob Storage Photo Gallery Web Application Sample .NET

Technologies used

  • NET Core 6.0
  • Azure Storage emulator
  • Azure Storage
  • Azure Container Instances
  • Azure Bicep
  • Github Actions
  • Docker Hub Registry

Azure Blob Storage Photo Gallery Web Application using ASP.NET MVC The sample uses the asynchronous programming model to demonstrate how to call the Storage Service using the Storage .NET client library's asynchronous APIs.

Running this sample

  1. Before you can run this sample, you must have the following prerequisites:

  2. Open the Azure Storage emulator. Once the emulator is running it will be able to process the images from the application.

  3. Clone this repository using Git for Windows (http://www.git-scm.com/), or download the zip file.

  4. From Visual Studio, open the net-photo-gallery.sln file from the root directory.

  5. In Visual Studio Build menu, select Build Solution (or Press F6).

  6. You can now run and debug the application locally by pressing F5 in Visual Studio.

Deploy this sample to Azure

Create a resource group. Later in this quickstart, you'll deploy your Bicep file to this resource group.

az group create --name myResourceGroup --location "eastus"

Deploy manually the template.

az deployment group create --resource-group myResourceGroup --template-file <path-to-template>

Deploy Bicep files by using GitHub Actions

Generate deployment credentials

az ad sp create-for-rbac --name myApp --role contributor --scopes /subscriptions/{subscription-id}/resourceGroups/myResourceGroup --sdk-auth

The output is a JSON object with the role assignment credentials that provide access to your App Service app similar to below. Copy this JSON object for later. You'll only need the sections with the clientId, clientSecret, subscriptionId, and tenantId values.

    {
      "clientId": "<GUID>",
      "clientSecret": "<GUID>",
      "subscriptionId": "<GUID>",
      "tenantId": "<GUID>",
      (...)
    }

Configure the GitHub secrets

Create secrets for your Azure credentials, resource group, and subscriptions.

In GitHub, navigate to your repository.

  • Select Security > Secrets and variables > Actions > New repository secret.

  • Paste the entire JSON output from the Azure CLI command into the secret's value field. Name the secret AZURE_CREDENTIALS.

  • Create another secret named AZURE_RG. Add the name of your resource group to the secret's value field (exampleRG).

  • Create another secret named AZURE_SUBSCRIPTION. Add your subscription ID to the secret's value field (example: 90fd3f9d-4c61-432d-99ba-1273f236afa2).

Configure Docker Hub Registry Token

Docker Hub lets you create personal access tokens as alternatives to your password. We wikk use tokens to access Hub images from the Github Actions.

To create your access token:

  • Log in to hub.docker.com.

  • Click on your username in the top right corner and select Account Settings.

  • Select Security > New Access Token.

  • Add a description for your token. Use something that indicates where the token will be used, or set a purpose for the token (e.g "Github Actions").

  • Copy the token that appears on the screen and save it. You will not be able to retrieve the token once you close this prompt.

Configure the GitHub secrets:

  • In GitHub, navigate to your repository.

  • Select Security > Secrets and variables > Actions > New repository secret.

  • Create a secret named DOCKERHUB_TOKEN. Add the value of the recently created Docker Hub token.

  • Create another secret named DOCKERHUB_USERNAME. Add your Docker Hub username.

About the code

The code included in this sample is meant to be a quick start sample for learning about Azure Web Apps and Azure Storage. It is not intended to be a set of best practices on how to build scalable enterprise grade web applications.

More information