ری‌اکت نیتیو

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

ری اکت نیتیو

توسعه‌دهنده(ها)	Facebook and community
انتشار اولیه	۲۶ مارس ۲۰۱۵ (۲۰۱۵-26}})
انتشار پایدار	۰٫۵۹٫۹ / ۵ ژوئن ۲۰۱۹ (۲۰۱۹-05}})
مخزن	https://github.com/facebook/react-native
نوشته‌شده با	JavaScript, Java, C++, Objective-C, Objective-C++, Python
مجوز	MIT License
وبگاه	facebook.github.io/react-native/

ری اکت نیتیو در زمینه فرانت اند کاربرد دارد.

تاریخ

در سال ۲۰۱۲، مارک زاکربرگ اظهار داشت: «بزرگترین اشتباهی که ما به عنوان یک شرکت انجام دادیم، بیش از حد بر روی HTML در مقایسه با نیتیوها کار کردیم». او قول داد که متا به زودی یک تجربه بهتر تلفن همراه را ارائه دهد.

در داخل متا، اردن واکی راهی را برای تولید عناصر UI برای IOS از یک پس زمینه جاوا اسکریپت پیدا کرد. آنها تصمیم گرفتند یک هکاتون داخلی را برای تکمیل این نمونه اولیه بسازند تا قادر به ساخت برنامه‌های نیتیو با این تکنولوژی باشند.

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

پیاده‌سازی

اصول کار React Native تقریباً با React یکسان است، به جز اینکه ری اکت نیتیو، DOM را از طریق DOM مجازی دستکاری نمی‌کند. این برنامه در فرایند پس زمینه (که جاوا اسکریپت نوشته شده توسط توسعه دهندگان را تفسیر می‌کند) به‌طور مستقیم در دستگاه انتها (دیوایس کاربر) اجرا می‌شود و با پلتفرم نیتیو از طریق یک سریال سازی، اسینکرونس و پل پردازش دسته‌ای ارتباط برقرار می‌کند.

React Native از HTML استفاده نمی‌کند. در عوض، پیام‌هایی از جاوا اسکریپت برای اداره نمایشهای نیتیو استفاده می‌شود.

مثال Hello World

سلام دنیا

یک برنامه Hello, World که در React Native این گونه است:

// App.js
import React, {Component} from 'react';
import {Text, View} from 'react-native';

export default class App extends Component {
  render() {
    return (
      <View>
        <Text>
          Hello, World.
        </Text>
      </View>
    );
  }
}

// index.js
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

22 AppRegistry.registerComponent(appName, () => App);