Day29 Expo で Web も表示できるってよ?

#100DaysOfCode 29日目

前回は疲れて寝ちゃったので、今日はのんびり勉強します。

Expo の新機能 web サポートを試してみた
2019.03.30投稿者 : 鎌田 遼
タロスカイ公式ブログ

こちらの記事を読んで、React Native の画面を web でも見られるのかーそうかそうかと感じている今日このごろ。

Web で見られるようになるんだったら、一回は見てみたいなと思った。そこで、この前まで作ってた AwesomeProject を web で表示してみましょう!できるかな?

app.json に web を追加します。

app.json
{
  "expo": {
    ...
    "platforms": [
      "ios",
      "android",
      "web" // 追加する
    ],
    ...
}

よく見たらもう入ってた。見てなかっただけだったんだなぁ。

$ cd AwesomeProject
$ expo start

無い!

無かった。このままでは表示はできなかった。

できなくて悲しいので “React Native Expo web” とかで検索してこれにたどり着きました。

Qiita
@Nkzn
2018年02月03日に更新
React Native Advent Calendar 201713日目
React Native for WebとExpoを組み合わせてピコピコさせてみたよ

React Native for WebとExpoを組み合わせてピコピコさせてみたよ - Qiita なかざんです。ウォーターセルという新潟の会社でアグリノートという農業向けアプリを作っています。 業務で使う構成のPoCとして、Webとモバイルネイティブの両方で動く、React Nativeのサンプルプロジェクトを作ってみたので、そ...
 qiita.com

ここにさっき AwesomeProject を動かすことができなかった回答までの道のりが示されていました。

ネイティブ向けに書いたコンポーネントはすべてWebでも動くの?
さすがにそうはいきません。というより動かないコンポーネントもかなり多いです。
基本的にはReact Native for Webの公式Storybookにあるものしか使えないと思ってください。

React Native Web

http://necolas.github.io/react-native-web/storybook/?selectedKind=Components&selectedStory=ActivityIndicator&full=0&addons=0&stories=1&panelRight=0

Expo を使って React Native の開発をすると機能の制限がありますが、さらにその中から厳選して選ばないといけないっぽいです。

だがしかし、わたしが作るシステムだったらそういうのはあんまり関係ないでしょう。

もう少しこのあたりを勉強してみることにします。

Web もアプリも同時に同じように使いたいのだったら、こういう形でもいいなーと思いました。
ただ、いろいろ場合分けが必要だと思うので、そのあたりのコードの可読性はどうなんでしょうか。

要調査。

コメントする

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください