login VS hub-feedback

name: Static Web App - Build and Deploy 🏗️ on: push: branches: - main pull_request: types: [opened, synchronize, reopened, closed] branches: - main workflow_dispatch: permissions: id-token: write contents: write pull-requests: write env: LOCATION: westeurope STATICWEBAPPNAME: blog.johnnyreilly.com jobs: build_and_deploy_swa_job: if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed') runs-on: ubuntu-latest name: Site build and deploy 🏗️ steps: - name: Checkout 📥 uses: actions/checkout@v3 # Auth between GitHub and Azure is handled by https://github.com/jongio/github-azure-oidc # https://github.com/Azure/login#sample-workflow-that-uses-azure-login-action-using-oidc-to-run-az-cli-linux # other login options are possible too - name: AZ CLI login 🔑 uses: azure/login@v1 with: client-id: ${{ secrets.AZURE_CLIENT_ID }} tenant-id: ${{ secrets.AZURE_TENANT_ID }} subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }} - name: Get preview URL 📝 id: static_web_app_preview_url uses: azure/CLI@v1 with: inlineScript: | DEFAULTHOSTNAME=$(az staticwebapp show -n '${{ env.STATICWEBAPPNAME }}' | jq -r '.defaultHostname') PREVIEW_URL="https://${DEFAULTHOSTNAME/.[1-9]./-${{github.event.pull_request.number }}.${{ env.LOCATION }}.1.}" echo "PREVIEW_URL=$PREVIEW_URL" >> $GITHUB_OUTPUT - name: Setup Node.js 🔧 uses: actions/setup-node@v3 with: node-version: '18' cache: 'yarn' - name: Install and build site 🔧 run: | cd blog-website yarn install --frozen-lockfile yarn run build cp staticwebapp.config.json build/staticwebapp.config.json - name: Get API key 🔑 id: static_web_app_apikey uses: azure/CLI@v1 with: inlineScript: | APIKEY=$(az staticwebapp secrets list --name '${{ env.STATICWEBAPPNAME }}' | jq -r '.properties.apiKey') echo "APIKEY=$APIKEY" >> $GITHUB_OUTPUT - name: Deploy site 🚀 id: static_web_app_build_and_deploy uses: Azure/static-web-apps-deploy@v1 with: azure_static_web_apps_api_token: ${{ steps.static_web_app_apikey.outputs.APIKEY }} repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments) action: 'upload' skip_app_build: true app_location: '/blog-website/build' # App source code path api_location: '/blog-website/api' # Api source code path - optional outputs: preview-url: ${{steps.static_web_app_preview_url.outputs.PREVIEW_URL}} integration_tests_job: name: Integration tests 💡🏠 needs: build_and_deploy_swa_job if: github.event_name == 'pull_request' && github.event.action != 'closed' runs-on: ubuntu-latest steps: - uses: actions/checkout@v3 - name: Wait for preview ${{ needs.build_and_deploy_swa_job.outputs.preview-url }} ⌚ id: static_web_app_wait_for_preview uses: nev7n/wait_for_response@v1 with: url: '${{ needs.build_and_deploy_swa_job.outputs.preview-url }}' responseCode: 200 timeout: 600000 interval: 1000 - uses: actions/setup-node@v3 with: node-version: 18 - name: Install dependencies run: npm ci working-directory: ./blog-website-tests - name: Install Playwright Browsers run: npx playwright install --with-deps working-directory: ./blog-website-tests - name: Run Playwright tests env: PLAYWRIGHT_TEST_BASE_URL: '${{ needs.build_and_deploy_swa_job.outputs.preview-url }}' run: npx playwright test working-directory: ./blog-website-tests - uses: actions/upload-artifact@v3 if: always() with: name: playwright-report path: blog-website-tests/playwright-report/ retention-days: 30 close_pull_request_job: if: github.event_name == 'pull_request' && github.event.action == 'closed' runs-on: ubuntu-latest name: Cleanup staging 💥 steps: - name: AZ CLI login 🔑 uses: azure/login@v1 with: client-id: ${{ secrets.AZURE_CLIENT_ID }} tenant-id: ${{ secrets.AZURE_TENANT_ID }} subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }} - name: Get API key 🔑 id: apikey uses: azure/CLI@v1 with: inlineScript: | APIKEY=$(az staticwebapp secrets list --name '${{ env.STATICWEBAPPNAME }}' | jq -r '.properties.apiKey') echo "APIKEY=$APIKEY" >> $GITHUB_OUTPUT - name: Destroy staging environment 💥 id: closepullrequest uses: Azure/static-web-apps-deploy@v1 with: azure_static_web_apps_api_token: ${{ steps.apikey.outputs.APIKEY }} action: 'close'

Azure Login

We leveraged many existing GitHub Actions such as actions/checkout, azure/CLI and azure/login to build our pipeline. The built-in support for bash scripts provides all the flexibilities we needed to complete it.

Interesting - do you use https://github.com/Azure/login in GitHub Actions, or do you just create GitHub secrets and use those as env vars in the action steps?

In order for the workflow to successfully log in to the Azure subscriptions, you will need to make sure that you have created a Service Principal with the appropriate permissions. Once the Service Principal has been created you can add the details to a repository secret on GitHub. You can find out more about how to create this Service Principal on the ‘Azure/Login’ GitHub repo. Once created, you secrets might look like the below.

This error actually makes sense. If you've seen any of my recent talks / posts, you may have noticed that I talk about how each GitHub Action is just another GitHub repository that follows a specific standard. Each GitHub Action has an action.yml file in the root of the GitHub repository. This is available for the Azure/login action here.

Image Registry Account: Sign up for an account on GitHub, DockerHub, or any other container image registry. You'll use this account to store and manage your container images.

Docker installed on the system, also create an account on DockerHub, we will use this to store our Docker images.

$ docker run hello-world Unable to find image 'hello-world:latest' locally latest: Pulling from library/hello-world 1b930d010525: Pull complete Digest:sha256:b8ba256769a0ac28dd126d584e0a2011cd2877f3f76e093a7ae560f2a5301c00 Status: Downloaded newer image for hello-world:latest Hello from Docker! This message shows that your installation appears to be working correctly. To generate this message, Docker took the following steps: 1. The Docker client contacted the Docker daemon. 2. The Docker daemon pulled the "hello-world" image from the Docker Hub. (amd64) 3. The Docker daemon created a new container from that image which runs the executable that produces the output you are currently reading. 4. The Docker daemon streamed that output to the Docker client, which sent it to your terminal. To try something more ambitious, you can run an Ubuntu container with: $ docker run -it ubuntu bash Share images, automate workflows, and more with a free Docker ID: https://hub.docker.com/ For more examples and ideas, visit: https://docs.docker.com/get-started/

ECR is like Docker hub where I can store the Docker image I build.

image: this key specifies the image this container is based on to be created. It can be a local image or an image from the Docker hub.

Finally, we can upload our application to Docker Hub so that other people can use the image we created. To do this, follow the steps below:

Pull the official Docker distribution of pgAdmin 4 from the Docker Hub repository with the following command:

To use Docker Scout, you'll first have to have a Docker Hub account. Follow the installation instructions for Docker Scout on GitHub. Once Docker Scout is installed, you can sign in to Docker Hub on the command line with the docker login command.

Go to Docker Hub, sign up, and log in to your account's overview page.

Login to Docker [Create an account with https://hub.docker.com/]