start Starter Micro Frontend Turborepo: یک رویکرد مقیاس پذیر برای توسعه Frontend

🌍 مقدمه

Micro Frontends به عنوان یک تغییر دهنده بازی در معماری Frontend ظاهر شده است و به تیم ها امکان می دهد برنامه های ماژولار ، مقیاس پذیر و قابل نگهداری را بسازند. Micro Frontend Turborepo Starter یک تنظیم Monorepo است که برای ساده سازی توسعه و مدیریت چندین جبهه میکرو با استفاده از TurborePo طراحی شده است. 🏗

این راهنما به بررسی چگونگی استفاده از این پروژه از ابزار مدرن برای بهینه سازی توسعه میکرو جبهه ، اطمینان از کارآیی ، قابلیت استفاده مجدد و عملکرد بالا می پردازد. 🚀

project بررسی اجمالی پروژه

این مخزن از یک معماری Monorepo برای مدیریت چندین جبهه میکرو به طور کارآمد پیروی می کند. شامل:

📦 برنامه ها (برنامه ها/)

برنامه های مستقل جبهه که می توانند به طور جداگانه توسعه و مستقر شوند.

🏗 بسته های مشترک (بسته ها/)

برای اطمینان از قوام در جبهه های میکرو ، مخزن شامل بسته های قابل استفاده مجدد زیر است:

ESLINT-CONFIG 🧹-قوانین استاندارد ESLINT برای سبک کد سازگار.

Tailwind-Config 🎨-تنظیم CSS Tailwind مشترک برای یک سیستم طراحی یکپارچه.

Typescript-Config 📜-تنظیمات متداول Typescript برای حفظ بهتر.

ui 🏗 – یک کتابخانه مؤلفه با عناصر UI قابل استفاده مجدد.

با استفاده از یک ساختار بسته بندی مشترک ، تیم ها می توانند تنظیمات یکنواخت را حفظ کرده و از تکثیر غیر ضروری در جبهه های میکرو جلوگیری کنند. 🔄

🌍 استقرار

استارت میکرو Frontend Turborepo در Vercel با استقرار خودکار برای CI/CD بدون درز میزبان است:

برنامه میزبان: microfrontendends-monorepo.vercel.app

برنامه از راه دور: microfrontends-monorepo-journeya.vercel.app

با استقرار اتوماتیک Vercel ، هر به روزرسانی به سرعت در تولید با حداقل تلاش منعکس می شود. 🚀

stack پشته فنی

این پروژه از پشته ای قوی از فن آوری های وب مدرن استفاده می کند:

structure ساختار monorepo – به طور مؤثر مدیریت چندین جبهه میکرو.

strchitecture معماری Micro Frontend – توسعه مستقل و استقرار ماژول های Frontend.

integration یکپارچه سازی Turborepo – سرعت را ایجاد می کند و عملکرد را بهبود می بخشد.

🚀 میزبان Vercel – استقرار اتوماتیک و مقیاس پذیر.

تنظیمات مشترک – تنظیمات استاندارد ESLINT ، Tailwind و TypeScript.

🖥 کتابخانه UI قابل استفاده مجدد – اجزای از پیش ساخته برای یک UI سازگار.

🚀 TypeScript – JavaScript به شدت تایپ شده.

🌍 React – کتابخانه UI برای ساخت جبهه های مدولار.

📦 Tailwind CSS-چارچوب یک ظاهر طراحی شده برای اولین بار.

این پشته عملکرد بالا ، قابلیت حفظ و تجربه توسعه دهنده صاف را تضمین می کند. ✨

🚀 شروع کار

برای تنظیم و اجرای پروژه به صورت محلی این مراحل را دنبال کنید:

1⃣ کلون مخزن:

git clone https://github.com/imevanc/microfrontends-monorepo.git

2⃣ حرکت به فهرست پروژه:

cd microfrontends-monorepo

3⃣ نصب وابستگی ها:

pnpm install

4⃣ سرور توسعه را شروع کنید:

pnpm run dev

برنامه میزبان در http: // localhost: 3000 و برنامه از راه دور در http: // localhost: 3001 در دسترس خواهد بود. 🖥

🎯 نتیجه گیری

استارت میکرو Frontend Turborepo یک رویکرد خوب ساختار یافته برای مدیریت جبهه های میکرو در یک Monorepo ارائه می دهد. این پروژه با استفاده از Turborepo ، Vercel و یک ساختار بسته بندی مشترک ، توسعه ، استقرار و همکاری در بین تیم ها را ساده تر می کند. این که آیا شما در جبهه های میکرو تازه وارد هستید یا به دنبال بهینه سازی گردش کار خود هستید ، این کیت استارت یک پایه محکم برای توسعه جلوی مقیاس پذیر ارائه می دهد. 🚀💡

از ساخت با استارت Micro Frontend Turborepo لذت ببرید! 🎉

github: imevanc
Bluesky: imevanc