YAZエンジニアが運営するメディア

★ React Studio の 導入 ★

今回、実際の開発プロジェクトで、React Studioを利用して、iOSのWebViewアプリを開発する機会がありました。 その際に、React Studioがとても便利でしたので、今後の開発プロジェクトでも利用して行く可能性が高いため、少しずつ記事にまとめていこうと思います。
※2018/04/10現在Mac以外では利用できません。

1. 1. React Studioをダウンロードします
   　以下のURLにアクセスして、アプリをダウンロードします。

https://reactstudio.com/

1. 1. ダウンロードしたファイル「ReactStudio_v14_build323.zip」を解凍します

1. 1. 解凍された「React Studio」をアプリケーションフォルダ配下に移動します

1. 1. React Studioが起動することを確認します

1. 1. [About React Studio]を選択してReact Studioの情報を確認します

1. ※本記事は、こちらに表示されているバージョン1.4(323)を対象としています。

1. 1. プロジェクトは、以下の３つのパターンから選択します
      • Mobile-First Web App

iPhoneなどの電話端末またはタブレットに最適化された、レスポンシブデザインで、Web上で簡単に共有・公開できるプロジェクトになります。

1. 1. • Custom-Size Web App

デスクトップPCやテレビなどの画面サイズが固定されたアプリに最適化したプロジェクトになります。

1. 1. • Component Pack

Reactのコンポーネント単位で画面開発し、ソースコードをエクスポートする際に利用します。

1. 1.  
   2. [Create new project]をクリックして、Mobile-First Web Appプロジェクトを作成します

次回からは、React Studioの機能について、少しずつ紹介していきたいと思います。

最新の記事

初めてのReact Studio #002 ～ Screenの作成／プロジェクトのエクスポート