GitHub 작업 사용

나는 Azure 정적 웹 응용 프로그램에서 내 사이트를 실행한 지 한참 되었는데, 그것은 매우 멋있다.
Azure에서 정적 웹 응용 프로그램을 만들 때, 원본 코드의github repo, 심지어 사용할 지점까지 요청받을 수 있습니다.

이것을 선택하면 배치할 코드 형식을 요구받을 것입니다. 저는 Blazor 웹 Assembly이지만, Angular,React,Vue를 사용할 수 있습니다.

현재 사이트 코드의 위치,Azure 함수의 위치, 출력 위치를 채우는 세 가지 변수가 있습니다. (보통 wwroot입니다.)이 세 가지 옵션을 설정하면 작성되어 저장소에 추가될 GitHub 작업 파일을 미리 볼 수 있습니다.
나는 이런 것을 얻었다

name: Azure Static Web Apps CI/CD

on:
  push:
    branches:
      - feature/tempbranch
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - feature/tempbranch

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_<GENERATED_HOSTNAME> }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          ###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
          # For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
          app_location: "Client" # App source code path
          api_location: "Api" # Api source code path - optional
          output_location: "wwwroot" # Built app content directory - optional
          ###### End of Repository/Build Configurations ######

  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_<GENERATED_HOSTNAME> }}
          action: "close"

파일에서 언급한 지점에 대한 Pull 요청을 만들 때, 코드를 지점으로 전송하면 이github 작업이 실행됩니다.이 코드가 에 추가되었습니다.github/workflows/folder, 모든github 작업 흐름이 있는 위치입니다.
github 작업에 대해서는 많이 하지 않지만 Azure DevOps를 많이 사용했습니다.Azure DevOps에서 저는 개발 환경에 배치할 수 있는 파이프라인을 만들었습니다. 그 다음은 테스트 환경이고 마지막은 생산 환경입니다.
내가 마지막으로 사용한 작업 흐름을 살펴보자. 모든 작업 방식을 분해할 수 있다.Github actions에 대해 아직 익숙하지 않으므로 더 좋은 방법이 있으면 꼭 알려주세요.

name: Azure Static Web Apps

on:
  push:
    branches:
      - main
      - develop
      - feature/*

jobs:
  dev:
    runs-on: ubuntu-latest
    environment: 
      name: Dev
    name: Dev
    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_ORANGE_POND_09B18B903  }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          ###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
          # For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
          app_location: "Blog" # App source code path
          api_location: "Blog.Func" # Api source code path - optional
          output_location: "wwwroot" # Built app content directory - optional
          ###### End of Repository/Build Configurations ######
  test:
    if: github.ref == 'refs/heads/develop'
    runs-on: ubuntu-latest
    environment: 
      name: Test
    name: Test
    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_WITTY_DUNE_0A1A77903  }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          ###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
          # For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
          app_location: "Blog" # App source code path
          api_location: "Blog.Func" # Api source code path - optional
          output_location: "wwwroot" # Built app content directory - optional
          ###### End of Repository/Build Configurations ######
  prod:
    if: github.ref == 'refs/heads/main'
    runs-on: ubuntu-latest
    environment: 
      name: Prod
    name: Prod
    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_BRAVE_ROCK_0AAC63D03 }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          ###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
          # For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
          app_location: "Blog" # App source code path
          api_location: "Blog.Func" # Api source code path - optional
          output_location: "wwwroot" # Built app content directory - optional
          ###### End of Repository/Build Configurations ######     

내가 하는 첫 번째 일은 세 개의Azure 정적 웹 응용 프로그램을 만드는 것이다. 나는 무료 층을 사용하기 때문에 이것은 나의 비용을 증가시킬 수 있지만 여전히 무료이다!이렇게 해서 세 개의github 작업 흐름 파일을 만들었습니다. 두 개를 삭제하고 세 번째 파일을 편집했지만 삭제하기 전에 AZURE STATIC WEB APPS API 영패를 적어 두었습니다.설정 -> 리콜의 비밀을 보면 비밀이 만들어진 것을 볼 수 있습니다. 이것은 정적 웹 애플리케이션을 업데이트하는 데 사용되는 github의 보안 카드입니다.
우리가 환경에 처했을 때, 우리는 환경을 보아도 무방하다.Prod, Test, Dev 환경을 만들었습니다. github 작업에서 사용할 것입니다.
환경은 그 위에 각종 규칙을 설정할 수 있다.

필수 검토자 - 승인자와 유사하며, 여기에 지정된 사용자는 워크플로우를 배포하려면 승인을 받아야 합니다

.

대기 시간 - 이걸 사용하지 않았지만 배치를 중단할 수 있는 시간을 설정할 수 있을 것 같습니다.(수동 검사를 좀 하고 싶습니다.)

배포 브랜치 - 어떤 브랜치를 어떤 환경에 배포할 수 있는지 지정합니다.개발자,main,feature 지점을 Dev 환경에 배치할 수 있도록 지정했습니다. 개발자와main은 테스트를 할 수 있고main은Prod

를 할 수 있습니다.

환경비밀 - 나는 이걸 사용하지 않았다. 내 비밀이 만들어졌기 때문이다. 하지만 너의 비밀은 특정한 환경과 관련이 있을 것 같다

현재 우리는 정적 웹 응용 프로그램 설정과 환경이 생겨서github 조작 파일을 보여 줍니다.
우선, 나는 공적인 것을 없애고 추진에만 전념했다.내 업무 절차가

기능 브랜치로 푸시

개발 환경에 배포

개발될 홍보 전문 지점

합병된 코드가 개발에 밀어넣기

테스트 환경에 배포

공공관계가main

으로 발전

합병된 코드가main

으로 전송됨

Prod env에 배포(승인 후)

나는 그것을 생산 환경에 배치하는 것을 비준하는 것은 좀 지나칠 수 있다고 생각하지만, 나는 현재 여전히 이런 설정을 가지고 있다.
dev:test:prod:로 정의된 세 가지 작업은 모두 동일하지만 azure static web apps appi 영패가 있습니다. 이 영패는 환경에 적합합니다.
그것들은 또한 각각 하나의 환경을 사용자 정의했다. 예를 들어

environment:
  name: Prod

마지막으로 Test와 Prod에는if 테스트 설정이 있습니다.false로 테스트되면 작업이 실행되지 않습니다.중요한 것은 그것은 실패하지 않고, 단지 운행하지 않을 뿐이다.
Prod의 경우, 이것은 주 지점에서만 실행할 수 있기 때문에, 우리는
만약:github.ref==“refs/heads/main”
테스트에 대해 개발자 so에서 실행하기만 하면 됩니다
만약:github.ref==“refs/heads/developer”
개발자에 대한 테스트를 할 수 있습니다.feature/*에서만 실행할 수 있지만, 매번 실행할 수 있습니다.
github 조작을 통해 당신은 더 많은 일을 할 수 있지만, 이것은 당신이 할 수 있는 일을 체험할 수 있기를 바랍니다.저는 현재Azure DevOps와github 조작을 혼합하고 있기 때문에github 조작으로 하여금 더 많은 일을 하도록 노력할 것입니다.