چرا توسعه دهندگان React عاشق Node هستند؟

گردآوری و تالیف : عرفان کاکایی
تاریخ انتشار : 16 آذر 1397
دسته بندی ها : react

برخی افراد به اشتباه تصور می‌کنند که Node در جهت استفاده از React ضروری است. اما نیست! شما نیازی به Node برای اجرای یک پروژه React ندارید. شما حتی به یک مرورگر هم نیاز ندارید.

React یک زبان به شما می‌دهد تا یک رابط کاربری را تعریف کنید. آن رابط می‌تواند کنترل‌های موجود در خودرو شما، یک صفحه یخچال مدرن، یا دکمه‌های مایکروویو شما باشد. اساسا، می‌تواند هر رابطی باشد که در آن یک کاربر نیاز دارد تا با یک دستگاه هوشمند در تعامل باشد.

React در ابتدا برای رابط‌های کاربری وب ساخته شده بود، و حال معروف‌ترین مورد در این زمینه است. به همین علت ما کتابخانه ReactDOM را داریم که با DOM یک مرورگر کار می‌کند. گرچه، امروزه React همچنین برای رابط‌های غیر وب مانند iOS، اندروید، واقعیت مجازی و حتی رابط‌های خط دستوری هم محبوب است.

چرا Node؟

Node معروف‌ترین پلتفرم برای ابزاری است که کار با React را آسان‌تر می‌کنند. Node همچنین یک پلتفرم معروف برای اجرای یک وب سرور است که می‌تواند برنامه‌های React را میزبانی کند. گرچه، حتی اگر برنامه‌های React خود را بر روی Node میزبانی نکنید، همچنان می‌توانید از Node برای ابزاری که فراهم می‌کند استفاده کنید. برای مثال، شما می‌توانید برنامه‌های React خود را بر روی Ruby یا Rails میزبانی کنید و از Node برای ساخت دارایی‌هایی برای Rails Assets Pipeline استفاده کنید.

پکیج Webpack Node، باندل کردن برنامه‌های React چند فایلی خود در یک فایل تکی برای تولید و کمپایل کردن (با استفاده از Babel)) در طی آن روند را بسیار آسان می‌کند. این مثالی از یک ابزار Node است که می‌توانید به تنهایی استفاده کنید. شما نیازی به یک وب سرور Node برای کار کردن با Webpack ندارید.

گرچه، چندین علت برای ترجیح دادن Node به گزینه‌های دیگر به عنوان وب سروری برای میزبانی برنامه‌های React خود وجود دارد. اجازه دهید که به برخی از مهم‌ترین موارد اشاره کنم:

  • اکثر مثال‌ها و پروژه‌های React که بر روی وب پیدا می‌کنید، بر پایه Node بنا شده‌اند. وقتی که پروژه‌تان از Node استفاده می‌کند، کمک گرفتن از دیگران ساده‌تر است.
  • Node در واقع JavaScript است، که از پیش در حال استفاده از آن (با React) هستید. نیازی نیست که در برنامه دیگری سرمایه‌گذاری کنید. استفاده از زبان مشابه، به اشتراک گذاری کد در میان کد سمت سرور و کد سمت کاربر را ممکن می‌کند. حتی در نهایت دیگر هیچ وقت نخواهید گفت «سمت سرور» و «سمت کاربر». تمام آن، یک کد JavaScript است که در هر دو سمت استفاده شده است. استخدام کردن افراد برای پروژه خود هم آسان‌تر می‌شود؛ زیرا JavaScript معروف است.
  • مهم‌تر از همه: شما می‌توانید کد frontend خود را در یک محیط Node اجرا کنید. این آسان‌ترین گزینه برای انجام رندر کردن سمت سرور و داشتن برنامه‌های Universal / Isomorphic است.

شما می‌توانید رندر کردن سمت سرور را به هر زبان دیگری انجام دهید، اما به راحتی Node نخواهد بود. کتابخانه ReactDOM کامپوننتی دارد که برای کار با Node طراحی شده است تا رندر کردن سمت سرور را به راحتی چند خط کد نماید.

فرض کنید که یک برنامه React دارید و آن را با استفاده از این خط کد به DOM رندر می‌کنید:

ReactDOM.render(<App data={DATA} />, mountNode);

همان برنامه React مشابه می‌تواند برای رندر کردن سمت سرور با استفاده از این نمونه کد در یک وب‌سرور، به یک رشته HTML بر پایه Node رندر شود:

const ReactDOMServer = require('react-dom/server');

const html = ReactDOMServer.renderToString(<App data={DATA} />);
// در بخش مدیریت اچ‌تی‌تی‌پی سرور، متغیر اچ‌تی‌ام‌ال را به آبجکت پاسخ وب بنویسید

شما می‌توانید این رشته HTML نهایی را بگیرید و از آن به عنوان HTML اولیه برنامه خود استفاده کنید، و کارتان تمام خواهد شد. حال برنامه شما قبل از این که JavaScript در سمت کلاینت بیدار شود، کار خواهد کرد.

چه با استفاد از Node و چه با هر گزینه دیگری که رندر کردن سمت سرور را انجام دهید، این کار در دو سطح مهم یک موفقیت بزرگ است:

  1. این کار SEO وب سرور شما را بسیار خوب خواهد کرد. موتورهای جستجو به جای یک صفحه HTML که یک فایل باندل JavaScript را بارگذاری می‌کند، محتویات واقعی را خواهند دید.
  2. این کار، کارایی وب‌اپلیکیشن شما را بر روی دستگاه‌های کند و محدود، ارتقا خواهد داد. آن دستگاه‌ها محتویاتی خواهند داشت که با آن شروع کنند، در حالیکه به کندی برنامه JavaScript سمت کلاینت را parse می‌کنند. حتی پس از parse کردن آن برنامه، React در سمت کاربر در ابتدا کاری نخواهد کرد؛ زیرا دقیقا محتویات مشابهی را به مانند آنچه از پیش در مرورگر از طریق HTML رندر شده توسط سرور، mount شده بود، خواهد داشت.

اگر امروز شما در حال شروع یک پروژه React از بیخ هستید، Node بهترین گزینه خواهد بود. این ابزار هر کاری که باید در قبال پروژه React خود انجام دهید را آسان‌تر خواهد کرد. فقط مطمئن شوید که قبل از استفاده از Node، رانش (runtime) آن را یاد بگیرید.

اگر نمی‌توانید از Node به عنوان وب‌سرور خود استفاده کنید، همچنان می‌توانید از آن برای اجرای رندر کردن سمت سرور به صورت خارجی استفاده کنید و خروجی‌ای که به شما می‌دهد را به وب سرور غیر Node خود لینک کنید.

همچنین بخوانید:

منبع

مقالات پیشنهادی

منابع تازه برای توسعه دهندگان Front-end - سری 9

امروزه ابزار ها ، کتابخانه ها و فریمورک های مختلفی بصورت روزانه برای توسعه دهنگاه Front-end ارائه می شود تا آنها بتوانند سریع تر ، بهتر و راحتر پروژه...

چرا به Context API جدید React نیاز داریم ؟

چندین سال پیش، Context API به عنوان یک ویژگی آزمایشی با هشدار «این API در آینده می‌تواند بشکند» معرفی شد. با توجه به این که Context API آزمایشی بود، ا...

چرا توسعه دهندگان nodejs را دوست دارند و مشکلات اصلی آن‌ها درباره آن چیست؟

چند ماه پیش در یک نظرسنجی از کاربران خواستیم که دلایل استفاده از نودجی‌اس و علاقه‌شان به آن را به ما بگویند. هدف ما این بود که سخت‌ترین مشکلی که با no...

نکاتی برای توسعه دهندگان Node.js - سری دوم

در سری قبل بیشتر درمورد نکات استایل کدنویسی در Node صحبت کردیم. در این سری علاوه بر اون به نکات فرآیند گردش کار در Node هم اشاره می کنیم.