GitHub Actions 및 Azure Static Web Apps를 사용하여 랜딩 페이지 배포

이 문서에서는 GitHub 작업 및 Azure 정적 웹 앱을 사용하여 GitHub에서 지속적 통합을 배포하고 만드는 방법을 배웁니다.
먼저 html, css, JS만 사용하는 랜딩 페이지나 정적 사이트가 필요합니다.

GitHub 리포지토리에서 .github/workflows 폴더에 워크플로를 만들어야 합니다.
https://github.com/Mteheran/landingpagetoazure

내 워크플로우



이 워크플로에서는 기본 분기에 대한 변경 사항을 감지하고 이 분기에 대한 요청을 가져옵니다. "app_location"속성에서 앱이 있는 폴더를 설정하거나 기본 경로에 있는 경우 "/"를 사용해야 합니다.

name: Azure Static Web Apps for Static Sites

on:
  push:
    branches:
      - main
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - main

jobs:
  build_and_deploy_job:
    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
    runs-on: ubuntu-latest
    name: Build and Deploy Job
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true
      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          app_location: "/union" # App source code path
          skip_app_build: true

  close_pull_request_job:
    if: github.event_name == 'pull_request' && github.event.action == 'closed'
    runs-on: ubuntu-latest
    name: Close Pull Request Job
    steps:
      - name: Close Pull Request
        id: closepullrequest
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          action: "close"


AZURE_STATIC_WEB_APPS_API_TOKEN 비밀을 사용하여 Azure 정적 웹 앱을 배포합니다. 새 Azure 정적 사이트를 만든 후에는 사이트를 배포하기 위해 토큰을 가져오기만 하면 됩니다.


프로젝트 설정에서 Azure 정적 웹앱에서 값을 복사하여 이 키를 만들어야 합니다.

제출 카테고리:



[참고]: # DIY 배포

Yaml 파일 또는 코드 링크




므테헤란 / 랜딩페이지투아저


이것은 azure 정적 웹 앱에 게시된 랜딩 페이지의 간단한 데모입니다.





하늘색 방문 페이지


이것은 azure 정적 웹 앱에 게시된 랜딩 페이지의 간단한 데모입니다.
Azure 정적 웹 앱의 사이트
https://calm-bush-04ec74410.azurestaticapps.net

YML 파일


name: Azure Static Web Apps for Static Sites
on:
  push:
    branches:
      - main
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - main

jobs:
  build_and_deploy_job:
    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
    runs-on: ubuntu-latest
    name: Build and Deploy Job
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true
      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          app_location: "/union" # App source code path
          skip_app_build: true

  close_pull_request_job:
    if: github.event_name ==



View on GitHub


추가 리소스/정보



템플릿(연합)에 대한 링크: https://www.designbombs.com/freebie/union/

좋은 웹페이지 즐겨찾기