معرفی کتابخانه جاوا اسکریپت React JS

معرفی کتابخانه جاوا اسکریپت React JS

معرفی کتابخانه جاوا اسکریپت React JSIntroduction to ReactJS JavaScript Library

معرفی کتابخانه جاوا اسکریپت React JS

توسط : admin
ReactJS (React یا React.js) به عنوان یک کتابخانه متن‌باز جاوا-اسکریپت (نه یک فریمورک) برای ساخت رابط کاربری تعریف شده است. مهندسان برتر فیسبوک React.Livecoding را توسعه داده‌اند که محیطی برای شروع یادگیری یا بهبود مهارت‌های کدنویسی React است. ما نیز در ‌این محیط بخشی را برای آموزش‌ها و منابع react js اختصاص داده‌ایم.

سلام به دوستان گلم . اینبار با یک مقاله در مورد معرفی کتابخانه پرقدرت ری اکت با شما هستم . امیدوارم این مقاله کمک کنه شما با این کتابخانه بیشتر آشنا بشید و بتونیم با هم بیشتر و بهتر از React js  استفاده کنیم . پس با من همراه باشید.

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

 

معرفی کتابخانه React JS

 

React یک کتابخانه متن ‌باز محبوب جاوا-اسکریپت است که نمایش داده‌ها را با کمک HTML انجام می‌دهد. همچنین با عناوین ReactJS و React.js نیز شناخته می‌شود، بنابراین اگر در جاهای مختلف با عناوین متفاوتی آن را مشاهده کردید، سردرگرم نشوید. با توسعه آن توسط فیسبوک،  React به صورت عام  نیز با عنوان Facebook React.js نیز شناخته می شود. در حال حاضر، بوسیله اینستاگرام، فیسبوک و توسعه‌دهندگان انجمن React که به این کتابخانه علاقه‌مند هستند، حفظ و نگهداری می شود. 

 

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

 

تاریخچه React JS

React یک تکنولوژی جدید است که با سایر تکنولوژی‌های موجود در بازار مقایسه می‌شود. React در سال 2011، زمانی‌که Jordan Walke (یک مهندس نرم‌افزار در فیسبوک) این کتابخانه را ‌ایجاد کرد، به بازار عرضه شد. React تحت تاثیر فریمورک هایی مثل XHP (که یک فریمورک ساده HTMl برای PHP است) قرار گرفته است. اولین مورد استفاده React در سال 2011 در خوراک (فید) خبری فیسبوک بوده است. بعدها، توسط ‌اینستاگرام برای بهره‌گیری در سیستم اینستاگرام مورد استفاده قرار گرفت. با گذر زمان، React رشد کرد و فیسبوک تصمیم گرفت تا آن را در کنفرانس جاوا-اسکریپت آمریکا (JSConf US) در سال 2011 به صورت متن‌باز در آورد. در کنفرانس جاوا-اسکریپت آمریکا در سال 2015، React Native معرفی شد تا توسعه آسان را با توسعه ‌اندروید و iOS فراهم سازد. در همان سال، Rect Native متن‌باز شد تا به رشد آن کمک شود.

 

نیاز برای کدی بهتر

پیش‌تر در سال 2011، توسعه‌دهندگان در شرکت فیسبوک شروع به پرداختن به برخی از مسائل و مشکلات در زمینه نگهداری کد کردند. با افزایش فزاینده ویژگی‌های اپلیکیشن تبلیغات‌های فیسبوک، تیم فیسبوک نیاز به افراد بیشتری داشت تا ‌این کار را بدون عیب و نقص ادامه دهند. افزایش اعضای تیم و ویژگی‌های اپلیکیشن منجر به کند شدن روند آن‌ها به عنوان یک شرکت شد. با گذر زمان، به خاطر روبرو شدن با آپدیت‌های زنجیره‌ای بسیار، رسیدگی به اپلیکیشن سخت‌تر شد. 

پس از مدتی، مهندسان فیسبوک نتوانستند ‌این آپدیت‌های زنجیره‌ای را ادامه دهند. کد برای کارآمدتر شدن به آپدیت‌های فوری نیاز داشت.

مدلی که ارائه کرده بودند مشکلی نداشت، اما آن‌ها باید در مورد تجربه کاربر تغییری انجام می‌دادند. بنابراین، Jordan Walke نمونه اولیه‌ای ‌ایجاد کرد که فرایند را کارآمدتر می‌کرد و ‌این نقطه شروع React.js را نشان می‌دهد.

 

ظهور React.js به طور فزاینده‌ای فرصت‌هایی را برای توسعه‌دهندگان فرانت-اند به منظور خلق رابط‌های کاربرپسند گسترش داد. 

 

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

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

اجازه دهید تا نگاهی به تاریخچه React.js بر روی یک تایم‌لاین (نمودار گذر زمان) داشته باشیم

react-timeline

 

2010 – اولین علایم React

  • فیسبوک xhp را برای php معرفی و آن را به صورت متن‌باز در آورد.

Xhp اجازه داد تا اجزای مرکب ساخته شود. آن‌ها ‌این ساختار (syntax) را بعدا در React معرفی کردند.

 

 

2011 – نمونه اولیه React

  • Jordan Walke، نمونه اولیه React (FaxJS) را ‌ایجاد کرد که توانست یک المان جستجو را در فیسبوک ارسال کند.

 

2012 – مورد جدیدی در فیسبوک ‌ایجاد شد

  • مدیریت تبلیغات فیسبوک سخت شده بود، در نتیجه فیسبوک نیاز داشت تا راه‌حل مناسبی برای ‌این مسئله پیدا کند. Jordan Walke بر روی نمونه اولیه کار کرد و React را خلق کرد.
  • 9 آپریل: فیسبوک ‌ایسنتاگرام را خرید.

اینستاگرام می‌خواست تکنولوژی جدید فیسبوک را بکار گیرد. با ‌این کار، فیسبوک تلاش کرد تا React را از فیسبوک جدا سازد و آن را به صورت متن‌باز درآورد. قسمت اعظم ‌این کار توسط Pete Hunt انجام شد.

  • 8-12 سپتامبر: در TechCrunch Disrupt San Francisco، مارک زاکربرگ: “بزرگ‌ترین اشتباه ما حساب کردن بیش از ‌اندازه روی HTML5 بود.”‌ قول داد که فیسبوک به زودی تجربیات موبایلی بهتری را ‌ایجاد خواهد کرد.

 

2013 – سال انتشار بزرگ

  • 29-31 مه: JS ConfUS. Jordan Walke، محیط React را معرفی کرد. React به صورت متن‌باز در آمد. حقیقتی جالب: حضار و مخاطبین شک و تردید داشتند. بیشتر افراد فکر می‌کردند React گام بزرگی رو به عقب است.‌ این اتفاق در حالی رخ داد که بیشتر "پذیرندگان(استفاده کنندگان) اولیه" از React در ‌این کنفرانس شرکت کردند، با ‌این حال، React افراد خلاق را هدف قرار داد. سازندگان React‌ این اشتباه را به موقع تشخیص دادند و تصمیم گرفتند تا بعدا یک ‘ تورReact ‘ را به منظور تبدیل افراد متنفر به حامیان شروع کنند.
  • 2 ژوئن: React (توسط فیسبوک) بر روی JSFiddle در دسترس قرار گرفت.
  • 30 جولای: React و JSX در Ruby on Rails در دسترس قرار گرفتند.
  • 19 آگوست: React و JSX در برنامه‌های پایتون در دسترس قرار گرفتند.
  • 14-15 سپتامبر: JSConfEU 2013. سخنرانی Pete Hunt در مورد تجدید نظر در مورد بهترین شیوه‌ها.
  • 17 دسامبر: David Nole، OM را که مبتنی بر React است، معرفی کرد. او توضیح می‌دهد که React چقدر عالی است – که به اولین اقتباس‌کننده‌ها رسیده است. ‌این مقاله نشان داد که چگونه React از گزینه‌های دیگر موجود بهتر است که موجب افزایش ارزش React شد.

 

 

2014 – سال گسترش

React به تدریج شهرتش را کسب نمود و شروع به گسترش در بین ‘اکثریت اولیه’ کاربران بالقوه کرد. در‌این نقطه، آن‌ها به جای ‌اینکه تنها بر فواید فنی React تکیه کنند نیاز داشتند تا پیامی‌ جدید بدهند، و ‌این پیام جدید عبارت بود از: چگونه React پایدار است؟ با تمرکز بر ‌این پیام، آن‌ها موفق شدند تا شرکت‌هایی مانند نتفلیکس را جذب کنند.

  • اوایل 2014: کنفرانس #reactjsworldtour به منظور‌ایجاد انجمن و ‘تبدیل افراد متنفر به حامیان’ آغاز به کار کرد.
  • 2 ژانویه: ابزار توسعه‌دهنده React تبدیل به افزونه‌ای برای ابزار توسعه‌دهنده مرورگر کروم شد.
  • فوریه:  Atom – یک ویرایشگر متنی قابل هک برای قرن 21 ام – معرفی شد
  • 7-9 آپریل: React London 2014
  • ژوئن: ReactiveX.io ظاهر شد.
  • 13 جولای: انتشار React Hot Loader. React Hot Loader یک پلاگین است که به اجزای React اجازه می‌دهد تا به صورت آنلاین بدون از دست دادن حالت، دوباره بارگذاری شوند.
  • 12 دسامبر: PlanOut: زبانی برای تجربیات آنلاین. انتشار PlanOut 0.5 که شامل یک ویرایشگر زبان PlanOut مبتنی بر React است و به مفسر قابلیت feature-parity (قابلیت کار کردن با IPV6) با آخرین ورژن PlanOut (که به صورت داخلی در فیسبوک استفاده شده است) را می‌بخشد.

 

2015 – Rect پایدار است

  • اوایل 2015: Flipboard، React Canvas را منتشر می‌کند.
  • ژانویه: نتفلیکس به React علاقه‌مند است.
  • اوایل 2015: Airbnb از React استفاده می‌کند.
  • 28-29 ژانویه: React.js Conf 2015 – فیسبوک اولین نسخه React Native را برای React.js Conf 2015 در طول یک سخنرانی فنی منتشر می‌کند.
  • فوریه: معرفی Relay و GraphQL در React.js Conf.
  • 25 مارس: فیسبوک اذعان کرد که React Native برای iOS باز است و در GitHub موجود است.
  • 2 ژوئن: Redux توسط Dan Abramov و Andrew Clark منتشر شد.
  • 2 سپتامبر: اولین نسخه پایدار ابزار توسعه‌دهنده React جدید راه‌اندازی شد.
  • 14 سپتامبر: React Native برای ‌اندروید منتشر شد.

 

2016 – React در مرحله جریان اصلی خود است

  • مارس: معرفی Mobx
  • 22-23 فوریه: React.js Conf 2016 سن فرانسیسکو
  • Draft.js توسط Isaac Salier-Hellendag در React.js Conf معرفی شد.
  • مارس: معرفی React Storybook.
  • 2-3 ژوئن: ReactEurope 2016.
  • 11 جولای: معرفی سیستم Error Code.
  • نوامبر: معرفی Blueprint – یک ابزار رابط کاربری برای وب.

2017 – سال پیشرفت‌های بیشتر

  • اوایل 2017: Airbnb کتابخانه متن‌باز جدید خود با نام React Sketch.app را معرفی می‌کند.
  • 19 آپریل: React Fiber در F8 2017 به صورت متن‌باز در می‌آید.
  • سپتامبر: Relicencing React، Jest، Flow و Immutable.js.
  • 26 سپتامبر: React 16: حدود خطا، پرتال‌ها، Fragment و معماری Fiber.
  • اکتبر: نتفلیکس React.js سمت کاربر را حذف می‌کند.
  • 28 نوامبر: React نسخه 16.2.0: بهبود پشتیبانی برای (Fragment).

 

2018 – اکنون React در چه حالی است؟

  • 1-2 مارس: JSConf Iceland – Beyond React 16 توسط Dan Abramov
  • 29 مارس 2018: React 16.3.0 منتشر شده است.

چرا غول های اینترنتی از ReactJS استفاده می کنند؟

 

  1. FaceBook
    اگرچه تا حد زیادی ، فیس بوک از ReactJS استفاده می کند. صفحه وب آنها با React ساخته شده است ، به عنوان اسکریپتی که در کد برنامه ترکیب شده است. برنامه موبایل همچنین با نسخه ای از React به نام React Native ساخته شده است که مشابه آن است ، اگرچه وظیفه نمایش اجزای داخلی iOS و Android را به جای عناصر DOM نشان می دهد. جالب اینجاست که فیسبوک مکانی بود که در ابتدا کتابخانه ReactJS  در آن ایجاد شد ، به همین دلیل استفاده از این اپلیکیشن واضح است. در حال حاضر فیس بوک بتا از نسخه کاملا بازنویسی شده ReactJS خود را با نام React Fiber استفاده میکند .
  2. Instagram
    استفاده از ReactJS در اینستاگرام بسیار زیاد است. اثبات این امر ویژگی های بی شماری از جمله مکان جغرافیایی ، API های Google Maps ، دقت موتور جستجو و همچنین برچسب هایی است که بدون هشتگ ظاهر می شوند. همه چیز در API برنامه وجود دارد - و واقعاً چشمگیر است.اینستاگرام کاملاً مبتنی بر کتابخانه ReactJS است و به طرفداران این امکان را داده است تا کاملاً با ویژگیهای شگفت انگیز آن سازگار شوند.
  3. Netflix
    نسخه React نیز با Netflix کار می کند - به طور خاص روی پلتفرم خود به نام Gibbon که به جای DOM مورد استفاده در مرورگرهای وب برای دستگاه های تلویزیونی استفاده می شود. Netflix حتی یک پست رسمی در وبلاگ منتشر کرده است که توضیح می دهد کتابخانه ReactJS چگونه به سرعت راه اندازی ، عملکرد زمان اجرا ، مدولار و سایر مزایای آنها کمک می کند.
  4. New York Times
    چند ماه پیش ، نیویورک تایمز یک پروژه جدید عالی را طراحی کرده است که ظاهر متفاوت ستاره ها را روی فرش قرمز اسکار شبیه سازی می کند. بدیهی است که رابط این پروژه در React ساخته شده است و به کاربران اجازه می دهد تا از 19 سال گالری عکس های مختلف را به روشی خوب فیلتر کنند. ارائه مجدد در این پروژه تنها یکی از ویژگی های چشمگیر است که می توانیم از ReactJS برای آن تشکر کنیم.
  5. Yahoo Mail
    با تعجب (یا نه) ! ، سرویس گیرنده ایمیل یاهو از React نیز استفاده می کند. از آنجا که فیس بوک صاحب Yahoo! امروزه ایده یک معماری مستحکم و یکپارچه را در خود دارد ، به همین دلیل است که React در بیشترین تعداد بیت و قطعات گنجانیده شده است. معماری که بطور خاص با React به عنوان یک قطعه از آن ساخته شده است را می توان در اینجا مشاهده کرد  و توسعه دهندگان Yahoo!  آسان تر با کدها کار کرده و خیلی بهتر آن را جمع بندی می کنند.
  6. Khan Academi
    بخش های زیادی از Khan Academy  بر اساس React در حال حاضر پیاده سازی شده است. یکی از توسعه دهندگان آنها ، Joel Burget ، تجربه شخصی خود را با کتابخانه ReactJS و نحوه تمایز آن با اسکریپت سنتی Backbone که قبلاً از آنها استفاده می کردند ، به اشتراک گذاشت. او به طور واضح React را به عنوان یک به پیشرفت ارزشمند تعریف می کند .
  7. WhatsApp
    اگرچه قبل از راه اندازی رسمی واتس اپ چندین  نسخه بتا  از آن وجود داشت ،  ولی فیس بوک از ReactJS برای ساخت واسط های کاربری برای نسخه رسمی خود برای واتس اپ استفاده می کند ، درست مثل اینکه از Underscore.js و Velocity.js بعنوان برخی از موتورهای کارآمد خود استفاده می کند.از همین اواخر ، برنامه وب جدید واتس اپ نیز از React استفاده کرده است ، درست مانند تجربه وب فیس بوک که در بالا به آن اشاره شد.
  8. Vivaldi Browser
    یکی از فناوری های موجود در مرورگر محبوب Vivaldi ، کتابخانه ReactJS است. موتوری که این مرورگر از آن استفاده می كند با نام "Blink" نامگذاری شده است و تقریباً مشابه Google Chrome است كه روی HTML5 ، ReactJS ، JS ، CSS3 و بسیاری موتورهای دیگر ساخته شده است.
  9. Codecademi
    از اوت 2014 ، Codecademy تصمیم گرفته است كتابخانه فیس بوك را به طور كامل مورد استفاده قرار دهد. ReactJS آشکارا بخشی از آن بود - و هنوز هم یکی از اسکریپت های کلیدی است که در برنامه قرار دارد. از هدر گرفته تا منو و حتی ناوبری ، استفاده از ReactJS در Codeacademy وجود دارد که به عنوان یک راه حل منطقی ایجاد شده و تمام اجزای مختلف را برای همه تنظیم می کند. طبق گفته همه افراد در Codeacademy ، برخی از جنبه های React که آنها از آن استقبال می کنند شامل این واقعیت است که فیلمنامه از نظر نبرد تست شده ، به راحتی به فکر می افتد ، سئو را آسان می کند و به اندازه کافی انعطاف پذیر برای آینده است.
  10. DropBox
    Dropbox بیش از دو سال پیش به ReactJS تغییر یافته است. درست در زمانی که React میان برنامه نویسان برنامه محبوب شد. منابعی که بخشی از این چارچوب را تشکیل می دهند ، توسط Dropbox نیز به کار می روند - و به طور گسترده در موفقیت این سرویس ذخیره سازی شگفت انگیز مبتنی بر ابر و راه حل پشتیبان گیری آنلاین کمک می کند.

 

در ادامه چه خواهد شد؟

 

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

 

سخن پایانی

در پایان ، کاهش ریسک ، کارآیی توسعه ReactJS ، بهبود اثربخشی و مزایای بی شمار سازمانی ، همگی دلایلی برای نام های بزرگ برنامه ها برای ارتقاء به ReactJS و بهره برداری از مزایای شگفت انگیز ارائه شده توسط این کتابخانه بوده است. 

 

 

نظرات :

در عرض چند دقیقه برای ایجاد حساب

کاربری خود اقدام کنید


اکنون حساب کاربری خود را ایجاد کنید!


ایجاد حساب کاربری

با ثبت نام در نیلوتک از آخرین بروز رسانی های آموزش ها و مقالات سایت مطلع شوید