چگونه می توان سایت Jamstack خود را در صفحات Cloudflare مستقر کرد

این مقاله نحوه استقرار سایت Jamstack خود را در Cloudflare Pages توصیف می کند – یک سرویس جدید با یک برنامه میزبانی رایگان ساده برای استفاده و سخاوتمندانه.

دنیای وب ممکن است باشد با استفاده از وردپرس، اما توسعه دهندگان در حال حرکت به سمت هستند فن آوری های Jamstack (همچنین به عنوان سایت های ایستا) نام Jamstack (زمانی به عنوان JAMStack نوشته شد) مخفف JavaScript، APIs، and Markup است و توسط Netlify. دامنه اصطلاحات مانند Ajax گسترده شده است ، اما یک سایت Jamstack معمولاً از محتوای استاتیک پیش ساخته ارائه شده با منطق سمت مشتری که به مجموعه ای از API های کم پشت به هم پیوسته متصل است استفاده می کند. مزایای آن جذاب است:

• کارایی: در صورت امکان ، سایتهای Jamstack یک بار در طی فرایند ساخت صفحات را به جای مشاهده مشاهده می کنند. آنها سریع هستند و اغلب در شبکه های تحویل محتوا (CDN) که از نظر جسمی نزدیک به کاربر هستند ، مستقر می شوند.

• مقیاس پذیری: سایت های Jamstack مجموعه ای از پرونده های تولید شده هستند که نیازی به پردازش سمت سرور یا اتصال پایگاه داده ندارند. صفحات به طور موثر از قبل ذخیره شده و در سطح جهانی مستقر می شوند.

• قابل حمل بودن: پس از تولید ، میزبانی یک سایت Jamstack در هر مکان امکان پذیر است. هیچ قفل فروشنده ای وجود ندارد.

• توسعه: توسعه دهندگان می توانند استفاده کنند هر ابزاری را که ترجیح می دهند برای ایجاد سایت. در صورت لزوم ، ویراستاران مقاله می توانند از WordPress یا هر CMS دیگری برای نوشتن محتوا استفاده کنند.

• گسترش: سایت های Jamstack را می توان به طور خودکار با انجام شعبه های Git در سایت های آزمایش و تولید مستقر کرد. نیازی به یکپارچه سازی پیوسته و فرآیندهای استقرار مداوم نیست.

آموزش های زیر نحوه ایجاد سایت Jamstack را از ابتدا توضیح می دهند:

خدمات میزبانی Jamstack

شما می توانید سایتی را در هر مکانی از جمله میزبانی کنید صفحات GitHub و آمازون S3، ولی Netlify و Vercel بر فضای Jamstack تسلط پیدا کنند. آنها برنامه های سخاوتمندانه و استقرارهای ساده مبتنی بر Git را ارائه می دهند.

آخرین ورودی به بازار است ابر شکن – شرکتی که به دلیل خدمات جهانی CDN ، امنیت لبه و ذخیره سازی بیشتر شناخته شده است. جدید صفحات Cloudflare سرویس خدمات جامستاک را در زیرساخت های عظیم جهانی خود ارائه می دهد. طرح رایگان اکنون در دسترس همه است و شامل موارد زیر است:

• سایت ها ، درخواست ها و پهنای باند نامحدود
• SSL و امنیت
• انبار محتوا و انقضا قوی
• تجزیه و تحلیل وب
• استقرار تولید و آزمایش از شعب GitHub
• هر بار یک ساخت با حداکثر 500 ساخت در ماه ، و
• مستندات کامل با شروع آموزشها، نمونه های استقرار راهنماهای مهاجرت

پلت فرم ساخت از زبانهایی از جمله Node.js ، Python ، PHP ، Ruby ، ​​Go ، Java ، Elixir و Erlang پشتیبانی می کند. بیشتر نرم افزارهای سازنده سایت باید کار کنند ، اما ابزارهای زیر سازگاری را تأیید کرده اند:

• Angular (زاویه ای CLI)
• صبحانه
• Docusaurus
• یازده
• Ember.js
• گتسبی
• GitBook
• گریدزوم
• هوگو
• جکیل
• Mkdocs
• Next.js (صادرات HTML ثابت)
• Nuxt.js
• پلیکان
• عکس العمل (create-react-app)
• واکنش استاتیک
• سنگ لوح
• صاف
• اومی
• چشم انداز
• VuePress

اولین استقرار صفحات Cloudflare

می توانید هر سایت Jamstack را با فرض اینکه:

1. در مخزن Github موجود است ، و
2. از یک دستور ساخت واحد برای ایجاد تمام فایلهای ثابت HTML ، CSS ، JavaScript و رسانه در یک فهرست خاص استفاده می کند.

در پروژه های Node.js ، معمولاً یک دستور build وجود دارد npm run build، که مرتبط را اجرا می کند npm اسکریپت در package.json. شما می توانید به عنوان مثال پروژه یازده که از دستور build استفاده می کند npm run production برای خروج از پرونده ها به a build فهرست راهنما.

به روزرسانی های اختیاری زیر ممکن است عملی باشند:

• اگر سایت شما به جای یک برنامه تک صفحه ای (SPA) مجموعه ای از صفحات است ، باید اطمینان حاصل کنید که یک صفحه “یافت نشد” به یک فایل ریشه به نام 404.html.

• می توانید رندر کنید _redirects پرونده حاوی یک یا چند خط تغییر مسیر در قالب:

  <old-URL> <new-URL> <301|302 HTTP status code>

  مثلا، /blog /tutorials 301.

  به زودی پشتیبانی از گزینه های پیشرفته تر مانند wildcards ارائه می شود.

• مورد نیاز نسخه زبان. به عنوان مثال ، اگر به Node.js نسخه 14.8 یا بالاتر نیاز دارید ، a ایجاد کنید .nvmrc پرونده در ریشه پروژه خود حاوی v14.8. (همچنین می توانید آن را بصورت a مشخص کنید) NODE_VERSION متغیر محیط در پیکربندی ساخت Cloudflare.)

برای شروع پیکربندی ، باز کنید pages.cloudflare.com و با استفاده از شناسه و رمز عبور Cloudflare خود ثبت نام کرده یا وارد شوید. سپس کلیک کنید یک پروژه ایجاد کنید.

برای راه اندازی اولین سایت خود باید به یک حساب GitHub متصل شوید و می توانید همه یا مجموعه خاصی از مخازن را به اشتراک بگذارید. روی پروژه Jamstack خود کلیک کنید و سپس دنبال کنید شروع به راه اندازی کنید برای رفتن به صفحه پیکربندی.

اطلاعات زیر را وارد کنید:

1. نام پروژه. این به یک زیر دامنه از تبدیل خواهد شد pages.dev بنابراین حروف کوچک و نویسه های عددی را مجاز می داند. نام مخزن پیش فرض است.

2. شعبه تولید. این به طور معمول است main یا master.

3. دستور ساختن. با انتخاب پیش فرض فریم ورک از پیش فرض شناخته شده استفاده می شود ، اما شما وارد می شوید npm run production برای مثال پروژه یازده.

4. فهرست خروجی. انتخاب پیش فرض چارچوب از پیش فرض شناخته شده استفاده می کند ، اما شما وارد می شوید build برای مثال پروژه یازده.

5. مسیر. اینجاست که دستور build اجرا می شود (اگر از ریشه پروژه نباشد).

6. متغیرهای محیطی. هر مورد لازم برای ساخت را وارد کنید.

اصابت ذخیره و استقرار. صفحه ساخت وضعیت فعلی را نشان می دهد:

نصب پروژه های وابسته ، اجرای مراحل ساخت و استقرار سایت در CDN Cloudflare برای پروژه های کوچکتر حدود دو دقیقه به طول خواهد انجامید. پس از پایان کار ، کلیک کنید ادامه پروژه برای مشاهده صفحه خلاصه Cloudflare Pages.

سایت شما اکنون در دامنه در دسترس خواهد بود <project-name>.pages.dev و همچنین یک زیر دامنه سفارشی برای شعبه – مانند 1234567.<project-name>.pages.dev. کلیک از سایت دیدن کنید تا آن را در یک برگه جدید باز کنید.

برای پیکربندی دامنه سفارشی ، روی کلیک کنید دامنه های سفارشی تب به دنبال آن یک دامنه سفارشی تنظیم کنید.

سپس نام دامنه ای را که می خواهید استفاده کنید وارد کنید.

اگر دامنه از سرورهای نام Cloudflare استفاده می کند ، صفحه از شما می خواهد تغییرات پیکربندی DNS را تأیید کنید. برای ثبت نام کنندگان دیگر ، دستورالعمل هایی نشان داده می شود که تغییرات DNS شما باید ایجاد کنید. در بیشتر موارد ، شما باید یک مورد جدید اضافه کنید CNAME ضبط و احتمالاً حذف یک قدیمی A رکورد.

سپس سایت شما در دامنه سفارشی فعال خواهد شد. توجه داشته باشید که <project-name>.pages.dev هنوز در دسترس است ، بنابراین هنگام باز کردن و به اشتراک گذاری URL ها مراقب باشید.

استقرار خودکار

Cloudflare Pages به طور خودکار سایت جدیدی را برای هر تعهدی در مخزن GitHub شما ایجاد و مستقر می کند.

• تعهدات شعب در یک زیر دامنه خاص ، از جمله در دسترس هستند abcdef0.<project-name>.pages.dev، بنابراین دیگران می توانند به روزرسانی های احتمالی را ارزیابی کنند.

• متعهد می شود یا در شاخه تولید ادغام می شود (main یا master) همچنین یک زیر دامنه خاص ایجاد کنید که در <project-name>.pages.dev و دامنه سفارشی شما.

داشبورد پروژه شما همه استقرارها را با پیوند به سایت نشان می دهد ، ساختن ورود به سیستم ، و حذف گزینه.

تنظیمات بیشتر

تنظیمات برگه پروژه شما گزینه های دیگری را برای:

• پیکربندی را ویرایش کنید ، استقرارها را متوقف کنید یا پروژه را حذف کنید
• از همکاران دیگر دعوت کنید
• خط مشی دسترسی را تعریف کنید بنابراین پیش نمایش (شاخه) استقرارها را برای یک پین دسترسی بفرستید
• Cloudflare Web Analytics را فعال کنید

با فعال کردن تجزیه و تحلیل ، اسکریپت کوچکی را به انتهای صفحات خود اضافه می کنید. تجزیه و تحلیل وب سپس لینک فعال می شود.

این به اندازه Google Analytics جامع نیست ، اما داده ها در عرض یک ساعت در دسترس هستند و یک رابط سریع ارائه می دهند که مهمترین معیارها را نشان می دهد. بیشتر افراد استفاده از آن را بسیار راحت تر خواهند یافت.

Jamstack Joy

Cloudflare Pages جدید است و به روزرسانی های بیشتری در طول ماه های آینده انجام می شود:

• پشتیبانی از مخازن GitLab و Bitbucket
• به علاوه _redirects گزینه های ارسال URL
• قلاب های وب برای شروع به کار
• آزمایش A / B – به روزرسانی برای درصدی از ترافیک نشان داده می شود ، بنابراین می توانید قبل از انجام تغییر فعالیت واقعی کاربر را آزمایش کنید
• برنامه های پشته کامل با Cloudflare Workers و API های ذخیره سازی.

انتخاب های جذاب برای توسعه دهندگان Jamstack در حال افزایش است.