【de:code 2020】 React Native で Windows アプリ開発 ~React Native for Windows~
1 like1,233 views
2016 年から C# での実装があった React Native for Windows ですが 2019 年 2 月に C++ で実装された高性能なバージョンがデフォルトの実装として公開されました。 ここでは、新しい React Native for Windows の概要について説明します。 React Native を使うと Android、iOS、Windows アプリの開発が出来るようになるので、Web 系技術を普段お使いの方にお勧めです。
【de:code 2020】 React Native で Windows アプリ開発 ~React Native for Windows~
- 1. *本資料の内容 (添付文書、リンク先などを含む) は de:code 2020 における公開日時点のものであり、予告なく変更される場合があります。 #decode20 # React Native で Windows アプリ開発 ~React Native for Windows~ A01 大田 一希 日本マイクロソフト株式会社 Windows AppConsult エンジニア
- 2. 本セッションについて 対象者 課題 ゴール • Web 系技術開発者で Windows アプリ開発に興味のある方 • Windows アプリ開発者 • 新しい Windows アプリ開発の情報収集 • React Native for Windows の概要把握
- 3. セッションアジェンダ • React Native for Windows とは • デモ • まとめ • 参考サイト
- 4. React Native for Windows とは
- 7. React Native for Windows
- 9. React での開発 const MyComponent = () => { const name = "John"; return ( <p>Hello {name}</p> ); } const MyComponent = () => { const name = "John"; return ( <p>Hello {formatName(name)}</p> ); }
- 10. JSX がレンダリングされて HTML になる const MyComponent = () => { const name = "John"; return ( <p>Hello {name}</p> ); } <p>Hello John</p>
- 11. JSX がレンダリングされて Native コントロールになる const MyComponent = () => { const name = "John"; return ( <Text>Hello {name}</Text> ); }
- 13. ネイティブの機能の利用
- 14. React Native のコンポーネントをネイティブ アプリに
- 16. プロジェクトの作成 # プロジェクト名が decode20 の場合 > npx react-native init decode20 --version ^0.61.5 > cd decode20 > npx react-native-windows-init --overwrite
- 17. https://microsoft.github.io/react-native-windows/docs/getting-started プロジェクトの実行 > npx react-native run-windows
- 18. https://microsoft.github.io/react-native-windows/docs/getting-started プロジェクトの実行 > npx react-native run-windows
- 19. TypeScript の利用 Using TypeScript React Native https://reactnative.dev/docs/typescript
- 20. デモ
- 22. まとめ
- 24. © 2018 Microsoft Corporation. All rights reserved. 本情報の内容（添付文書、リンク先などを含む）は、作成日時点でのものであり、予告なく変更される場合があります。 © 2020 Microsoft Corporation. All rights reserved. 本情報の内容 (添付文書、リンク先などを含む) は、公開日時点のものであり、予告なく変更される場合があります。 本コンテンツの著作権、および本コンテンツ中に出てくる商標権、団体名、ロゴ、製品、サービスなどはそれぞれ、各権利保有者に帰属します。