如何將jamstack站點部署到Cloudflare頁面

CloudFlare頁面：輕鬆的Jamstack部署，寬敞的免費託管

鍵突出顯示：

CloudFlare頁面提供了一個用戶友好的免費託管計劃，用於部署高性能的jamstack網站。 由於其速度，可伸縮性，可移植性和直接部署，這越來越受歡迎。
• 支持眾多語言和網站建設者。 使用單個構建命令生成靜態文件（HTML，CSS，JS，媒體），託管在GitHub上的任何jamstack站點都是兼容的。
>自動部署是核心功能。每個GitHub提交都會觸發一個構建和部署，分支機構可通過子域訪問，以預覽更新，並且在您的自定義域中可用的生產分支部署。
• 提供全面的設置：配置編輯，協作邀請函，訪問控制和CloudFlare Web Analytics。未來的增強功能包括Gitlab/Bitbucket集成，高級URL轉發，Webhooks，A/B測試以及通過CloudFlare工人和存儲APIS的全堆棧應用程序支持。
• 本指南詳細介紹將您的jamstack站點部署到CloudFlare頁面，利用其簡單的界面和寬敞的免費層。
• >雖然WordPress仍然很普遍，但Jamstack（JavaScript，API，Markup）技術（通過Netlify在本質上創造）正在獲得開發人員的吸引力。 jamstack站點主要利用預渲染的靜態內容，通過客戶端邏輯和後端API動態增強。 優點很明顯：

>

績效：

>預渲染的頁面會導致加載時間更快，通常通過CDN部署更加接近用戶來增強。 >

• >可伸縮性：靜態文件部署消除了服務器端處理和數據庫的依賴，啟用了全局，預先接觸的內容交付。 可移植性：
供應商鎖定是避免使用的；託管在任何地方。
• > 開發靈活性：
開發人員可以利用其首選工具；內容編輯器可以繼續使用WordPress等熟悉的CMS平台。
• 簡化的部署：
自動部署通過git分支來測試和生產環境，簡化了CI/CD進程。
• >幾個教程指南Jamstack網站創建：
• 高度快速啟動（github存儲庫）> gatsby快速啟動：構建第一個靜態站點

>使用Gatsby和MDX

創建開發人員博客

• > jamstack託管選項：
• >諸如GitHub頁面和Amazon S3之類的平台是可行的，但Netlify和Vercel正在領導Jamstack託管提供商。 Cloudflare頁面建於Cloudflare的強大基礎架構上，是一個引人注目的新增加。 免費計劃包括：
• >無限網站，請求和帶寬
• > SSL和安全
• 內容緩存和有效期
>
• > Web Analytics
• GitHub分支的生產和測試部署
• >每月最多500個構建
• 綜合文檔

>支持的語言包括Node.js，Python，PHP，Ruby，Go，Java，Elixir和Erlang。 許多現場建設者都是兼容的，並獲得了驗證的支持：Angular，Fright，Docusaurus，Eperber.js，Ember.js，Gatsby，Gitbook，Gitbook，Gridsome，Gridsome，Hugo，Jekyll，Mkdocs，Next.js（ static Export）（靜態出口） ，反應靜態，板岩，苗條，Umi，Vue和Vuepress。

>

您的第一個CloudFlare頁面部署：> >先決條件：

> github存儲庫託管您的jamstack網站。

>一個單個構建命令將靜態文件生成特定目錄（例如，
1. ）。
>
2. 對於Node.js Projects，（或在npm run build>中定義的類似命令）是典型的。 考慮以下可選的改進：

對於多頁網站，包括npm run build> package.json。

>使用一個

文件進行重定向（例如，
• ）。計劃更高級的功能。 404.html
>使用
• >或_redirects>環境變量指定所需的node.js版本。 /blog /tutorials 301
• >部署步驟：.nvmrc NODE_VERSION
>訪問頁面.cloudflare.com，登錄/註冊。

>

單擊“創建一個項目”。

連接您的github帳戶，選擇存儲庫。
1. >
選擇您的項目，單擊“開始設置”。
2. configure：項目名稱（
>的子域），生產分支，構建命令，輸出目錄，路徑（如果不是root），環境變量。
單擊“保存和部署”。 監視構建過程。
完成後，單擊“繼續進行項目”。您的網站可在
5. >。 pages.dev上訪問
6. >自定義域配置：
7. <project-name>.pages.dev</project-name>>導航到“自定義域”選項卡。

>單擊“設置自定義域。”

輸入您的域名。 CloudFlare將指導您通過DNS配置更改。

2. 自動部署：
3. CloudFlare頁面自動部署每個GitHub commit。分支提交可在唯一子域（例如，
）上獲得，允許在合併到生產分支之前預覽更新（

和您的自定義域）。

高級設置：

“設置”選項卡允許進行配置調整，協作者管理，訪問策略定義（PIN保護預覽）和CloudFlare Web Analytics集成。 分析提供沒有客戶端跟踪的關鍵指標。 abcdef0.<project-name>.pages.dev</project-name> <project-name>.pages.dev</project-name>

未來增強：

• > gitlab/bitbucket支持
• 高級_redirects特徵
用於部署觸發器的
• webhooks
• a/b測試
• >全堆棧應用程序支持（Cloudflare工人，存儲API）>

CloudFlare頁面為Jamstack開發人員提供了令人信服的解決方案，並進行了持續的改進，從而增強了其功能。

常見問題（常見問題解答）：

> 提供的常見問題解答已經寫得很好，不需要進一步的修改。

以上是如何將jamstack站點部署到Cloudflare頁面的詳細內容。更多資訊請關注PHP中文網其他相關文章！