React Native で遊んでみよう

こんにちは、みみです。

去年からこそこそ React Native を触って、趣味のアプリを作ろうとしているのですがなかなか進まず。久しぶりに時間が空いたので触ろうとしたら、どっから始めるのかさえ忘れていたので忘備録的に書いておこうと思います。

まずはココから

Node.jsがすでにインストールされていれば、ターミナルで

npm install -g create-react-native-app

とすればダーッとインストールされていきます。

create-react-native-app LikeYourProjectName

で、新しいプロジェクトが生成されます。ちょっと待ちましょう。

cd LikeYourProjectName

として、該当ディレクトリに移動後、

npm start

すると、もりもり動き出します。
かんたーん。

 › Press a to open Android device or emulator, or i to open iOS emulator.
 › Press s to send the app URL to your phone number or email address
（以下略）

とか言ってくるので、aかiかsとか、お好みのキーを押して、シュミレーターを起動したり、実機確認ができます。（シュミレーター使うのには別途インストールが要るはず。）

実機確認には、Expo というアプリを使って出来るようになっています。これ便利だー。

これで、おもに App.js をあーだこーだすれば、アナタだけのアプリが作れます。

試しに、今日の日付を取得してみましょう。

//日付の取得
const today = new Date();
const year = today.getFullYear();
const month = today.getMonth()+1;
const date = today.getDate();

とか上のほうに書き足して、

4行目あたりから始まるレンダリングのところの中のViewタグ内を

<Text>
    {year}年{month}月{date}日
</Text>

と書き換えて、保存すると。

という感じに日付が表示されます。やったね！