Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Publishing Static Website to Azure Blob Storage via GitHub Actions
# Activate static website hosting feature
az storage blob service-properties update \
--account-name <STORAGE_ACCOUNT_NAME> \
--static-website true \
--index-document index.html \
--404-document 404/index.html
az storage blob upload-batch \
-s dist \
-d \$web \
--account-name <STORAGE_ACCOUNT_NAME>
# Create a new Azure Resource Group
az group create \
-n <RESOURCE_GROUP_NAME> \
-l <LOCATION>
# Create a new Azure Storage instance
az storage account create \
-g <RESOURCE_GROUP_NAME> \
-n <STORAGE_ACCOUNT_NAME> \
-l <LOCATION> \
--sku Standard_LRS \
--kind StorageV2
{
...
"primaryEndpoints": {
"blob": "https://<STORAGE_ACCOUNT_NAME>.blob.core.windows.net/",
"dfs": "https://<STORAGE_ACCOUNT_NAME>.dfs.core.windows.net/",
"file": "https://<STORAGE_ACCOUNT_NAME>.file.core.windows.net/",
"queue": "https://<STORAGE_ACCOUNT_NAME>.queue.core.windows.net/",
"table": "https://<STORAGE_ACCOUNT_NAME>.table.core.windows.net/",
"web": "https://<STORAGE_ACCOUNT_NAME>.<ARBITRARY_VALUE>.web.core.windows.net/"
},
...
}
# Get the endpoint URL
az storage account show \
-g <RESOURCE_GROUP_NAME> \
-n <STORAGE_ACCOUNT_NAME>
name: <WORKFLOW_NAME>
on: <EVENT>
jobs:
<JOB_NAME>:
runs-on: <RUNNER>
steps:
- name: <ACTION_NAME>
uses: <ACTION>
name: Publish Static Web App to Azure Blob Storage
on: push
jobs:
build_and_publish:
runs-on: ubuntu-latest
steps:
- name: Checkout the repo
uses: actions/checkout@v1
- name: Login to Azure
uses: Azure/login@v1
with:
creds: ${{ secrets.AZURE_CREDENTIALS }}
- name: Install npm packages
shell: bash
run: |
cd $GITHUB_WORKSPACE/src/WebApp
npm install
- name: Build app
shell: bash
run: |
cd $GITHUB_WORKSPACE/src/WebApp
npm run build
- name: Test app
shell: bash
run: |
cd $GITHUB_WORKSPACE/src/WebApp
npm run test:unit
- name: Publish app
uses: Azure/cli@v1.0.0
with:
azcliversion: latest
inlineScript: |
az storage blob upload-batch -s $GITHUB_WORKSPACE/src/WebApp/dist -d \$web --account-name ${{ secrets.STORAGE_ACCOUNT_NAME }}
# Build the web app
gridsome build
# Install gridsome
npm install -g @gridsome/cli
# Create a website
gridsome create WebApp
# Run the web app locally
npm run develop
# Build the web app
npm run build
cd WebApp
# Run the web app locally
gridsome develop
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment