コンテンツにスキップ

英文维基 | 中文维基 | 日文维基 | 草榴社区

「React Native」の版間の差分

出典: フリー百科事典『ウィキペディア(Wikipedia)』
削除された内容 追加された内容
m 最新版を更新、LSRに移動。Cite_webの修正
Cewbot (会話 | 投稿記録)
13行目: 13行目:
| 公式サイト = {{URL|https://facebook.github.io/react-native/}}
| 公式サイト = {{URL|https://facebook.github.io/react-native/}}
}}
}}
'''React Native'''(リアクト・ネイテイヴ)は、[[Facebook]]が作成した[[オープンソースソフトウェア|オープンソース]]の[[アプリケーションフレームワーク|モバイルアプリケーションフレームワーク]]である<ref>{{Cite web|url=https://facebook.github.io/react-native/|title=React Native · A framework for building native apps using React|accessdate=2019-11-06}}</ref>。開発者がネイティブプラットフォーム機能とともに[[React]]を使用できるようにすることで、[[Android]]<ref>{{Cite web|url=https://engineering.fb.com/developer-tools/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/|title=React Native for Android: How we built the first cross-platform React Native app - Facebook Engineering|accessdate=2019-11-06}}</ref>、[[IOS (アップル)|iOS]]、[[ウェブサイト|Web]]<ref>{{Cite web|url=https://github.com/necolas/react-native-web|title=React Native for Web|accessdate=2019-11-06}}</ref>および[[ユニバーサルWindowsプラットフォーム|UWP]]<ref>{{Cite web|url=https://blogs.windows.com/buildingapps/2016/04/13/react-native-on-the-universal-windows-platform/|title=React Native on the Universal Windows Platform|author=Windows Apps Team|date=April 13, 2016|website=blogs.windows.com|accessdate=2016-11-06}}</ref>アプリケーションを開発するために使用される。
'''React Native'''(リアクト・ネイテイヴ)は、[[Facebook]]が作成した[[オープンソースソフトウェア|オープンソース]]の[[アプリケーションフレームワーク|モバイルアプリケーションフレームワーク]]である<ref>{{Cite web|url=https://facebook.github.io/react-native/|title=React Native · A framework for building native apps using React|accessdate=2019-11-06}}</ref>。開発者がネイティブプラットフォーム機能とともに[[React]]を使用できるようにすることで、[[Android (オペレーティングシステム)|Android]]<ref>{{Cite web|url=https://engineering.fb.com/developer-tools/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/|title=React Native for Android: How we built the first cross-platform React Native app - Facebook Engineering|accessdate=2019-11-06}}</ref>、[[IOS (アップル)|iOS]]、[[ウェブサイト|Web]]<ref>{{Cite web|url=https://github.com/necolas/react-native-web|title=React Native for Web|accessdate=2019-11-06}}</ref>および[[ユニバーサルWindowsプラットフォーム|UWP]]<ref>{{Cite web|url=https://blogs.windows.com/buildingapps/2016/04/13/react-native-on-the-universal-windows-platform/|title=React Native on the Universal Windows Platform|author=Windows Apps Team|date=April 13, 2016|website=blogs.windows.com|accessdate=2016-11-06}}</ref>アプリケーションを開発するために使用される。


さらに、[[Qt]]の不完全なポートも存在する<ref>https://github.com/status-im/react-native-desktop</ref>。
さらに、[[Qt]]の不完全なポートも存在する<ref>https://github.com/status-im/react-native-desktop</ref>。

2020年9月6日 (日) 10:06時点における版

React > React Native
React Native
開発元 Facebookとコミュニティ
初版 2015年3月26日 (9年前) (2015-03-26)[1]
最新版

0.74.1 - 2024年5月4日 (6か月前) (2024-05-04)[2]

[3] [±]
リポジトリ https://github.com/facebook/react-native
プログラミング
言語
JavaScript, Java, C++, Objective-C, Objective-C++, Python
ライセンス MIT License
公式サイト facebook.github.io/react-native/
テンプレートを表示

React Native(リアクト・ネイテイヴ)は、Facebookが作成したオープンソースモバイルアプリケーションフレームワークである[4]。開発者がネイティブプラットフォーム機能とともにReactを使用できるようにすることで、Android[5]iOSWeb[6]およびUWP[7]アプリケーションを開発するために使用される。

さらに、Qtの不完全なポートも存在する[8]

歴史

2012年、マーク・ザッカーバーグは、「会社として犯した最大の間違いは、ネイティブではなくHTMLにあまりにも賭け過ぎていた」とコメントした[9]。彼は、Facebookがまもなく優れたモバイルエクスペリエンスを提供すると約束した。

Facebookの内部で、ジョーダン・ウォークは、バックグラウンドJavaScriptスレッドからiOSのUI要素を生成する方法を見つけた[出典無効]。彼らは、このテクノロジーを使用してネイティブアプリを構築できるように、このプロトタイプを完成させるための社内ハッカソンを組織することにした[10]

数か月の開発の後、Facebookは2015年にReact JavaScript Configurationの最初のバージョンをリリースした。テクニカルトークで[11]。Christopher Chedeauは、Facebookがグループアプリと広告管理アプリの本番で既にReact Nativeを使用していると説明した[12]

実装

React Nativeの動作原理は、React Nativeが仮想DOMを介してDOMを操作しないことを除いて、Reactとほぼ同じである。バックエンドプロセス(開発者によって記述されたJavaScriptを解釈する)においてエンドデバイス上で直接実行され、シリアライゼーション、非同期、およびバッチブリッジを介してネイティブプラットフォームと通信する[13][14][15]

Reactコンポーネントは、既存のネイティブコードをラップし、Reactの宣言的なUIパラダイムとJavaScriptを介してネイティブAPIと対話する。これにより、まったく新しい開発者チームによるネイティブアプリ開発が可能になり、既存のネイティブチームの作業がはるかに高速になる[要出典]

React NativeはHTMLを使用しない。代わりに、JavaScriptスレッドからのメッセージがネイティブビューの操作に使用される。

Hello Worldの例

React NativeのHello、Worldプログラムは次のようになる。

import React, { Component } from 'react';
import { AppRegistry, Text } from 'react-native';

export default class HelloWorldApp extends Component {
  render() {
    return (
      <Text>Hello world!</Text>
    );
  }
}

// Skip this line if using Create React Native App
AppRegistry.registerComponent('HelloWorld', () => HelloWorldApp);

// The ReactJS code can also be imported into another component with the following code:

import HelloWorldApp from './HelloWorldApp';

出典

  1. ^ React Native: Bringing modern web techniques to mobile”. 2019年11月6日閲覧。
  2. ^ Release v0.74.1 · facebook/react-native · GitHub” (2024年5月4日). 2024年5月7日閲覧。
  3. ^ Releases – Facebook/React”. GitHub. 2024年5月7日閲覧。
  4. ^ React Native · A framework for building native apps using React”. 2019年11月6日閲覧。
  5. ^ React Native for Android: How we built the first cross-platform React Native app - Facebook Engineering”. 2019年11月6日閲覧。
  6. ^ React Native for Web”. 2019年11月6日閲覧。
  7. ^ Windows Apps Team (April 13, 2016). “React Native on the Universal Windows Platform”. blogs.windows.com. 2016年11月6日閲覧。
  8. ^ https://github.com/status-im/react-native-desktop
  9. ^ Zuckerberg's Biggest Mistake? 'Betting on HTML5'”. Mashable. 7 April 2018閲覧。
  10. ^ A short Story about React Native”. 16 January 2018閲覧。
  11. ^ Christopher. “A Deep Dive into React Native”. YouTube. 16 January 2018閲覧。
  12. ^ React Native: Bringing modern web techniques to mobile - Facebook Engineering”. 2019年11月6日閲覧。
  13. ^ Bridging in React Native” (14 October 2015). 16 January 2018閲覧。
  14. ^ React Native vs Flutter: Which Cross-Platform Framework is Better?”. 2019年11月6日閲覧。
  15. ^ How we build React Native app: 7 things which save your development time. Part 2”. 2019年11月6日閲覧。