---
title: "攻略:React NativeのJSSの使い始め"
slug: "walkthrough--getting-started-with-jss-for-react-native"
abstract: "JSS CLIを使ってJSS React Nativeでアプリケーションを作成・実行する方法。"
---
# 攻略:React NativeのJSSの使い始め

このウォークスルーでは、[JSS CLI](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/sitecore-javascript-rendering-sdk-cli-tools.html "Sitecore JavaScript Rendering SDK CLI Tools")を使って初めてReact Nativeアプリケーション用のJSSを作成・実行する方法を説明します。

React Native用のJSSアプリケーションを作成する前に、[React Nativeガイド](https://reactnative.dev/docs/environment-setup)に従って開発環境をセットアップする必要があります。

-   React NativeのJSSアプリケーションサンプルは、React Native CLIで作成されたプロジェクトに基づいており、 react-native init コマンドを使用しています。React Nativeを設定する際は、 **React Native CLIクイックスタート** タブを選択してください。
    -   新しいページビューでは、利用可能なオプションから開発用および対象用OSを選択します。
    -   React Nativeガイドの指示に従って依存関係をインストールしてください。
    -   このセットアッププロセスで作成したアプリケーションを実行できるか確認してください。
-   JSSで構築されたReact Nativeアプリの利用可能な [アプリケーションモード](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/application-modes-in-jss-react-native.html "Application modes in JSS React Native") に慣れておく。
-   [JSS CLI](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/install-the-jss-cli-globally.html "Install the JSS CLI globally")をインストールしてください。

> !注JSSで作成されたReact Native用の基本アプリは、以下の構成とツールでテストされています。
> 
> -   Windows/Androidで、USB接続された物理デバイスで開発マシンに接続しています。
>     
> -   macOS / iOS、Xcodeシミュレーターを使用しています。
>     

このウォークスルーでは、以下の方法を説明します:

-   アプリケーションを作成します。
-   アプリケーションを実行してください。

## アプリケーションを作成する

React Native用のJSSアプリケーションを作成するには:

-   次のコマンドを実行します:
    
    jss create <app-name> react-native

## アプリケーションを実行してください

JSS React Nativeアプリケーションを開始するには、使用するアプリケーションモードに応じて、ターミナルで以下のいずれかのスクリプトを実行してください。

-   Sitecoreインスタンスがない場合は、アプリケーションを [切断モードで](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/run-a-jss-for-react-native-app-in-disconnected-mode.html "Run a JSS for React Native app in disconnected mode")起動してください:
    
    > !注スクリプトの定義は、新しいJSS React Nativeアプリケーションのpackage.jsonファイルで見つけることができます。
    
    -   Androidアプリの場合:
        
        jss start-android
        
    -   iOSアプリの場合:
        
        jss start-ios
        
-   Sitecoreインスタンスを持っていて、それに対して開発したい場合は、[JSSアプリケーションをSitecoreに接続してデプロイ](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/walkthrough--connecting-a-jss-application-to-sitecore.html "Walkthrough: Connecting a JSS application to Sitecore")し、[接続モードで](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/run-a-jss-for-react-native-app-in-connected-mode.html "Run a JSS for React Native app in connected mode")アプリケーションを起動してください:
    
    -   Androidアプリの場合:
        
        jss start-android:connected
        
    -   iOSアプリの場合:
        
        jss start-ios:connected
        

React Nativeビルドプロセスでは、React Native Metro Bundlerの出力と、XcodeやAndroid SDKなどのReact Nativeプラットフォーム固有のコンパイラからの出力を含む1つまたは2つの別々のターミナルウィンドウやタブが開きます。

ビルドプロセスが完了すると、シミュレーターや物理デバイスの画面上でJSS React Nativeサンプルアプリを見ることができます。

> !注最初のビルドは数分かかることがあります。その後のビルドは通常、はるかに速くなります。これはReact Nativeの通常の動作です。