並び順

ブックマーク数

期間指定

  • から
  • まで

41 - 80 件 / 127件

新着順 人気順

reactnativeの検索結果41 - 80 件 / 127件

  • Announcing Coinbase’s successful transition to React Native | by Coinbase | The Coinbase Blog

    As of January 2021, the Coinbase iOS and Android apps have transitioned away from native development to React Native, and all mobile engineers are now collaborating in a single codebase. The transition from native to React Native did not happen overnight, and in the interest of helping those contemplating such a decision, we want to tell the story of how we got here. Specifically, we want to share

      Announcing Coinbase’s successful transition to React Native | by Coinbase | The Coinbase Blog
    • モバイルアプリのテストとReact Nativeにおけるテストライブラリの選択肢 - KitchHike Tech Blog

      モバイルアプリにテストを導入する前に キッチハイク エンジニアの薬師寺です。 キッチハイクではReact Nativeアプリにテストを導入するにあたり、 テストライブラリの選定と、テストでは何を意識すればいいのかということを考えてきました。 今回の記事では、モバイルアプリのテストで考慮すべき点と、テストライブラリを比較して得た情報を紹介します。 モバイルアプリにテストを導入する前に ソフトウェアのテストピラミッド モバイルアプリのテストピラミッドを築くのは難しい シミュレータと実機での環境差分 アニメーション・インタラクションなどのUI部分の差分 ネイティブ層の一部のテストが困難な箇所 テスト導入のため、テストフレームワークの比較 テストランナーとE2Eテストフレームワークの関係図 比較表 テストランナーを選ぶ jest mocha AVA E2Eテストのライブラリを選ぶ Appium D

        モバイルアプリのテストとReact Nativeにおけるテストライブラリの選択肢 - KitchHike Tech Blog
      • RN Features 2020年3月号 - React Native v0.62 注目機能Flipper, Re-architecture, Discord のパフォーマンス改善 - KitchHike Tech Blog

        はじめに キッチハイクのエンジニアメンバーでReact Native の気になるニュースを持ち寄ってみました! はじめに ガワネイティブアプリ(Creator)を、React Nativeで置き換えてみての一年間戦いの記録 - BASE開発チームブログ Flutter vs Native vs React-Native: Examining performance Discord のパフォーマンス改善 Flipper で React Native アプリの DX を改善しよう Flipper の主な機能の紹介 React Nativeの Re-architectureについて ロードマップ さいごに We're Hiring ガワネイティブアプリ(Creator)を、React Nativeで置き換えてみての一年間戦いの記録 - BASE開発チームブログ https://devblog.t

          RN Features 2020年3月号 - React Native v0.62 注目機能Flipper, Re-architecture, Discord のパフォーマンス改善 - KitchHike Tech Blog
        • React NativeとExpoを活用したネイティブビルド不要のE2Eテストの導入 - Hello Tech

          はじめに はじめまして、株式会社ハローで業務委託として開発をしている@0906kokiです。 今回の記事では、React Nativeで開発されているAutoReserve for Restaurantsで、Expoを最大限に活かしたE2Eテストの導入実装について書きたいと思います。 背景 飲食店向けにセルフオーダーや予約台帳の機能を提供するAutoReserve for Restaurantsは、React Nativeで開発されております。 今回、AutoReserve for RestaurantsにE2Eを導入した目的に関しては、以下のような点が挙げられます。 手動テストの場合、テストをスキップ or 見逃していたケースがあったので、毎回網羅的にテストできるようにし、QAの質を上げたい 頻繁に本番デプロイできるようにする コミットごとにテストできるようにすることで、QAを待たず事前

            React NativeとExpoを活用したネイティブビルド不要のE2Eテストの導入 - Hello Tech
          • React Native 2019年の振り返りと今後について - Qiita

            この記事は React Native アドベントカレンダーの 3 日目の記事です。 どうも、Naturalclar(@natural_clar) です。 普段の業務では、Expo ではなく react-native init で作成された、いわゆる素の React Native で開発しています。 先日のハムカツさんの記事が今年の Expo に対する振り返りをやっていたので。 自分の方は素の React Native についての2019年の振り返りと、React Native の未来について語ろうと思います。 2019/01 1/25 React Native v0.58 リリース v0.58 が今年最初のReact Native のリリースとなりました。 この辺から React Native でも TypeScript のサポートが増えてきた感触です。 今年は日本で TypeScript

              React Native 2019年の振り返りと今後について - Qiita
            • Why we decided to rewrite our iOS & Android apps from scratch — in React Native

              Our project name for the RN app rewrite, DenaliBackgroundHi, I am Naoya, a Senior Engineering Manager at Mercari. Along with my small but mighty team of frontend developers, I am responsible for delivering the Mercari app experience to our customers. Today, I’m here to explain why we’ve made the ambitious decision to completely rewrite our apps using React Native. Growth drives changeCurrently, we

                Why we decided to rewrite our iOS & Android apps from scratch — in React Native
              • GitHub - Shopify/react-native-skia: High-performance React Native Graphics using Skia

                You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                  GitHub - Shopify/react-native-skia: High-performance React Native Graphics using Skia
                • リクルートがB2Bのスマホアプリ開発でReact Nativeを採用した理由

                  リクルートがB2Bのスマホアプリ開発でReact Nativeを採用した理由:Webフロントエンドエンジニアだけでスマホアプリ開発(1) リクルートテクノロジーズが開発している、B2Bのスマホアプリ『Airシフト メッセージ用アプリ』。Webフロントエンドエンジニアだけで行っている開発の裏側を明かす連載。初回は、React Nativeを採用した背景などについて。 こんにちは、リクルートテクノロジーズで『Airシフト』のフロントエンドの開発を担当している辻です。これから、連載で、『Airシフト メッセージ用アプリ』を開発した背景、さまざまな側面で工夫した点などを紹介していく予定です。楽しみにしていただけると幸いです。 『Airシフト』とは 『Airシフト』は、シフト管理サービスです。シフト表の作成はもちろん、スタッフとのやりとりや細かな調整業務をラクにするための機能があります。直感的に操作

                    リクルートがB2Bのスマホアプリ開発でReact Nativeを採用した理由
                  • Create React Appで作成したReactアプリにReact Native for Webを導入する | DevelopersIO

                    Create React Appは、コマンド1つでReactアプリケーションの雛形を作成することができる、Facebook製の環境構築ツールです。新しくアプリを作成する際に使用されている方も多いのではないかと思います。 React Native for Webは、iOS/Androidアプリ作成向けのライブラリであるReact Nativeと同じ名称のコンポーネントを使ってWebアプリケーションの画面を作成することができるライブラリです。使用していてReactに比べてより効率的に画面の作成ができると感じています。 当記事ではCreate React Appを使用して作成したReactアプリにReact Native for Webを導入する方法についてご紹介します。 Create React Appを使ってアプリを作成する 以下のコマンドを実行します。今回はTypeScriptを導入したい

                      Create React Appで作成したReactアプリにReact Native for Webを導入する | DevelopersIO
                    • Announcing React Native 0.66 · React Native

                      Today we’re releasing React Native v0.66 for Android 12 and iOS 15 support alongside fixes and general updates. Highlights​ Handle taps on views outside parent bounds on Android New Bluetooth Permissions on Android Better Support for Apple Silicon, Xcode 13, and iOS 15 Hermes 0.9.0 Nightly and “Commitly” Releases Handle taps on child views outside parent boundaries on Android​ Thanks to @hsource f

                        Announcing React Native 0.66 · React Native
                      • Announcing React Native 0.64 with Hermes on iOS · React Native

                        2024React Native 0.74 - Yoga 3.0, Bridgeless New Architecture, and more2023React Native 0.73 - Debugging Improvements, Stable Symlink Support, and moreReact Native 0.72 - Symlink Support, Better Errors, and morePackage Exports Support in React NativeReact Native 0.71-RC0 Android outage postmortemReact Native 0.71: TypeScript by Default, Flexbox Gap, and more...First-class Support for TypeScript202

                          Announcing React Native 0.64 with Hermes on iOS · React Native
                        • 【徹底比較】Flutter VS React Native

                          はじめに 今回の記事では、モバイルアプリ開発として有名なフレームワークである「Flutter」と「React Native」両方の特徴、決定的な違いを徹底解説する。 2022年11月現在では、モバイルアプリ開発としてFlutterが屈指の人気を誇っている。ところが、実はモバイルアプリを開発できるフレームワークはFlutter一択ではない。Flutter以外にモバイルアプリを開発できるフレームワークとしては、Meta(旧Facebook社)が開発したReact Nativeが挙げられる。 両者はどう違うのか。なぜ開発で使われているのか―そこで、今回の記事では特徴や課題点を徹底解説する。 本記事の対象読者 モバイルアプリ開発で生計を立てているプログラマー Flutter、React Native両者の特徴を知りたい人 モバイルアプリ開発案件を検討中で技術選定をされている人 本記事のタイトルが気

                            【徹底比較】Flutter VS React Native
                          • 実践 React Native 設計チェックシート - Qiita

                            === 2020/12/01 追記 === 続きを 実践 React Native 運用チェックシート に書きました。 === 追記終わり === この記事はReact Native Advent Calendar 2019の1日目の記事です。 キッチハイクのアプリはReact Nativeで開発を始め、3年ほど経ちました。初期リリース時には自動テストもなく、Firebaseライブラリも限定的に使うだけでした。プロダクションにリリースし、ノウハウが溜まってきて、いまReact Nativeで開発するならここを抑えておくぞ、というポイントをまとめたいと思います。 この記事では、これからReact Native でアプリ開発を始める方をメインの対象としていますが、すでに開発中の方にもメリットがあればと思います。キッチハイクアプリも最初から全てを入れていた訳ではなく、まだまだ導入したいライブラリ

                              実践 React Native 設計チェックシート - Qiita
                            • Expo の仕組みと使い方をメモしていく記事

                              これは iOS アプリを開発しながら Expo について調べたことを自分用にまとめておく記事です。 Expo とは Expo はクロスプラットフォーム(iOS/Android/Web)で React Native アプリを開発するための便利機能を集めたプラットフォーム。 素の React Native プロジェクトと比較して若干の制約があるが、 Expo SDK が提供する様々な機能を使えたり開発環境の整備が簡単というメリットがある。Expo は Expo SDK, Expo CLI, Expo Go, EAS と呼ばれる4種類のツールで構成されている。 Expo SDK Expo でアプリを作るために必要なあれこれを集めたパッケージ。 開発に使われているリポジトリは主に以下のディレクトリで構成されている。 packages: Expo の API を提供するためのソースコード(ネイティブ

                                Expo の仕組みと使い方をメモしていく記事
                              • 電子書籍+PODで「基礎から学ぶReact Native入門」が出ます(追記:出ました&電子版トラブルの顛末) - ナカザンドットネット

                                3/13追記: 2/25に発売しました🎉 残念ながら無事に、とはいかず、電子書籍版にレイアウト崩れが見つかったために一時Kindle版を取り下げていました。 この問題は3/3に復旧しています。Kindle版、プリントオンデマンド(ペーパーバック)版をそれぞれお楽しみください。 【修正完了】大変長らくお待たせいたしました。先日、Kindle版『基礎から学ぶReact Native入門』に不具合が見つかり、データの修正作業を行っておりましたが、修正が完了したため、Kindle版の販売を開始しております。改めまして、この度は皆さまにご迷惑をおかけし大変申し訳ございませんでした。 pic.twitter.com/C9cXSRl4WD— CodeZine (@codezine) 2021年3月3日 本が出ます 2021年2月25日に、翔泳社さんから電子書籍+プリントオンデマンドで本を出すことになり

                                  電子書籍+PODで「基礎から学ぶReact Native入門」が出ます(追記:出ました&電子版トラブルの顛末) - ナカザンドットネット
                                • React Nativeの Re-architecture について。 - Qiita

                                  この記事は Meguro.es #25 で登壇した内容です。 はじめに 最近 React Native Community の Github org の一員となりました。去年の Advent Calendar で目標を立てていたのですが、新年入って1週間足らずで達成できました。Community の一員になれた経緯はまた別の記事で書こうと思います。Community の一員として Contributors の Discord channel に招待されて、色々な知見が手に入るので、今回はその一部をシェアします。 The New React Native 2020年は React Native が大きく変わる年になります。現在、React Native は内部設計を徐々に変更しています。この内部設計の変化については、React Native Re-architecture として2018年か

                                    React Nativeの Re-architecture について。 - Qiita
                                  • react-native-rearchitecture-2021

                                    Enter description here

                                      react-native-rearchitecture-2021
                                    • 【入門】はじめての React Native - Qiita

                                      この記事は、アプリケーションフレームワーク「React Native」の入門チュートリアルです。 開発環境の構築方法、および Hello World アプリケーションを iOS/Android エミュレータで起動する方法を解説します。 React Native とは React Native は Facebook 社が開発しているオープンソースのアプリケーションフレームワークです。 クロスプラットフォームに対応しており、ワンソースで複数のプラットフォーム(iOS、Android、UWP、Web)に対応したアプリケーションを開発することができます。 Web フロントエンドのフレームワークである React をベースに開発されており、Javascript、JSX、CSS を使って開発します。 動作環境 Mac OS X 10.14.6 React Native 0.6.1 Xcode 11.2

                                        【入門】はじめての React Native - Qiita
                                      • GitHub - tamagui/tamagui: Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.

                                        @tamagui/core - Universal style library for React. @tamagui/static - Optimizing compiler that works with core and tamagui. tamagui - UI kit that adapts to every platform. See tamagui.dev for documentation. Tamagui lets you share more code between web and native apps without sacrificing the two things that typically suffer when you do: performance and code quality. It does this with an optimizing c

                                          GitHub - tamagui/tamagui: Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.
                                        • FlashList - super fast list for react native

                                          Fast & Performant React Native List No more blank cells Swap from FlatList in seconds. Get instant performance. Similar props. Instant performance. Even with the similar props as the React Native FlatList, FlashList recycles components under the hood to maximize performance. <FlashList renderItem={({ item }) => { return <TweetCell item={item} />; }} estimatedItemSize={50} data={tweets} />;

                                            FlashList - super fast list for react native
                                          • 実践 React Native 運用チェックシート - Qiita

                                            アプリをストアに公開後、半年に1回のペースでアップグレードを行ってきました。短いものだと1週間、長くて約2ヶ月かかってます。 0.46.2 -> 0.50.4 の思い出 初めてのアップグレードだったのでとにかく大変だった印象です。11月から着手して、クリスマスがすぎ、大晦日がすぎ、正月がすぎてもなかなかエラーが解消せず、先が見えない不安がありました。今でも覚えているのが、AIRMap(いまはreact-native-maps)とfbsdkです。AIRMapはAirbnbが開発していたライブラリでその名の通り地図表示なのですが、ネイティブ層のビルドエラーで苦しんだ記憶があります。かなりObjective-Cのソースコードを読みました。のちのAirbnbのReact Nativeやめる宣言により、ライブラリ開発がどうなるか心配だったのですが無事にReact Native Communityに移

                                              実践 React Native 運用チェックシート - Qiita
                                            • #jsconfjp 2019 で Migration from React Native to PWA という発表をした - valid,invalid

                                              JSConf2019 記念すべき第一回の*1のJSConf Japanで『Migration from React Native to PWA』というタイトルの発表をしてきた。 登壇に関して 資料 発表では触れなかった余談は泣く泣く削ったトピックなので参照されると嬉しい。 今回は発表資料を作ったり練習する中で気をつけたことがあり、それは「負債や失敗といった否定的で強い言葉を使わない」ということだった。資料中でも発表でもReact Native単体での技術の良し悪しは述べていないし、2年前のReact Nativeを選んだという技術選定自体にも肯定的な態度をとっている。 当時の技術選定に携わりReact Nativeアプリの土台を作ってくれた開発者がいなければ今のビジネスも存在しない。彼/彼女らへの感謝の念は尽きないということ、運用中途での状況の変化によってチームに合わなくなったのでmigr

                                                #jsconfjp 2019 で Migration from React Native to PWA という発表をした - valid,invalid
                                              • RN Features 2021年2月号 - React Native iOSでの画像キャッシュの仕組み, JCenterのクローズ問題, Redux / Context API / Recoilのパフォーマンス比較 - KitchHike Tech Blog

                                                はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました! はじめに React Native Japanコミュニティ React Nativeでの画像キャッシュの仕組み(iOS) React Native 0.64 と 0.63.5 JCenter のクローズによる影響 Redux・Context API・Recoil のパフォーマンス比較 Wix社のDetox運用ノウハウ リアルタイムエンゲージメントのプラットフォーム "Agora.io" Quoraの質問: 「ReactではなくFlutterを選択する理由は何ですか?」 中国生まれのReact用UIフレームワーク "Ant Design" アニメーションライブラリGSAPがすごいらしい さいごに We're Hiring React Native Japanコミュニティ 今回のブログ

                                                  RN Features 2021年2月号 - React Native iOSでの画像キャッシュの仕組み, JCenterのクローズ問題, Redux / Context API / Recoilのパフォーマンス比較 - KitchHike Tech Blog
                                                • Future of React Native

                                                  この記事は Meguro.es #25 で登壇した内容です。 はじめに最近 React Native Community の Github org の一員となりました。去年の Advent Calendar で目標を立てていたのですが、新年入って1週間足らずで達成できました。Community の一員になれた経緯はまた別の記事で書こうと思います。Community の一員として Contributors の Discord channel に招待されて、色々な知見が手に入るので、今回はその一部をシェアします。 The New React Native2020年は React Native が大きく変わる年になります。現在、React Native は内部設計を徐々に変更しています。この内部設計の変化については、React Native Re-architecture として2018年からい

                                                    Future of React Native
                                                  • ReactNative とFlutter パフォーマンス比較 - GMOインターネットグループ グループ研究開発本部

                                                    こんにちは。次世代システム研究室のT.M です。 はじめに Android / iOS 両スマホアプリを開発するためには、一般的にはそれぞれKotlin (Java)/ Swift(Objective-C)で実装をする必要があります。しかし、クロスプラットフォームのアプリケーションフレームワークが誕生し、一つの実装で、両スマホアプリを開発することができるようになりました。現在、クロスプラットフォームのフレームワークでよく利用されているものとして、React Native とFlutter があります。どちらが良いフレームワークであるか、は分からず、そのため、どちらを利用すべきか迷うかと思います。そこで、本稿では、React Native とFlutter のパフォーマンスについて比較して、どちらが優れているかを検証したいと思います。 React Native React Native は2

                                                      ReactNative とFlutter パフォーマンス比較 - GMOインターネットグループ グループ研究開発本部
                                                    • Flutterで始めるモバイルアプリ開発一覧

                                                      CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

                                                        Flutterで始めるモバイルアプリ開発一覧
                                                      • コンポジション vs 継承 – React

                                                        この記事は古くなっており、今後更新されません。新しい React 日本語ドキュメントである ja.react.dev をご利用ください。 React は強力なコンポジションモデルを備えており、コンポーネント間のコードの再利用には継承よりもコンポジションをお勧めしています。 この章では、React を始めて間もない開発者が継承に手を出した時に陥りがちないくつかの問題と、コンポジションによりその問題がどのように解決できるのかについて考えてみます。 子要素の出力 (Containment) コンポーネントの中には事前には子要素を知らないものもあります。これは Sidebar や Dialog のような汎用的な “入れ物” をあらわすコンポーネントではよく使われています。 このようなコンポーネントでは特別な children という props を使い、以下のようにして受け取った子要素を出力するこ

                                                          コンポジション vs 継承 – React
                                                        • M1 (Apple Silicon) Macで既存のReact Nativeプロジェクトの開発環境が整うまで

                                                          M1 Macで既存のReact Nativeプロジェクトを開発する環境が整うまでにしたことをまとめました。 Xcodeをインストール Mac App StoreからXcode 12.2をインストールします。 Homebrewをインストール 公式サイトにあるインストールスクリプトを実行すると、以下のようにRosetta 2を使用するか、他のインストールオプションを勧められます。 Homebrew is not (yet) supported on ARM processors! Rerun the Homebrew installer under Rosetta 2. If you really know what you are doing and are prepared for a very broken experience you can use another installat

                                                            M1 (Apple Silicon) Macで既存のReact Nativeプロジェクトの開発環境が整うまで
                                                          • Amplify を用いてウェブとネイティブのマルチプラットフォーム対応する - サーバーワークスエンジニアブログ

                                                            こんにちは、技術1課の加藤です。 最近 Amplify にハマって色々と触ってみているのですが、 Amplify って複数のクライアントプラットフォームに対応しているんですよね。 マルチプラットフォームに対応しているからにはやっぱり複数のプラットフォームでバックエンドを共有したいもの。 というわけで今回は React を使ってウェブアプリとネイティブアプリを作成し、同じ認証情報を使ってログインしてみます。 1. React ウェブアプリ まずはウェブアプリ + 認証機構の実装を行います。 1-1. React アプリの作成 $ npx create-react-app react-amplify $ cd react-amplify 一応、ちゃんと動くか確認します。 $ yarn start or $ npm start 以下の画面が開けばOKです。 確認が終わったら Ctrl + C で

                                                              Amplify を用いてウェブとネイティブのマルチプラットフォーム対応する - サーバーワークスエンジニアブログ
                                                            • React Nativeへ地図を表示する方法

                                                              概要React Nativeで地図を表示して、現在の位置情報を表示する方法について調べてみようかと思っています。React Nativeで地図をコントロールするためにはReact Nativeコミュニティーのreact-native-mapsライブラリを良く使っています。 今回のブログではreact-native-mapsを使ってReact Nativeで地図を表示して、現在の位置情報を地図の上に表示する方法について調べてみます。 このブログで紹介するソースコードはgithubで確認することができます。。 github: react-native-map-example例題ソースコードは下記の内容が適用されています。もっと詳しく知りたい方は下記のリンクを参考してください。 typescriptstyled-componentsroot-importReact Nativeで現在位置情報を取

                                                                React Nativeへ地図を表示する方法
                                                              • expoによるReact Nativeのおさらい(最低限) - Qiita

                                                                しばらく使ってないと0ベースで忘れてしますので、触りだけメモ。 環境はMac想定です。すみません。 前提知識 React NativeはReactを使ってクロスプラットフォーム(iOS, Android)開発を行うためのしくみ 開発ツールとしてはexpoか、react-native-cliのいずれかを利用するのが一般的 expoは簡単だが限られた範囲での開発となる。react-native-cliは制限は無くどんなニーズにも対応 ただ多くの場合expoの範囲で事足りることが多いのでここではexpoを利用する なお、ejectすることでexpoの制限を超えることができる(もちろん失うものもあるが) 環境構築 node.jsをインストールしておく(必須) watchmanをインストールしておく yarnをインストールしておく XcodeとAndroid Studioもインストールしておいたほう

                                                                  expoによるReact Nativeのおさらい(最低限) - Qiita
                                                                • 国内のReact Nativeで作られてるアプリをピックアップ - Qiita

                                                                  (本記事はReact Native Advent Calendar 2020の7日目の記事です) 国内のReact Nativeで作られてるアプリをピックアップしました。 個人的に見聞きした+会社ウェブサイトなどで調査したもので、網羅されている訳ではないのでご了承下さい。 随時更新していきたいので、「これもReact Native製だよ!」とか、情報の誤りがあればコメントいただけると嬉しいです! ※ 以下50音順 アングラーズ 釣果の記録アプリ。 ホーム画面はタイムライン形式になっており、好きな釣りスポットや釣り人(ユーザー)をフォローしておくと釣果情報が随時流れてきます。 アプリ版とWeb版がありますが、釣果の投稿はアプリから行います。 釣果投稿時は魚の写真だけでなく、サイズ、ルアー、タックルなど釣り人が気になりそうな情報を付加できます。 タイムライン、画像投稿などSNSの基本的な機能が

                                                                    国内のReact Nativeで作られてるアプリをピックアップ - Qiita
                                                                  • ReactとWinUI 3を使ってWindowsネイティブアプリを開発する

                                                                    Spring BootによるAPIバックエンド構築実践ガイド 第2版 何千人もの開発者が、InfoQのミニブック「Practical Guide to Building an API Back End with Spring Boot」から、Spring Bootを使ったREST API構築の基礎を学んだ。この本では、出版時に新しくリリースされたバージョンである Spring Boot 2 を使用している。しかし、Spring Boot3が最近リリースされ、重要な変...

                                                                      ReactとWinUI 3を使ってWindowsネイティブアプリを開発する
                                                                    • GitHub - Shopify/restyle: A type-enforced system for building UI components in React Native with TypeScript.

                                                                      A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

                                                                        GitHub - Shopify/restyle: A type-enforced system for building UI components in React Native with TypeScript.
                                                                      • React Native for Web で Touchable 系コンポーネントを ScrollView の中で使うと暴発するのを抑える | DevelopersIO

                                                                        課題 ボタンを並べる際は次のように FlatList や SectionList を用いて書くのが RNfW での常套手段です。 import React from 'react' import { FlatList, StyleSheet, Text, TouchableOpacity } from 'react-native' const styles = StyleSheet.create({ container: { height: 120, justifyContent: 'center', alignItems: 'center', borderWidth: 2, borderColor: 'gray', borderRadius: 8, }, }) interface ButtonProps { label: string } function Button(props: B

                                                                          React Native for Web で Touchable 系コンポーネントを ScrollView の中で使うと暴発するのを抑える | DevelopersIO
                                                                        • 「サンプルコードで作りながら学ぶReact Native実践入門」の著者が語る!React Nativeの魅力とこれだけは知っておきたいポイント! - FLEXY(フレキシー)

                                                                          本記事は2020年4月にインタビューを実施し、公開された内容です。 スナップマート株式会社の取締役CTO星直史です。 今年、2020年にReact Nativeの著書、『サンプルコードで作りながら学ぶReact Native実践入門』を出版しました。 本記事では、React Nativeを触ってみたいというWebエンジニアの方向けに、React Nativeの概要や知っておきたいポイントを説明します。ぜひ参考にしてみてください。 1. React Nativeとは React NativeはFacebookが開発したJavaScriptのフレームワークです。名前の通り、Reactを利用して開発を行います。 React Nativeの最大の特徴はクロスプラットフォーム開発ができるということです。一つのソースコードから複数のアプリケーションを生成できます。iOSとAndroidが提供するネイテ

                                                                            「サンプルコードで作りながら学ぶReact Native実践入門」の著者が語る!React Nativeの魅力とこれだけは知っておきたいポイント! - FLEXY(フレキシー)
                                                                          • React Native ハンズオン〜第一回目 基本文法編

                                                                            はじめに 環境構築終わっていますでしょうか!!? まだの方はこちらをみて環境構築を完了させていただけますと幸いです!! ちなみにですが、後から読み返せるようにしたので、ハンズオンを受けていない方でも大丈夫だと思います!!ぜひお役立てくださいませ! 確認事項 nodeいれましたか? editorありますか? emulatorありますか?もしくは実機ありますか? 楽しむ心をもってきましたか? 以上を持ってきた方は、 早速参りましょう!! インストール React Nativeの開発環境を構築しましょう!! yarnのインストール nodeを入れた段階ですでにnpmというパッケージマネージャーはインストールされています!! が、このハンズオンではyarnを使うのでyarnをインストールしましょう! ちなみにyarnもnpmとおなじパッケージマネージャーですが、yarnはnpmよりも速いため、多く

                                                                              React Native ハンズオン〜第一回目 基本文法編
                                                                            • React Native for Windows を試してみよう。そして型も手に入れよう。

                                                                              React Native for Windows を試してみたので備忘録もかねて手順をメモしてみました。 作業開始時点の私の環境は以下のようになります。 Windows 10 Pro 1909 (設定アプリから開発者モードに変更してください) Visual Studio 2019 16.4.2 ユニバーサル Windows プラットフォームワークロードの C++(v141) ユニバーサル Windows プラットフォーム ツール。デフォルトでチェックが入っていないので入れる。142 じゃなくて 141 なので注意 個別のコンポーネントから MSVC v141 - VS 2017 C++ ARM ビルドツール(v14.16)、MSVC v141 - VS 2017 C++ x64/x86 ビルド ツール (v14/16) の 2 つを入れる Node.js v12.9.1 (注意:現時点で最

                                                                                React Native for Windows を試してみよう。そして型も手に入れよう。
                                                                              • React Native製アプリをJSIモジュールを使って50倍高速化した話

                                                                                Faster, faster!人々がアプリを十分に楽しんで使うためには、アプリからできる限り摩擦を取り除くことが重要です。 React Nativeは、JavaScriptとReactを使って、マルチプラットフォームのモバイルアプリを素早く構築できるフレームワークです。そのおかげで、私はInkdropというアプリのモバイル版を作ることができました。エンドツーエンドの暗号化でデバイス間で同期するMarkdownノートアプリです。このアーキテクチャのおかげで、私はこのアプリを素早く構築することができ、ElectronJSで構築したデスクトップ版のコードベースの多くを再利用することで簡単に維持することができました。これは素晴らしいことです。React Nativeには大いに助けられましたが、特に画像を扱う際のパフォーマンスの低さには苦労しました。最悪の場合、7MBの画像をダウンロード、復号化、そ

                                                                                  React Native製アプリをJSIモジュールを使って50倍高速化した話
                                                                                • react-native-firebaseでmessagingを使う時にやる作業メモ

                                                                                  概要 react-native-firebaseを組み込んだアプリでプッシュ通知を行う際の作業メモ。 具体的なソース実装よりは、権限設定などの事務的な内容多め。 前提として、react-native-firebaseと関連モジュール(/coreとか/messagingとか)はインストール済み(+pod installやAppDelegate.mの追記)で、GoogleService-Info.plistやgoogle-service.jsonはネイティブディレクトリに組み込み済みとする。 ※要するにreact-native-firebaseのイントロダクションは終わっている前提 【iOS】Apple Developersでやること 【Certificates, Identifiers & Profiles】から【Identifiers】のメニューを選択し、対象のアプリのIdentifier

                                                                                    react-native-firebaseでmessagingを使う時にやる作業メモ