میکروفرانت اند و مونوریپو دو رویکرد متفاوت در معماری نرمافزار هستند که هر کدوم مزایا و معایبی دارند و با توجه به نوع پروژه و پیچیدگی و نوع نیازمون میتونیم ازشون استفاده کنیم
هر بخش از اپلیکیشن فرانت اند به صورت یک اپ مستقل ساخته میشه که میتونه با فریمورک یا فناوری مختلف توسعه داده بشه و این اپلیکیشنهای کوچک در یک صفحه واحد ترکیب میشن
فرض کن میخوایم یک فروشگاه اینترنتی بسازیم و هر بخش از فروشگاه میتونه یک میکروفرانت مجزا باشه(عکس بالا):
مثال کد (ساختار پایه):
HTML
<div id="header"></div> <div id="products"></div> <div id="cart"></div> <script src="header.js"> <script src="products.js"> <script src="cart.js">
هر فایل *.js
یک میکروفرانت اند مجزا را بارگذاری میکند. این میکروفرانت اندها میتونن به صورت مجزا توسعه داده شده و مستقر شوند.
فرض کنید یک شرکت نرم افزاری دارای یک وبسایت، یک اپلیکیشن موبایل،یک اپلیکیشن تجاری و کامپوننتهای UI مشترک است. در روش Monorepo، میخوایم یک کتابخانه UI بسازیم که بتونیم در هر پروژه استفاده کنیم و از تکرار کد جلوگیری کنیم. در این حالت، همه کامپوننتهای UI در یک مونوریپو قرار میگیرند.
my-ui-library/ ├── package.json ├── components/ │ ├── Button.js │ ├── Input.js │ └── ... ├── utils/ │ ├── formatDate.js │ └── ... └── ...
مثال کد (package.json):
JSON
{ "name": "my-ui-library", "version": "1.0.0", "private": true, "workspaces": [ "components/*", "utils/*" ] }
در این مثال، workspaces
به Yarn یا npm میگه که این پروژه چندتا پکیج داخلی داره که هرکدوم میتونه وابستگی خودش رو داشته باشه( هر workspace باید فایل package.json داشته باشه تا اطلاعات مربوط به پکیج را دارا باشه)
مزایا:
با وجود مونوریپو، تیمها میتونن کتابخانه ها و کدهای مشترک را به راحتی به اشتراک بذارند و از تکرار کد جلوگیری کنند. به زبان ساده تر میتونیم قسمت های مختلف UI رو بعنوان پکیج جدا پابلیش کنیم و در صورت نیاز کافیه پکیجی که شامل کامپوننت مورد نظر هست و حجمش هم خیلی کمتره رو نصب کنیم. همچنین مدیریت پروژه ها و سرعت توسعه بیشتر میشه
مورد بعدی این هست که ورژن دپندنسی همه پروژه ها یکسانه و از ناسازگاری جلوگیری میشه.
معایب:
اگر پروژه شما کوچک است و تیم توسعه شما کوچک است، مونوریپو میتواند گزینه مناسبی باشد. اما اگر پروژه شما بزرگ و پیچیده است و تیم شما بزرگ است و از تکنولوژی های مختلف استفاده میکنید و مقیاسپذیری بالا نیاز دارید میکروسرویسها میتوانند گزینه بهتری باشند.
در برخی موارد، ترکیبی از مونوریپو و میکروسرویسها میتواند بهترین راه حل باشد. برای مثال، میتوان یک مونوریپو برای کدهای مشترک و یک میکروسرویس برای هر ویژگی خاص ایجاد کرد.