مجله آموزشی آقای نرم افزار

مقالات به روز و کاربردی برای افزایش سطح دانش شما

ReactJS چیست

ReactJS چیست

ReactJS چیست

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

React JS توسط مهندس نرم افزار فیسبوک آقای «جردن واک» ساخته شده است. خالقReact JS میگوید الهام ساخت این فریمورک را از XHP که یک چارچوب فریم ورک HTML برای PHP میباشد گرفته است.اولین نسخه در سال ۲۰۱۱ توسعه داده شد و در بخش اخبار فیسبوک استفاده گردید و بعد از یک سال یعنی ۲۰۱۲ در سرویس اینستاگرام مورد استفاده قرار گرفت ، در سال ۲۰۱۳ در جریان کنفرانس JSConf که در آمریکا برگزار شده بود این کتابخانه متن باز اعلام شد.

نکته مهم در کاربرد React JS این است که این کتابخانه صرفا در الگوی طراحی MVC، عهده‌دار بخش View است. View یا اینترفیس در واقع مرتبط با نمایش اجزا هستند و طبعا React JS به جای پرداختن به الگوی MVC به وظایفی می‌پردازد که مربوط به نمایش اجزا می‌پردازد. از دیگر کاربردهای React JS استفاده در طراحی و ایجاد سایت تک صفحه‌ای است.

استفاده از React JS در HTML

استفاده از React JS در صفحه HTML کار چندان دشواری نیست ، برای این که شما بتوانید این کار را انجام دهید باید دانشی راجب JSX و ECMAScript 2015 داشته باشید. بنابراین انتظار می رود که پیش از استفاده از «ری اکت» دانش کافی از HTML و JavaScript داشته باشید.

چرا React JS اینقدر محبوب است؟

اینستاگرام و فیسبوک

دلیل محبوبیت این فریمورک را میتوان این شمرد که یک موسسه یا شرکت بزرگ و عظیمی با طرفداران فوق العاده بالا مسئول نگهداری و توسعه یک کتابخانه جاوا اسکریپتی میشود،دیگر نباید شکی به این کتابخانه داشت.امروزه در سراسر دنیا همه از Facebook و Instagram استفاده میکنند و این را میدانیم که چقدر این دو شبکه اجتماعی از نگاه فنی کم اشکال و قابل اطمینان میباشند و در سطح بالایی قرار دارند.حال باید این را در نظر گرفت که این شرکت بزرگ مسئولیت توسعه چنین کتابخانه ی جاوا اسکریپتی مهمی را بر عهده دارد و از آن برای ایجاد یک رابط کاربری زیبا و عام پسند استفاده کرده است. بنابراین طراحان سایت و توسعه دهندگان وب خیلی سریع سراغ ری اکت رفتند.

React چه خصوصیات متمایزی دارد؟

ری اکت باید ویژگی های بسیار جالبی برای برنامه نویسان وب و طراحان وب داشته باشد که به این سرعت فراگیر و محبوبیت زیادی به دست آورده است. در ادامه این ویژگی های مهم را با هم بررسی میکنیم.

JSX

jsx چیست

ری اکت به صورت پیش فرض از JSX یا JavaScript Syntax Edition به جای جاوا اسکریپت عادی استفاده شود.استفاده از JSX اجباری نیست اما توصیه می شود از آن استفاده کنید به دلیل این که دارای سرعت بیشتر است و همچنین بسیاری از ارورهای سینتکسی شما به کمک JSX آشکار میشود. در واقع میتوان این را بیان کرد JSX یک مدل نوشتن کد در جاوااسکریپت میباشد،به این شکل که شما تمام تمپلیت های HTML تان را مستقیم در کدهای جاوااسکریپت مینویسید و خود فریمورک مسئول تبدیل و Convert آنها به جاوا اسکریپت است.

فایل های نوشته شده به فرما JSX با پسوند .jsx ذخیره می شوند.جدا از تمپلت های HTML شما میتوانید تکه کدهای XML را نیز در کد استفاده کنید.

React Native

React Native چیست

ری اکت نیتیو «ReactNative» که امکان توسعه برنامه های مبتنی بر IOS ,Android و UWP را به React فراهم میکند , در سال ۲۰۱۵ در کنفرانس React.js Conf فیسبوک میباشد معرفی شد و به صورت رایگان در دسترس برنامه نویسان قرار گرفت.این کتابخانه قدرتمند جاوااسکریپت که می‌توان با استفاده از آن برای سیستم عامل‌های موبایلی ios , android اپلیکیشن ساخت باید توجه داشت که applicationهای ساخته شذه کاملاً native خواهند بود و خبری از applicationهای hybrid نیست.

Virtula Document Objective Model

ری اکت برای کش کردن اطلاعات از ساختار درون حافظه ای بهره میبرد.نام این ساختار Virtual DOM است که ابتدا تغییرات انجام شده را محاسبه میکند و بعد از آن مرورگر کاربر را آپدیت میکند.این ویژگی به برنامه نویسان سایت و توسعه دهندگان این امکان را میدهد که به گونه ای کدنویسی کنند که انگار تمام صفحه با هر تغییر رندر میشود،در حالی که در واقع کتابخانه ری اکت تنها کامپوننت هایی را رندر میکند که تغییر کرده است.

Single-way Data flow

در ری اکت یک سری مقدار به صورت Value تغییر ناپذیر به عوامل رندر کننده کامپوننت ها داده می شود.این مقدارها مثل ویژگی تگ HTML هر رندرکننده است.در این حالت کامپوننت ها قادر نخواهند بود به صورت مستقیم به هیچ ویژگی دسترسی داشته باشند و دستکاری کنند، اما میتوان از یک عملکرد call back استفاده کرد تا به کمک آن تغییرات انجام دهند.به این قرایند «properties flow down; action flow up» میگویند.

چرا باید از React استفاده کنیم؟

چرا باید از React استفاده کنیم؟

در دنیای FrontEnd و طراحی رابط کاربری هر روز تکنولوژی ها و فریمورک های جدیدی خلق میشود که انسان را غافل گیر میکند،اما در این وضعیت بهتر است وقت خود را برای یادگرفتن تکنولوژی های جدید که ممکن است زود به پایان عمر خود برسند تلف نکنیم. این را به یاد داشته باشید که کمپانی های بزرگی از ری اکت برای سایت خود استفاده کرده اند مانند : outlool.live.com , udemy , dropbox, imdb ,trello  و …… پس میتوان به این کتابخانه ی فوق العاده جاوااسکریپت اعتماد کرد و ما در ابتدای مقاله گفتیم که خالق و توسعه دهنده این کتابخانه جاوا اسکریپت فیسبوک میباشد و این را نباید فراموش کرد که با ری اکت نیتیو برنامه هایی فوق العاده همچون اسکایپ ، فیسبوک و اینستاگرام و … در نسخه ی جدید خلق شده اند.

مطالب مرتبط با این موضوع