> 웹 프론트엔드 > JS 튜토리얼 > GitHub Actions를 통해 일정에 따라 웹사이트 콘텐츠 업데이트

GitHub Actions를 통해 일정에 따라 웹사이트 콘텐츠 업데이트

PHPz
풀어 주다: 2024-08-17 15:20:01
원래의
698명이 탐색했습니다.

전통적인 의미에서 콘텐츠 데이터베이스가 필요하지 않은 자립형 콘텐츠 관리 시스템을 구축하기 위한 여정을 공유하고 싶습니다.

문제

이 웹사이트의 콘텐츠(블로그 게시물 및 북마크)는 Notion 데이터베이스에 저장됩니다.

Updating website content on schedule via GitHub Actions

북마크가 포함된 데이터베이스 –  Notion UI

제가 해결하려고 했던 문제는 북마크를 추가할 때마다 웹사이트를 수동으로 배포할 필요가 없다는 것이었습니다. 그리고 무엇보다도 호스팅을 가능한 한 저렴하게 유지하십시오. 왜냐하면 Notion 데이터베이스에 추가한 북마크가 얼마나 빨리 온라인에 도달하는지가 중요하지 않기 때문입니다.

그래서 몇 가지 조사 끝에 다음 설정을 생각해 냈습니다.

Updating website content on schedule via GitHub Actions

콘텐츠 전달 메커니즘에 대한 높은 수준의 개요

시스템은 여러 구성 요소로 구성됩니다.

  • 변경 사항을 배포하는 "Push to Main" 작업
  • Notion API에서 콘텐츠를 다운로드하고 변경 사항을 커밋하는 "콘텐츠 업데이트" 작업
  • "일정에 따라 콘텐츠 업데이트" 작업이 가끔씩 실행되어 "콘텐츠 업데이트" 작업을 트리거합니다

각각의 속내를 자세히 살펴보겠습니다.

"메인으로 푸시" 워크플로

여기서 말할 내용은 많지 않습니다. 꽤 표준적인 설정입니다. 기본 분기로 푸시되면 이 워크플로는 앱을 빌드하고 Wrangler CLI를 사용하여 Cloudflare Pages에 배포합니다.

name: Push to Main
on:
  push:
    branches: [main]
  workflow_dispatch: {}
jobs:
  deploy-cloudflare-pages:
    runs-on: ubuntu-latest
    timeout-minutes: 5
    steps:
      - name: Checkout
        uses: actions/checkout@v4
      - name: Setup pnpm
        uses: pnpm/action-setup@v4
      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version-file: .node-version
          cache: pnpm
      - name: Install node modules
        run: |
          pnpm --version
          pnpm install --frozen-lockfile
      - name: Build the App
        run: |
          pnpm build
      - name: Publish Cloudflare Pages
        env:
          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
        run: |
          pnpm wrangler pages deploy ./out --project-name ${{ secrets.CLOUDFLARE_PROJECT_NAME }}
로그인 후 복사

"콘텐츠 업데이트" 작업 흐름

이 워크플로는 "수동"으로만 트리거될 수 있습니다. PAT라고도 불리는 GitHub 개인 액세스 토큰을 사용하여 트리거할 수 있기 때문에 자동으로도 트리거할 수 있습니다. 처음에는 휴대폰에서 변경 사항을 배포하고 싶었기 때문에 이 글을 썼습니다. Notion API를 사용하여 게시물과 북마크를 다운로드한 다음 코드베이스에 변경 사항이 있는 경우 커밋을 생성하고 푸시합니다. 제대로 작동하려면 이 워크플로우에 저장소의 "코드 읽기 및 쓰기 액세스"가 있는 PAT가 제공되어야 합니다.

name: Update Content
on:
  workflow_dispatch: {}
jobs:
  download-content:
    runs-on: ubuntu-latest
    timeout-minutes: 5
    steps:
      - name: Checkout
        uses: actions/checkout@v4
        with:
          # A Github Personal Access Token with access to the repository 
          # that has the follwing permissions:
          # ✅ Read and Write access to code
          token: ${{ secrets.GITHUB_PAT_CONTENT }}
      - name: Setup pnpm
        uses: pnpm/action-setup@v4
      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version-file: .node-version
          cache: pnpm
      - name: Install node modules
        run: |
          pnpm --version
          pnpm install --frozen-lockfile
      - name: Download articles content from Notion
        env:
          NOTION_KEY: "${{ secrets.NOTION_KEY }}"
          NOTION_ARTICLES_DATABASE_ID: "${{ secrets.NOTION_ARTICLES_DATABASE_ID }}"
        run: |
          pnpm download-articles
      - name: Download bookmarks content from Notion
        env:
          NOTION_KEY: ${{ secrets.NOTION_KEY }}
          NOTION_BOOKMARKS_DATABASE_ID: ${{ secrets.NOTION_BOOKMARKS_DATABASE_ID }}
        run: |
          pnpm download-bookmarks
      - name: Configure Git
        run: |
          git config --global user.email "${{ secrets.GIT_USER_EMAIL }}"
          git config --global user.name "${{ secrets.GIT_USER_NAME }}"
      - name: Check if anything changed
        id: check-changes
        run: |
          if [ -n "$(git status --porcelain)" ]; then
            echo "There are changes"
            echo "HAS_CHANGED=true" >> $GITHUB_OUTPUT
          else
            echo "There are no changes"
            echo "HAS_CHANGED=false" >> $GITHUB_OUTPUT
          fi
      - name: Commit changes
        if: steps.check-changes.outputs.HAS_CHANGED == 'true'
        run: |
          git add ./src/content
          git add ./public
          git commit -m "Automatic content update commit"
          git push
로그인 후 복사

"일정에 따라 콘텐츠 업데이트" 워크플로

이것은 매우 간단합니다. 가끔씩 실행되어 위의 워크플로를 트리거합니다. 제대로 작동하려면 이 워크플로에 저장소의 "액션에 대한 읽기 및 쓰기 액세스 권한"이 있는 GitHub PAT가 제공되어야 합니다. 내 경우에는 다른 PAT입니다.

name: Update Content on Schedule
on:
  schedule:
    - cron: "13 0,12 * * *"
  workflow_dispatch: {}
jobs:
  trigger-update-content:
    runs-on: ubuntu-latest
    timeout-minutes: 5
    steps:
      - name: Checkout
        uses: actions/checkout@v4
      - name: Dispatch the Update Content workflow
        env:
          # A Github Personal Access Token with access to the repository 
          # that has the follwing permissions:
          # ✅ Read and Write access to actions
          GH_TOKEN: ${{ secrets.GITHUB_PAT_ACTIONS }}
        run: |
          gh workflow run "Update Content" --ref main
로그인 후 복사

결론

저에게 있어 이 설정은 정말 훌륭하고 유연하다는 것이 입증되었습니다. 모듈식 구조로 인해 "콘텐츠 업데이트" 작업을 수동으로 실행할 수 있습니다. 여행하는 동안 휴대폰에서. 나에게 이것은 워크플로우의 점진적인 향상에 대한 또 다른 귀중한 경험이었습니다.

이 정보가 도움이 되었기를 바랍니다.

위 내용은 GitHub Actions를 통해 일정에 따라 웹사이트 콘텐츠 업데이트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿