React Native

React Native هو إطار عمل برمجي مفتوح المصدر لواجهة المستخدم، طوّرته شركة Meta Platforms (المعروفة سابقًا باسم Facebook Inc.). ^{[ 3 ]} يُستخدم لتطوير تطبيقات لأنظمة Android ، ^{[ 4 ] : ​​§الفصل 1 [ 5 ] [ 6 ]} وAndroid TV ، ^{[ 7 ]} وiOS ، ^{[ 4 ] : ​​§الفصل 1 [ 6 ]} وmacOS ، ^{[ 8 ]} وtvOS ، ^{[ 9 ]} وVega OS ، ^{[ 10 ] [ 11 ]} والويب ، ^{[ 12 ]} و Windows، ^{[ 8 ]} و UWP، ^{[ 13 ]} وذلك بتمكين المطورين من استخدام إطار عمل React جنبًا إلى جنب مع إمكانيات النظام الأساسي الأصلية. ^{[ 14 ]} يُستخدم لتطوير تطبيقات Android وiOS في شركات Facebook و Microsoft و Shopify . ^{[ 15 ]} كما يُستخدم أيضًا لتطوير تطبيقات الواقع الافتراضي في شركة Oculus . ^{[ 16 ]}

في عام ٢٠١٢، علّق مارك زوكربيرج قائلاً: "كان أكبر خطأ ارتكبناه كشركة هو المبالغة في الاعتماد على HTML5 بدلاً من التقنيات الأصلية". ^{[ ١٧ ] [ ١٨ ]} وقد أدى استخدام HTML5 في نسخة فيسبوك للهواتف المحمولة إلى تطبيق غير مستقر وبطيء في استرجاع البيانات. ^{[ ١٩ ]} ووعد زوكربيرج بأن فيسبوك سيقدم قريباً تجربة استخدام أفضل للهواتف المحمولة.

داخل شركة فيسبوك، طوّر جوردان والكي برنامجًا يُنشئ عناصر واجهة المستخدم لنظام iOS من خلال خيط جافا سكريبت يعمل في الخلفية ، والذي أصبح فيما بعد أساسًا لإطار عمل React لتطوير تطبيقات الويب . وقرروا تنظيم هاكاثون داخلي لتحسين هذا النموذج الأولي بهدف بناء تطبيقات أصلية باستخدام هذه التقنية. ^{[ 20 ]}

في عام ٢٠١٥، وبعد أشهر من التطوير، أصدرت فيسبوك النسخة الأولى من إعدادات جافا سكريبت لـ React . وخلال محاضرة تقنية، ^{[ ٢١ ]} أوضح كريستوفر شيدو أن فيسبوك كانت تستخدم بالفعل React Native في تطبيقاتها الإنتاجية، وتحديدًا تطبيق المجموعات وتطبيق إدارة الإعلانات. ^{[ ٢٢ ]}

في أكتوبر 2025، أعلنت شركة ميتا أنها ستتبرع بـ React و React Native و JSX ( JavaScript XML ) إلى مؤسسة React الجديدة، وهي جزء من مؤسسة Linux . ^{[ 23 ]}

تتشابه مبادئ عمل React Native إلى حد كبير مع React، باستثناء أن React Native لا تتعامل مع DOM عبر Virtual DOM . ^{[ 4 ] : ​​§الفصل 2.} تعمل React Native في عملية خلفية (تفسر كود JavaScript الذي يكتبه المطورون) مباشرةً على الجهاز النهائي، وتتواصل مع المنصة الأصلية [ ^{4 ] : ​​§الفصل 2} عبر بيانات مُسلسلة من خلال جسر غير متزامن ومُجمّع . ^{[ 24 ]}

تُغلّف مكونات React الشيفرة الأصلية الموجودة وتتفاعل مع واجهات برمجة التطبيقات الأصلية عبر نموذج واجهة المستخدم التصريحي لـ React ولغة JavaScript . ^{[ 25 ]} غالبًا ما تُستخدم TypeScript بدلًا من JavaScript في تطبيقات React Native الحديثة نظرًا لزيادة أمان أنواع البيانات فيها . ^{[ 26 ]}

على الرغم من أن تنسيق React Native يشبه CSS في بنيته ، إلا أنه لا يستخدم HTML أو CSS . ^{[ 4 ] : ​​§الفصل 5 [ 27 ]} بدلاً من ذلك، تُستخدم الرسائل من سلسلة JavaScript لمعالجة العروض الأصلية. وباستخدام الإضافات، يمكن أيضًا استخدام Tailwind مع React Native.

يتوفر React Native أيضًا لأنظمة التشغيل Windows و macOS ، والذي تتولى شركة Microsoft صيانته حاليًا .

يبدو برنامج "Hello, World!" في React Native كالتالي:

import { AppRegistry , Text , View , Button } from 'react-native' ;استيراد React من 'react' ;const HelloWorldApp = () => {const [ count , setCount ] = React . useState ( 0 );const incrementCount = () => {setCount (( prevCount ) => prevCount + 1 );};يعود (< عرض >< نص > مرحباً بالعالم !< /نص>< نص > { عدد } < / نص>< Button onPress = { incrementCount } title = "زيادة العدد" /></View>​);};export default HelloWorldApp ;AppRegistry.registerComponent ( 'HelloWorld' , ( ) = > HelloWorldApp );

في لغة TypeScript، يبدو مكون العداد كالتالي:

import { Button , Text , View } from "react-native" ;import React from "react" ;واجهة خصائص العداد {العنوان : سلسلة نصية ؛ // خاصية مطلوبةbaseNumber? : number ; // خاصية اختيارية}const Counter : React.FC < CounterProps > = ({ title , baseNumber }) => {const [ count , setCount ] = React . useState < number > ( baseNumber || 0 );const incrementCount = () : void => setCount (( prevCount ) => prevCount + 1 );يعود (< عرض >< نص > { عدد } < / نص>< Button onPress = { incrementCount } title = { title } > </Button></View>​);};

• React (مكتبة جافا سكريبت)
• نيتف سكريبت
• زامارين
• مجموعة تطوير البرمجيات تيتانيوم
• أباتشي كوردوفا
• فلاتر (برنامج)
• كيو تي (برنامج)
• الاسم الرمزي واحد
• تأليف موسيقى Jetpack

• أيزنمان، بوني (2016). تعلم React Native . أورايلي . ISBN 978-1-491-92900-1.