Azure

Static Net Apps – Deployments

In my earlier article, we reviewed methods to configure the Again-Finish for our Sinlge Plage Purposes (SPA’s) utilizing Azure Features and methods to use the Static Net App CLI software to construct and execute from our native machines (works on my machine certification)

On this entry we’ll evaluate methods to configure our Static Net App from our supply code repositories in GitHub or Azure DevOps.

Supply repository from GitHub or Azure DevOps

To deploy an Azure Static Net App the commonest and extra used method to make use of launch pipelines utilizing GitHub Actions or pipelines in Azure DevOps. There are another methods just like the CLI (however at this level I am getting some error attempting it)

On this submit, I am going to concentrate on studying methods to accomplish the duty from a code repository in Azure DevOps. And simply to recollect I’ve been utilizing a vanilla JavaScript app, however this idea apply to some other JS framework like Angular, React, Vue, and many others.

Static Net App configuration in Azure

Step one shall be to configure the Static Net App in Azure

Static Web Apps- Deployments

As soon as now we have the frequent settings configured, just like the subscription, useful resource group, and title, we’ll have our first determination to make, we have to choose the Internet hosting Plan, We will verify for the comparability desk to make your determination.

Static Web Apps- Deployments

One other essential level is to know that the service is accessible solely in a restricted checklist of areas.

Static Web Apps- Deployments

Following our subsequent step we have to configure the repository for our code. As talked about earlier than, I am going to configure it utilizing my Azure DevOps occasion.

Static Web Apps- Deployments

And as soon as our repository is configured, it would present us a brand new part the place we’ll configure the construct parameters (people who we noticed within the earlier submit the place we used to configure with the CLI)

Static Web Apps- Deployments

The results of all of those actions we’ll be the Static Net App asset configured however we’ll additionally end with a configured Azure DevOps Pipeline (with yaml code) on our repository.

Static Web Apps- Deployments

Handbook Pipeline

However if you’re like me, you’ll favor to configure your individual pipeline. On this case, we have to choose ‘Different’ choice on the supply once we are creating our Static Net App in Azure

And as soon as created, we’ll have to get the Deployment Token that you could find within the header of the created useful resource.

Static Web Apps- Deployments

With this, we’ll proceed to create the Azure DevOps pipeline utilizing the next code:

set off: none
 
pool:
  vmImage: ubuntu-latest
 
steps:
- job: AzureStaticWebApp@0
  inputs:
    app_location: '.'
    output_location: '.'
    api_location: 'api'
    azure_static_web_apps_api_token: '$(deployment_token)'

and as you’ll be able to see, we have to configure the variable within the pipeline

Static Web Apps- Deployments

Conclusions

As you’ll be able to see, the method could be very easy and we might even say that it’s nearly 100% automated.

Within the subsequent submit, we’ll speak about methods to use an ASP.NET Net API software as our backend, being a substitute for the Azure Features that we noticed within the final posts.

Tags
Show More

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Close