क्लाउडफ्लेयर वर्कर्स साइट्स पर एक स्थिर साइट कैसे बनाएं

नमस्ते! मेरा नाम दीमा है, मैं व्रीके में SysOps टीम की तकनीकी प्रमुख हूं। इस लेख में मैं आपको बताऊंगा कि किसी वेबसाइट को 10 मिनट और 5 डॉलर प्रति माह में यथासंभव उपयोगकर्ता के करीब कैसे बनाया जाए और उसकी तैनाती को स्वचालित कैसे किया जाए। लेख का उन समस्याओं से लगभग कोई लेना-देना नहीं है जिन्हें हम अपनी टीम के भीतर हल करते हैं। यह बल्कि मेरा व्यक्तिगत अनुभव और एक ऐसी तकनीक को जानने का प्रभाव है जो मेरे लिए नई है। मैंने चरणों का यथासंभव विस्तार से वर्णन करने का प्रयास किया ताकि निर्देश विभिन्न अनुभव वाले लोगों के लिए उपयोगी हों। उम्मीद है आपको मज़ा आएगा। जाना!

तो, शायद आपको पहले से ही किसी वेबसाइट को होस्ट करने का एक सरल और सस्ता तरीका मिल गया है। शायद मुफ़्त भी, जैसा कि इसमें बताया गया है बढ़िया लेख.

लेकिन अचानक आप अभी भी ऊब गए हैं और प्रौद्योगिकी की बहादुर नई दुनिया को छूना चाहते हैं? मान लीजिए कि आप तैनाती को स्वचालित करने के बारे में सोच रहे हैं और अपनी साइट को यथासंभव तेज़ करना चाहेंगे? इस लेख में हम प्रयोग करेंगे ह्यूगो, लेकिन यह वैकल्पिक है.

हम स्वचालन के लिए Gitlab CI/CD का उपयोग करते हैं, लेकिन त्वरण के बारे में क्या? आइए साइट को सीधे Cloudflare का उपयोग करके तैनात करें कार्यकर्ता साइटें.

शुरू करने के लिए क्या आवश्यक है:

• गिटलैब (आपका अपना या बादल)

• खाता क्लाउडफ्लेयर पर

• स्थापित नोडजेएस/एनपीएम

भाग 1: ह्यूगो को स्थापित करना

यदि आपके पास पहले से ही ह्यूगो स्थापित है, या यदि आप एक अलग स्थिर साइट जनरेटर पसंद करते हैं (या बिल्कुल भी उपयोग नहीं करते हैं), तो आप इस भाग को छोड़ सकते हैं।

1. ह्यूगो को यहां से डाउनलोड करें https://github.com/gohugoio/hugo/releases

2. हम ह्यूगो निष्पादन योग्य फ़ाइल को परिभाषित में से एक के अनुसार रखते हैं पथ तरीके

3. एक नई साइट बनाना: hugo new site blog.example.com

4. वर्तमान निर्देशिका को नव निर्मित निर्देशिका में बदलें: cd blog.example.com

5. एक डिज़ाइन थीम चुनें (https://github.com/budparr/gohugo-theme-ananke/releases या जो कुछ भी)

6. आइए पहली पोस्ट बनाएं: hugo new posts/my-amazing-post.md

7. बनाई गई फ़ाइल में सामग्री जोड़ें: content/posts/my-amazing-post.md.
   जब सब कुछ हो जाए, तो ड्राफ्ट वैल्यू को बदल दें असत्य

8. स्थिर फ़ाइलें उत्पन्न करना: hugo -D

अब हमारी स्थिर साइट एक निर्देशिका के अंदर स्थित है ।/जनता और आपकी पहली मैन्युअल तैनाती के लिए तैयार है।

भाग 2: क्लाउडफ्लेयर की स्थापना

अब आइये Cloudflare के प्रारंभिक सेटअप पर नजर डालते हैं। आइए मान लें कि हमारे पास साइट के लिए पहले से ही एक डोमेन है। चलिए एक उदाहरण के तौर पर लेते हैं blog.example.com.

चरण 1: एक DNS प्रविष्टि बनाएँ

सबसे पहले, हमारा डोमेन चुनें, और फिर मेनू आइटम चुनें डीएनएस. हम एक ब्लॉग ए-रिकॉर्ड बनाते हैं और इसके लिए कुछ काल्पनिक आईपी इंगित करते हैं (यह आधिकारिक है सिफ़ारिश करना, लेकिन वे इसे थोड़ा और सुंदर बना सकते थे)।

चरण 2: क्लाउडफ्लेयर टोकन

1. मेरी प्रोफाइल -> एपीआई टोकन टैब-> टोकन बनाएँ -> कस्टम टोकन बनाएं

यहां आपको टोकन को खातों और क्षेत्रों तक सीमित करने की आवश्यकता होगी, लेकिन चित्र में सूचीबद्ध अनुमतियों के लिए संपादन विकल्प छोड़ दें।

भविष्य के लिए टोकन सहेजें, हमें तीसरे भाग में इसकी आवश्यकता होगी।

चरण 3: अकाउंटआईडी और ज़ोनआईडी प्राप्त करें

डोमेन → अवलोकन → [दायां साइडबार]

ये मेरे हैं, कृपया इनका उपयोग न करें :)

उन्हें टोकन के बगल में सहेजें, हमें तीसरे भाग में भी उनकी आवश्यकता होगी।

चरण 4: कार्यकर्ताओं को सक्रिय करें

डोमेन → कर्मी → श्रमिकों का प्रबंधन करें

हम एक अद्वितीय नाम और टैरिफ वर्कर्स → अनलिमिटेड ($5 प्रति माह आज) चुनते हैं। आप चाहें तो बाद में फ्री वर्जन में अपग्रेड कर सकते हैं।

भाग 3: प्रथम परिनियोजन (मैन्युअल परिनियोजन)

मैंने यह पता लगाने के लिए पहली मैन्युअल तैनाती की कि वहां वास्तव में क्या चल रहा था। हालाँकि यह सब सरलता से किया जा सकता है:

1. रैंगलर स्थापित करें: npm i @cloudflare/wrangler -g

2. आइए हमारे ब्लॉग की निर्देशिका पर जाएँ: cd blog.example.com

3. रैंगलर लॉन्च करें: wrangler init — site hugo-worker

4. रैंगलर के लिए एक कॉन्फ़िगरेशन बनाएं (पूछे जाने पर टोकन दर्ज करें): wrangler config

आइए अब नव निर्मित फ़ाइल में परिवर्तन करने का प्रयास करें रैंगलर.टीओएमएल (यहां संभावित सेटिंग्स की पूरी सूची):

1. उल्लिखित करना एकाउंटिड और ज़ोनिड

2. हम बदलते हैं मार्ग कुछ इस तरह *blog.example.com/*

3. उल्लिखित करना असत्य के लिए वर्कर्सदेव

4. बकेट को ./पब्लिक में बदलें (या जहां आपकी स्थिर साइट स्थित है)

5. यदि आपके पथ में एक से अधिक डोमेन हैं, तो आपको कार्यशील स्क्रिप्ट में पथ को सही करना चाहिए: वर्कर्स-साइट/index.js (फ़ंक्शन देखें हैंडलइवेंट)

बढ़िया, अब टीम का उपयोग करके साइट को तैनात करने का समय आ गया है wrangler publish.

भाग 4: परिनियोजन स्वचालन

यह मार्गदर्शिका Gitlab के लिए लिखी गई है, लेकिन यह सामान्य रूप से स्वचालित परिनियोजन के सार और आसानी को दर्शाती है।

चरण 1: हमारा प्रोजेक्ट बनाएं और कॉन्फ़िगर करें

1. एक नया GitLab प्रोजेक्ट बनाएं और साइट: निर्देशिका अपलोड करें blog.example.com सभी सामग्री प्रोजेक्ट रूट निर्देशिका में स्थित होनी चाहिए

2. हमलोग तैयार हैं चर सीएफएपीटोकन यहाँ: सेटिंग → सीआई / सीडी → चर

चरण 2: एक .gitlab-ci.yml फ़ाइल बनाएं और पहली तैनाती चलाएँ

एक फ़ाइल बनाएँ .gitlab-ci.yml निम्नलिखित सामग्री के साथ मूल में:

stages:
  - build
  - deploy

build:
  image: monachus/hugo
  stage: build
  variables:
    GIT_SUBMODULE_STRATEGY: recursive
  script:
    - cd blog.example.com/
    - hugo
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #


deploy:
  image: timbru31/ruby-node:2.3
  stage: deploy
  script:
    - wget https://github.com/cloudflare/wrangler/releases/download/v1.8.4/wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - tar xvzf wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - cd blog.example.com/
    - ../dist/wrangler publish
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #

हम पहली तैनाती मैन्युअल रूप से लॉन्च करते हैं (सीआई/सीडी → पाइप लाइनें → पाइपलाइन चलाएँ) या मास्टर शाखा के प्रति वचनबद्ध होकर। वोइला!

निष्कर्ष

ख़ैर, हो सकता है कि मैंने इसे थोड़ा कम करके आंका हो, और पूरी प्रक्रिया में केवल दस मिनट से अधिक का समय लगा। लेकिन अब आपके पास स्वचालित परिनियोजन के साथ एक तेज़ साइट है और कुछ नए विचार हैं कि आप वर्कर्स के साथ और क्या कर सकते हैं।

 क्लाउडफ्लेयर वर्कर्स    ह्यूगो    गिटलैब सीआई

स्रोत: www.habr.com