**ری‌اکت** (به انگلیسی: React)، یک کتابخانه متن‌باز جاوا اسکریپت برای ساخت رابط‌های کاربری و اجزای(Component) صفحات وب است. ری‌اکت در دو نسخه ری‌اکت جی اس (به انگلیسی: React.js) و ری‌اکت نیتیو (به انگلیسی: React Native) ارائه شده‌است. ری‌اکت جی اس برای دسکتاپ و ری‌اکت نیتیو برای طراحی برنامه‌های موبایل می‌باشد. از دیگر کتابخانه‌های مشابه می‌توان به Angular و Vue اشاره کرد. این کتابخانه‌های جاوااسکرپت با هدف ساختن صفحات وب در صفحه مرورگر مقصد به جای ساخته شدن صفحات در سمت سرور تولید شده‌اند. بدین مفهوم که پس از ارتباط اولیه کلاینت با سرور، ابتدا این کتابخانه‌ها بر روی کلاینت بارگزاری می‌شوند و سپس از طریق ارتباط با API محتوای متغیر درون صفحه به صورت جداگانه بارگیری شده و صفحه وب در سمت مقصد سرهم می‌شود.

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

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

به دلیل بهینه بودن ری‌اکت برای دریافت اطلاعاتی که با سرعت تغییر می‌کنند، می‌توان از آن برای توسعه برنامه تک‌صفحه‌ای(SPA) یا برنامه‌های موبایل استفاده کرد. هرچند دریافت اطلاعات، ابتدایی‌ترین بخش در یک صفحهٔ وب است و برنامه‌های پیچیده ری‌اکت معمولاً به کتابخانه‌های اضافه‌ای برای مدیریت وضعیت (به انگلیسی: State Management) , مسیریابی (URL mapping)، و اتصال به رابط برنامه‌نویسی کاربردی (API) نیاز دارند.

ری‌اکت و ری‌اکت نیتیو از جمله پروژه‌های متن‌باز شرکت فیس‌بوک هستند که در صدر محبوب‌ترین پروژه‌های وبگاه گیت‌هاب قرار دارند.

ری اکت (reactjs) اساساً یک کتابخانه open-source جاوا اسکریپتی برای ساخت رابط کاربری(user interfaces) برای single page applications(اپلیکیشن‌های تک‌صفحه‌ای) است. این کتابخانه برای مدیریت لایه View برای وب استفاده می‌شود. همچنین React این امکان رو در اختیار ما می‌گذارد که reusable UI components(کامپوننت‌های قابل استفاده مجدد رابط کاربری) را ایجاد کنیم.React در ابتدا توسط Jordan Walke یکی از مهندسین ارشد فیسبوک ایجاد شد.React ابتدا در سال ۲۰۱۱ در فیسبوک مورد استفاده قرار گرفت و سپس در سال ۲۰۱۲ در اینستاگرام استفاده شد.

ری اکت این امکان را در اختیار توسعه دهندگان می‌گذارد که وب اپلیکیشن‌های بسیار بزرگ که می‌تواند date را تغییر بدهد، بدون reload صفحه ایجاد کنند. مهم‌ترین اهداف React را می‌توان سادگی، سرعت و مقیاس‌پذیر بودن دانست. تمرکز اصلی React بر روی رابط کاربری است و فقط در لایه View در معماری MVC مطابقت دارد. این کتابخانه می‌تواند با کتابخانه‌های و فریمورک‌های دیگر جاوا اسکریپت مثل Angular ترکیب و مورد استفاده قرار گیرد.

تاریخچه
-------

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

ReactNative، که امکان توسعه برنامه‌های مبتنی بر Android, IOS و UWP را با React فراهم می‌کند، در فوریه ۲۰۱۵ در React.js Conf فیسبوک معرفی شد و در مارس ۲۰۱۵ به صورت رایگان عرضه شد.

در ۱۸ آوریل ۲۰۱۷ فیسبوک اعلام کرد React Fiber، یک الگوریتم اصلی جدید React library برای ایجاد رابط کاربری است. React Fiber پایه و اساس هرگونه پیشرفت‌های آینده و ویژگی‌های چارچوب React خواهد بود.

ویژگی‌های قابل توجه
-------------------

### جریان داده‌ای یک سویه

### DOM مجازی

وقتی صفحه وبی بارگذاری می‌شود مرورگر یک مدل شی گرا از المان‌های موجود در صفحه می‌سازد. این مدل Dom یا Document Object Model نام دارد. این نمودار یک نمودار درختی از اشیا موجود در صفحه است. برنامه‌هایی مانند جاوااسکریپت با استفاده از این مدل یک صفحه Html را به صورت پویا ایجاد می‌کنند.

در تکنولوژیReact.js از مفهومی به نام Dom مجازی (Virtual DOM) استفاده می‌شود و به این صورت کار می‌کند که برای هر شی Dom که ویژگی جدیدی قرار است برای آن ساخته شود نیازی نیست که آن شی دوباره ساخته شود بلکه تنها نیاز است که آن ویژگی مورد نظر را تغییر داد یا افزود.

### جی‌اس‌ایکس (JSX)

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

### معماری فراتر از HTML

### ری‌اکت نیتیو(React Native)

ری‌اکت نیتیو یک فریم‌ورک جاواسکریپت است که برای طراحی برنامه‌های بومی موبایل و برای سیستم عامل‌های اندروید و iOS ساخته شده‌است. React Native بر پایهٔ کتاب‌خانهٔ جاوا اسکریپت فیسبوک یعنی همان ReactJs ساخته شده‌است، اما به‌جای هدف قرار دادن مرورگر، این‌بار پلتفرم‌های موبایل را مورد هدف قرار داده‌است.

به‌عبارتی حالا توسعه دهندههای وب می‌توانند برنامه‌هایی برای موبایل بنویسند که کاملاً بومی یا اپلیکیشن نیتیو به نظر برسند و همگی از کتابخانه React نوشته شده باشند.

برخی از اپلیکیشن‌هایی که با ری‌اکت نیتیو ساخته شده‌اند:Instagram - Facebook - Facebook Ads Manager - f8 - Skype , ...

#### آینده توسعه

وضعیت توسعه پروژه را می‌توان در انجمن تیم اصلی توسعه دهندگان آن دنبال کرد. هرچند تغییرات جزئی، مشکلات و درخواست ادغام آن در مخزن آینده ری‌اکت(Feture of React) دنبال می‌شوند.

### پروژه‌های زیرمجموعه

وضعیت پروژه‌های زیرمجموعه ری‌اکت در صفحه ویکی آن قابل مشاهده است.

ری اکت جی‌اس یکی از کتاب‌خانه‌های جاوا اسکریپت است، اما React Native یکی از فریمورک‌های جاوا اسکریپت است که از React Js استفاده می‌کند.

برای توسعه اپلیکیشن‌های سیستم عامل اندروید از زبان جاوا و برای توسعه اپلیکیشن‌های سیستم عامل iOS از زبان سوییفت (Swift) استفاده می‌شود. در حالی‌که React Native می‌تواند در توسعه هر دو سیستم عامل مورد استفاده قرار گیرد.

### توافق‌نامه مجوز مؤلف فیس‌بوک

فیس‌بوک مشارکت کنندگان ری‌اکت را مجاب به پذیرش توافق‌نامه مجوز مؤلف می‌داند.

نحوه به‌کارگیری React در رعایت اصول مهندسی نرم‌افزار
----------------------------------------------------

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

### مدیریت وضعیت و جریان داده‌ای یک‌سویه

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

### بهینه‌سازی عملکرد با DOM مجازی

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

### جی‌اس‌ایکس (JSX) برای خوانایی بهتر

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

جمع‌بندی
--------

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

نصب ReactJS
-----------

به ۳ روش امکان نصب ری اکت جی اس وجود دارد اما بهترین راه استفاده از بسته create-react-app است که به راحتی توسط npm قابل نصب می‌باشد.

برای نصب و استفاده مراحل زیر توسط npm انجام می‌شود:

```
npm install -g create-react-app
create-react-app my-app

cd my-app
npm start
```

### اصطلاحات رایج

ری اکت تلاش نمی‌کند یک کتابخانه کامل ارائه بدهد. بلکه به‌طور خاص برای ساخت رابط‌های کاربری طراحی شده‌است.

پروانه نرم‌افزاری
-----------------

پانویس
------

1. ↑  "Releases - facebook/react". *GitHub*.
2. ↑  "React – A JavaScript library for building user interfaces". *reactjs.org* (به انگلیسی). Retrieved 2020-08-07.
3. ↑  «Facebook's React JavaScript User Interfaces Library Receives Mixed Reviews». InfoQ. بایگانی‌شده از اصلی در ۸ مارس ۲۰۱۶. دریافت‌شده در ۲۰۱۶-۱۲-۰۳.
4. ↑  «Open source in 2015: A year of growth». Facebook Code. دریافت‌شده در ۲۰۱۶-۱۲-۰۳.
5. ↑  «Bill Fisher's answer to How was the idea to develop React conceived and how many people worked on developing it and implementing it at Facebook? - Quora». www.quora.com. دریافت‌شده در ۲۰۱۶-۱۲-۰۳.
6. ↑  «Facebook announces React Fiber, a rewrite of its React framework – TechCrunch». *techcrunch.com* (به انگلیسی). دریافت‌شده در ۲۰۱۸-۰۵-۰۴.
7. ↑  "acdlite/react-fiber-architecture". *GitHub* (به انگلیسی). Retrieved 2018-05-04.
8. ↑  «Meeting Notes». React Discuss. بایگانی‌شده از اصلی در ۲۲ دسامبر ۲۰۱۵. دریافت‌شده در ۲۰۱۶-۱۲-۰۴.
9. ↑  «facebook/react». GitHub. دریافت‌شده در ۲۰۱۶-۱۲-۰۴.
10. ↑  "React". *react.dev* (به انگلیسی). Retrieved 2023-06-18.

| * ن
* ب
* و
کتابخانه‌های الگو جاوااسکریپت |
| --- |
| کتابخانه‌ها | 
* انگولارجی‌اس
* بک‌بون جی‌اس
* Chaplin.js
* Dust.js
* امبر جی‌اس
* Handlebars
* HTMLBars
* ناک‌اوت‌جی‌اس
* Marko.js
* Mustache
* ری‌اکت (کتابخانه جاوااسکریپت)
* Underscore.js
* Vue.js

 |
| مفاهیم | 
* مدل-نما-کنترل‌گر (ام‌وی‌سی)
* مدل–نما–نمامدل (ام‌وی‌وی‌ام)

 |


| * ن
* ب
* و
چارچوب نرم‌افزاری تحت وب |
| --- |
| ای‌اس‌پی‌دات‌نت | 
* ای‌اس‌پی‌دات‌نت ام‌وی‌سی
* ASP.NET Web Forms
* ASP.NET Dynamic Data
* BFC
* دات‌نت‌نیوک
* MonoRail
* OpenRasta
* Umbraco

 |
| کلد فیوژن | 
* ColdSpring
* Fusebox
* Mach-II
* Model-Glue
* onTap
* on Wheels

 |
| لیسپ معمولی | 
* CL-HTTP
* SymbolicWeb
* UnCommon Web
* Weblocks

 |
| سی++ | 
* CppCMS
* Wt

 |
| جاوا | 
* آپاچی استراتس
* AppFuse
* Flexive
* ابزار وب گوگل
* Grails
* وادین
* ItsNat
* جاواسرور فیسز
* Jspx
* Makumba
* OpenXava
* پلی فریمورک
* Eclipse RAP
* Reasonable Server Faces
* RIFE
* Seam
* اسپرینگ فریمورک
* Stripes
* Tapestry
* WebWork
* Wicket
* ZK
* ICEfaces
* WaveMaker

 |
| اسکالا | 
* Lift (web framework)
* پلی فریمورک

 |
| جاوااسکریپت | 
* Ample SDK
* چارچوب جاوااسکریپت پروتوتایپ
* Rico
* script.aculo.us
* SproutCore
* جی‌کوئری
* دوجو
* امبر جی‌اس

 |
| پرل | 
* Catalyst
* Dancer
* Gantry
* Interchange
* Mason
* Maypole
* Mojolicious
* Poet
* WebGUI

 |
| پی‌اچ‌پی | 
* AppFlower
* کیک‌پی‌اچ‌پی
* کدایگنایتر
* دروپال
* ایی۱۰۷
* فیول‌پی‌اچ‌پی
* Helium
* هرد
* جوملا
* Lithium
* Midgard
* مادایکس
* Qcodo
* Seagull
* سیلوراسترایپ
* سیمفونی
* تایپو۳
* وردپرس
* Xaraya
* یی
* چارچوب زند
* Zeta Components
* لاراول
* فلر فریمورک
* فلکون

 |
| پایتون | 
* CherryPy
* جنگو
* فلسک
* Nevow
* TurboGears
* Plone
* Pyjamas
* Pylons
* Pyramid
* web2py
* Zope
* تورنادو (وب سرور)

 |
| روبی | 
* روبی آن ریلز
* Merb
* Sinatra
* Hobo
* Camping
* Nitro
* Ramaze

 |
| اسمال‌تاک | 
* AIDA/Web
* Seaside

 |
| سایر زبان‌ها | 
* Application Express (پی‌ال/اس‌کیوال)
* HAppS (هسکل)
* Kepler (لوا)
* OpenACS (تی‌سی‌ال)
* SproutCore (جاوااسکریپت/روبی)
* Yaws (ارلنگ)

 |

| * ن
* ب
* و
اکما اسکریپت |
| --- |
| Dialects | 
* اکشن‌اسکریپت
* Caja
* جاوااسکریپت
	+ engines
	+ Asm.js
* جی‌اسکریپت
* جی‌اسکریپت دات‌نت
* QtScript
* تایپ‌اسکریپت
* وی‌ام‌ال‌اسکریپت

 |
| Engines(comparison) | 
* Carakan
* Futhark
* InScript
* JavaScriptCore
* جی‌اسکریپت
* KJS
* Linear B
* Narcissus
* QtScript
* Rhino
* SpiderMonkey
	+ TraceMonkey
	+ JägerMonkey
* Tamarin
* وی۸ (موتور جاوااسکریپت)
* ChakraCore
	+ Chakra
* جی‌اسکریپت دات‌نت
* ناسهورن (موتور جاوااسکریپت)

 |
| چارچوب نرم‌افزار | 

|  |  |
| --- | --- |
| جاوااسکریپت | 
* Ample SDK
* Chaplin.js
* دوجو
* Echo
* Ext JS
* ابزار وب گوگل
* جی‌کوئری
* Lively Kernel
* midori
* Mochikit
* موتولز
* چارچوب جاوااسکریپت پروتوتایپ
* Pyjs
* qooxdoo
* Rialto
* ریکو (آژاکس)
* script.aculo.us
* SmartClient
* SproutCore
* Spry
* Wakanda Framework
* کتابخانه وای‌یوآی

 |
| جاوااسکریپت | 
* AppJet
* Jaxer
* نود.جی‌اس
* WakandaDB

 |
| Multiple | 
* Cappuccino
	+ Objective-J
* PureMVC

 |
| کتابخانه جاوا اسکریپت | 
* بک‌بون جی‌اس
* SWFObject
* SWFAddress
* Underscore.js

 |

 |
| People | 
* برندان آیک
* داگلاس کراکفرد
* جان رزایگ
* Scott Isaacs

 |
| Other | 
* اچ‌تی‌ام‌ال پویا
* Ecma International
* JSDoc
* JSGI
* JSHint
* جی‌اس‌لینت
* جی‌سان
* JSSS
* Sputnik
* SunSpider
* Asynchronous module definition
* CommonJS

 |
| 
 Lists
JavaScript libraries
Ajax frameworks
 Comparisons
JavaScript frameworks
server-side JavaScript
 |

| * ن
* ب
* و
متا پلتفرمز |
| --- |
| Services | 

|  |  |
| --- | --- |
| فیس‌بوک | 
* فیس‌بوک
* Features
* Beacon
* Bluetooth Beacon
* Credits
* Dating
* EdgeRank
* Feed
* Gaming
* Graph Search
* Instant Articles
* Like button
* Live
* Lookalike audience
* Onion address
* Platform
	+ Connect
* Safety Check
* Stories
* Watch
	+ List of original programs
* Zero

 |
| Otherapplications | 
* Atlas Solutions
* Express Wi-Fi
* گیفی
* Free Basics
* اینستاگرام
	+ Hyperlapse
	+ آی‌جی‌تی‌وی
	+ فهرست حساب‌های اینستاگرام با بیشترین دنبال‌کننده
	+ فهرست پست‌های اینستاگرام با بیشترین لایک
* مسنجر (نرم‌افزار)
	+ Kids
	+ مسنجر (نرم‌افزار)
* مپیلاری
* Oculus
	+ Quest
	+ Quest 2
	+ آکیولوس ریفت
		- CV1
		- S
	+ Go
	+ Touch
* Portal
* تردز
* واتس‌اپ
* Workplace
* Zuck Bucks

 |
| Former | 
* فرندفید
* Home
	+ HTC First
* M
* Onavo
* Paper
* Slingshot
* tbh
* Wirehog

 |

 |
| People | 

|  |  |
| --- | --- |
| Founders | 
* مارک زاکربرگ (28% equity)
* داستین موسکوویتز (7%)
* ادواردو ساورین (*5%, formerly*)
* کریس هیوز (*1%, formerly*)
* Andrew McCollum

 |
| Board | 

|  |  |
| --- | --- |
| Current | 
* مارک زاکربرگ
* شریل سندبرگ
* مارک اندریسن
* درو هیوستون
* Nancy Killefer
* Robert M. Kimmitt
* تونی شو

 |
| Former | 
* پیتر تیل

 |

 |
| Executiveofficers | 

|  |  |
| --- | --- |
| Current | 
* مارک زاکربرگ (Chairman and CEO)
* Andrew Bosworth (CTO)
* کریس کاکس (CPO)
* مارنه لوین (Chief Business Officer)
* نیک کلگ (President of Global Affairs)
* Jennifer Newstead (Chief Legal Officer)

 |
| Former | 
* شان پارکر (*4%, formerly*)
* Owen Van Natta
* Gideon Yu
* Adam D'Angelo
* Chris Kelly
* برت تیلور
* شریل سندبرگ
* مایک شروپفر
* دیوید ونر
* David Ebersman
* Alex Stamos

 |

 |
| Notableemployees | 

|  |  |
| --- | --- |
| Current | 
* Lars Rasmussen (Graph Search director)
* Naomi Gleit (VP of social good)
* Thomas Reardon (Reality Labs director)

 |
| Former | 
* بلیک راس (Director of Product)
* Ted Ullyot (VP, General Counsel, and Secretary)
* Hugo Barra (VP of Oculus VR)
* جان کارمک (CTO of Oculus VR)
* مت کوهلر
* Charlie Cheever
* رندی زاکربرگ
* Yishan Wong
* جرج فرانسیس هاتز
* Joe Lockhart
* Andrei Alexandrescu (research scientist)
* Elliot Schrage (VP of Global Communications, Marketing and Public Policy)

 |

 |

 |
| Open source | 
* آپاچی کسندرا
* Apache Hive
* آپاچی تریفت
* Buck
* FQL
* هک (زبان برنامه‌نویسی)
* ماشین مجازی هیپ‌هاپ
* HipHop for PHP
* Infer
* MyRocks
* Open Compute Project
* فابریکاتور
* ری‌اکت
* ری اکت نیتیو
* RocksDB
* Scribe
* Telecom Infra Project
* تورنادو (وب سرور)

 |
| Mass media | 
* *The Facebook Effect*
* *The Accidental Billionaires*
* *شبکه اجتماعی (فیلم)*

 |
| Concepts | 
* Activity stream
* Social graph
* Friending and following
* Reblogging
* Fan-gating
* Facebook diplomacy
* Facebook like button

 |
| Business | 
* History
* Timeline
* Acquisitions
* f8 conference
* IPO
* Censorship
* نقد فیس‌بوک
	+ Cambridge Analytica data scandal
	+ 2020 Facebook ad boycotts
	+ 2021 Facebook leak
	+ Privacy
	+ Content management
* Litigation

 |
| Lists | 
* فهرست صفحه‌های فیس‌بوک با بیشترین دنبال‌کننده
* فهرست پربازدیدترین ویدئوهای آنلاین در ۲۴ ساعت اول

 |
| Related | 
* پریسیلا چان (wife of Mark Zuckerberg)
* Chan Zuckerberg Initiative
* Aquila Internet relay drone
* Oversight Board
* Willow Village
* WaveGroup Sound
* 2021 Facebook outage

 |