元某エヴァンジェリストが
見るReactNative
http://gunosy-frontend.connpass.com/event/12636/ でのLT ブログに書く前にちょっと話してみた
http://gunosy-frontend.connpass.com/event/12636/ でのLT ブログに書く前にちょっと話してみた
React Nativeアプリのメモリリークを追いかける - Quipper Product Team Blog
モバイルエンジニアの@hotchemiです。 今回は少し前にReact Nativeアプリの開発中にメモリリークを調査、解決した体験が学びが多かったので調査の顛末を共有できればと思います。 概要 今回問題となったのは、上記の課題・宿題を管理する画面の開発でした。 QA中に発覚した問題としては、「アプリを操作していると特定の端末(主にiPhone5)でアプリが落ちたり、その他の端末でも次第に筐体が熱くなる事がある」というもので、表示するデータはそれなりにあるものの画像や動画を表示する画面ではないのでさすがにおかしいだろうという事と、プロセス起動から時間が経つに従い事象が発生・深刻化していくという特性を考慮しメモリのリークが発生しているという仮説を元に調査を開始しました。 モニタリング 「推測するな、計測せよ」の格言通り、まずはメモリの使用量を計測する所から始めてみます。 Native Rea
Create native apps for Android, iOS, and more using React React Native combines the best parts of native development with React, a best-in-class JavaScript library for building user interfaces. Use a little—or a lot. You can use React Native today in your existing Android and iOS projects or you can create a whole new app from scratch. React primitives render to native platform UI, meaning your ap
【書評】2020年にReact Nativeを始めるときの決定版的技術書が出ます！ - フロントエンドの地獄
「React Native ~JavaScriptによるiOS/Androidアプリ開発の実践」の書評になります。 PDF版はこちらで先行発売開始していて、 gihyo.jp 紙の本は2020/5/20から販売の予定です。 React Native ~JavaScriptによるiOS/Androidアプリ開発の実践 作者:髙木 健介,ユタマこたろう,仁田脇 理史発売日: 2020/05/30メディア: 単行本（ソフトカバー） 買おうと思っていた本の献本を頂き、いち早く読ませていだだいたのでせっかくなのでブログにします！ どんな本？ React Nativeの基本・具体的なアプリ開発はもちろん、React Nativeで の開発に必要な TypeScript・React も1冊で解説。登場時からReactNativeを追い続けた著者陣が、 現場実践をふまえて伝授します。 という紹介文にふさわ
日米通算1億ダウンロードで日本最大フリマアプリ「メルカリ」。今回はメルカリの小嶋仁司さん、坂本結衣さんにメルカリのフロントエンドエンジニアたちがどんな技術や体制で開発しているのか、HTML5 Experts.jp白石俊平編集長が直撃インタビューしてきました！ メルカリで重要な役割を果たしているWebView 白石：お二人は、メルカリでどんなお仕事をされているんですか？ 小嶋：私は2015年10月に入社して、アプリケーション内のWebViewページの開発を担当してきました。具体的には大規模なトラフィックがある取引画面や、配送サービス「メルカリ便」に新たな運送会社を追加したり、「大型らくらくメルカリ便」の配送機能を拡大したり、集荷サービスなどの開発も行いました。 白石：ビジネス的に重要な部分を作っていらしたんですね。 小嶋：技術としてはいわゆるHTML5、CSS3、JavaScriptを使った
ガワネイティブアプリ(Creator)を、React Nativeで置き換えてみての一年間戦いの記録 - BASEプロダクトチームブログ
Native Application Groupの大木です。BASEでは、購入者向けのショッピングアプリ「BASE」、「BASEライブ」、ショップオーナー向けのショップ運営管理アプリ「BASE Creator」の3つのスマホアプリをリリースしております。今回は、その中の一つBASE Creatorを、React Nativeで置き換え、リリースしてみての話を、お伝え出来ればと思います。 課題と動機 https://help.thebase.in/hc/ja/articles/206417201-BASE-Creator-とはなんですか- BASE Creatorは、基本的にはWebViewで画面を表示するいわゆるガワネイティブアプリというものです。Webアプリとの違いは何処にあるかといいますと、商品が売れたり、購入者からメッセージが届くと、Push通知でお知らせ出来る機能があるところです。
Building on React ReactXP builds on the popular React JS and React Native frameworks. XP means X-Platform Share most of your code between the web, iOS, Android, and Windows. Apps Users Will Love Create great-looking, responsive web pages and mobile apps that feel native. The authors of React use the phrase “learn once, write anywhere”. With React and React Native, your web app can share most its l
新しいハイブリッドアプリケーションのフレームワーク「React Native」をFacebookが公開。React.jsの書き方でOSネイティブのUIを利用可能
新しいハイブリッドアプリケーションのフレームワーク「React Native」をFacebookが公開。React.jsの書き方でOSネイティブのUIを利用可能 「FacebookではReact Nativeを以前から本番環境で使ってきた」（We've been using React Native in production at Facebook for some time now）。Facebookは、モバイルアプリケーション向けのフレームワーク「React Native」をオープンソースで公開しました。 React Nativeは、JavaScriptおよび同社がすでにオープンソースとして公開している「React」でモバイルアプリケーションが開発できるフレームワーク。Web技術を用いつつもモバイルOSのネイティブなUIコンポーネントを利用できるのが最大の特長で、これによってWebV
Xamarin 最近どうよ？ - Qiita
「ネイティブアプリ開発者は絶滅危惧種なのか？」への感想文 - ナカザンドットネット や Office 365, MS teams, Skype, @code, and the edge debug protocol are being rewritten in js instead of C++ with special MS tooling : programming への反応で、「最近 Xamarin 生きてんの？」という声がちらほら聞こえたので書いてみました。 もともとの 「ネイティブアプリ開発者は絶滅危惧種なのか？」 という問いには、「緩やかにそうなっていくでしょうね」 という冒頭の記事を書かれた @Nkzn さんとほぼ同じアンサー1 なので、この話題を Xamarin と絡めたらというネタで書きます。 マイクロソフトなのになんで React 使ってんの？Xamarin は？ Of
Core Style React with no outside deps and 100% feature support across web and React Native. Adds many missing features to the RN Style API in ~24Kb. Static A smart optimizer that does partial analysis, extracts CSS, flattens your tree, and removes code. Supports Next, Webpack, Vite, Babel and Metro. Tamagui All the components you'd want, cross platform and adaptable to each other. Composable Compo
https://d-cube.connpass.com/event/49935/ 2017/2/9実施Read less
At React.js Conf 2015 Facebook announced React Native — a way to write native iOS and Android applications with JavaScript using the familiar React.js. What is React Native React Native is a way to build native apps in JavaScript using React.js for user interface. It doesn't use DOM for rendering, instead, it renders with native UI views. You write normal React components, but instead of using low
The best IDE for building React Native apps is now free and open source.
ReactNativeプロジェクトで、型がないことによるつらいシーンが多くなり(特に変数の解釈に起因するバグ)、Facebook製の静的型解析ツールであるFlowを数ヶ月前に導入しました。導入時の学びと、しばらく運用して感じていることについて個人的な感想を書きました。 Flow選定理由 Javascriptで静的な型付けをするといえばTypeScript(正確にはJavascriptのスーパーセット)がありますが、プロジェクト途中からの導入しやすさの観点からFlowにしました。Flowはお作法(行頭に @flow つける等)さえ押さえれば誰でも使えることから導入障壁はだいぶ低いといえます。導入のメリットについては以下のスライドがとてもわかりやすいです。 speakerdeck.com flow status でプロジェクトに対して静的型解析を走らせることもできますが、 コーディング時にワー
モバイルアプリ開発ツールメモ2016 - Qiita
いろんなツールがあって技術選択に迷うので、定点観測的にいま思っていることをざっくり書いてみました。 TL;DR ひたすらスピードを求められるプロトタイピングなどはCordova（Ionicなど含む） Cordova上でReactで開発した資産を引き継ぎたいみたいな前提があってユーザーレスポンスを改善するならReact Native 時間がかかってもいいからとにかく安定させたいならネイティブ 学習コストが高くてもよくて開発スピードと安定性を両立するならXamarin 私はネイティブが一番好きです。 はじめに 「AndroidとiOSアプリを両方作ってくれ」という要件はよくある話ですが、ベンチャーで新しいサービスをモリモリと立ち上げている中での両対応となると、両方共ネイティブで作っていくわけにはいかないこともあります。 そもそもそんなにバランス良くAndroidエンジニアとiOSエンジニアは集
IMPORTANT MESSAGE — If you are starting a new project with NativeBase, we recommend using gluestack-ui instead.
Microsoftエンジニア、「Officeを完全にJavaScriptで書き直した」とツイートして炎上 | ソフトアンテナ
Microsoftの開発者が、Officeを完全にJavaScriptで書き直したとツイートしたことから騒動が巻き起こっていることが判明しました(MSPoweruser)。 問題の発言を行ったのは、Microsoft Web PlatformのTechnical Program ManagerであるSean Thomas Larkin氏で、「Office 365の全ては、JavaSriptと呼ばれる小さなスクリプト言語で完全に書き直されました」と以下のようにツイートしています。 (Ive never been able to say this yet) 🙋Well Actually!🙋 All of Office 365 is (almost finished) being completely rewritten in this little scripting language c
ダメなライブラリ。 redux reduxはstate管理の素晴らしいライブラリだ。 世界で一番愛用され、情報量も多く、大規模システムに向いている。 しかし、react nativeを採用するのはほとんどがスタートアップだ。 学習コストが高い＋プロトタイプ制作が苦手なreduxはスタートアップにははっきり適さない。 reduxの代わりにcontext Api/MobXを使おう。Expo＋contextApi or MobX+web版のfirebaseがスタートアップでの最適解だと思う。 react-native-cli cliでなくExpoを使おう。cliはライブラリのアップデートの際に莫大な手間がかかる。要するにnativeライブラリのメンテナンスに手間がかかりすぎるので、Expoをオススメする。(スタートアップでは特に)私はcliもexpoも現在実務で使っているが、体感expoのが２倍
TL;DR iOSDC Japan 2017 というイベントが先日開催され、そこでReact Nativeを題材に何かトークをしようと応募したら、まんまと枠をもらえたので話をしてきました。 事前のリサーチでiOSのエンジニアはReactやReact Nativeについて名前や概要ぐらいは知っているけど使ったことのある人は多くないということが分ったので、まずは興味を持ってReact Nativeの環境をインストールしてもらうことをゴールに、Reactプログラミングのパラダイムや思想について、iOSエンジニアが普段行なっているネイティブアプリ開発とどのように違うのか? という内容にしました。 いくぶん抽象的な話に終始してしまい力量不足で本当はもっとわかりやすい説明をしたかったなと反省しつつも、実践的な内容はこれからも各所で見られることになると思うので是非React Nativeにご注目ください
ES6とReactの勉強を兼ねて、React NativeでiOSアプリとAndroidアプリを作ってみました。 アニメグッズの最安値を検索するアプリです。 アニマネ プライス - アニメグッズの最安値をチェック！ Kazuhiro Minatoショッピング無料 React NativeはJavaScriptが書ければiOSアプリとAndroidアプリが作れます。 それに加えてHTML5のハイブリッドアプリとは違い、高速に動作すると謳われるプラットフォームです。 コードの共通化ができて、しかも高速というのは開発者にはとても魅力的です。 タイトルはパロディなので少々大げさな感じがしますが、実際に作って色々と分かりましたので、 React Nativeについて軽く紹介しつつ、これから導入を検討している人向けに書いてみます。 ざっくりとしたまとめ 長い記事なので、忙しい人向けのざっくりとしたまと
【RECRUIT Technologies NIGHT vol.5】リクルート流フロントエンド開発 / https://atnd.org/events/86112
はじめに よくよく考えると今日クリスマスイブらしいですが、残念ながら記事書くぐらいには予定がないです！ クリスマスの高円寺は逆にとても空いているのでオススメですよ！ 色々と進捗あって【React Native】良さげなコンポーネント紹介が古くなってしまったのでそれ以降変更あったり、新しいやつみつけてたりするので改めての報告です。 去年と同じものを紹介したりしてますが、それはとても良かったり、情勢に変化があったパターンは紹介しています！ 僕もまだまだ知識浅いのでこっちだぜ！これもあるよ！などあればお教えいただけますと幸いです！ 今年は僕がこの記事を書いた地点のスター数を記載しています！ ルーティング react-native-router-flux ★：6048 バージョン追えていない感と進んでいない感が半端なくなってきた頃合いですが、色々と触ってみた感じ、（動く環境なら）一番ちゃんと動くん
2018年 React Nativeで真剣なアプリを開発するなら、絶対使うライブラリー！ - KOKENSHAの技術ブログ
ここで、私が、React Nativeでアプリを開発する際に、実際に使っているライブラリーと「この機能でしたら、絶対これでしょう」というライブラリーをご紹介していきたいと思います。 React Nativeの開発で、全ての機能を全部自分で書くわけにも行きませんので コミュニティが開発している優秀なものがあれば、どんどん活用すべきですね。 しかし、オープンソースになっている以上 品質も自分で、しっかり見極めて、選別しないと 後になって、大変なことになります。 途中から、別のライブラリーに乗り換えもできますが、プログラムの修正、テストなどで大変な工数を消耗してしまいます。 なので、この文章を通して、みなさんライブラリー選別の際に、ご参考になれば嬉しいです！ 「これもおすすめ！」というライブラリーやコンポーネントがあれば、ぜひ教えてください！ https://facebook.github.io
逆引きKotlin Multiplatform 〜Swiftに対応するKotlinの機能と、KMPによる変換後の実態〜
http://engineering.flipboard.com/2015/02/mobile-web/ 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約4時間前 ものごとが進化すると、利用するユーザの満足度はあがるので、それを用意する作業量はツールの改善に従って最終的には減っていくのか？ スマホが登場して、アプリ上でのスワイプなどの直感的にできる操作や表現の幅が広がり、またディスプレイも改善。では、プロダクトをつくる側がそれに慣れてくると、作業量が減るのか？いや、現実は逆。同じことを実現する作業量は減っても、トータルでは減らない。ブラウザとアプリにまたがって、双方のメリットを取り込もうと、もっとレベルの高いUIを目指した競争が続いています。 David BellonaがTwitter Universityでの
Web開発者、アプリ開発者に捧ぐReactの提唱する"learn once, write anywhere"はどこまで本当なのか？ - Qiita
Web開発者、アプリ開発者に捧ぐReactの提唱する"learn once, write anywhere"はどこまで本当なのか？JavaScriptAndroidiOSReactreactnative 最初に この記事は React Native Advent Calendar 2016 23日目です。 釣りなタイトル失礼します。 以前、FacebookまじでReact Nativeやるってよ！でFacebookにとどまらず、Instagram, airbnbのアプリがReact Native製に置き換わっていることを投稿しました。 個人的に大きいニュースだと思ってます。 なぜなら安定稼働しているiOS/Androidのナレッジとチームを棄ててまでも、乗り換えを選択する理由がReact Nativeにはあると言ってるものだからです。 様々な理由があると思いますが、大きな要因は"learn
はじめに NagisaでiOSエンジニアをしている伊藤です。 今回はReactNativeというスマホアプリのクロスプラットフォーム開発ツールを使った取り組みについて紹介をしたいと思います。 アプリのクロスプラットフォーム開発といえば、以前ではTitaniumやCordovaといったWebViewをベースとしたアプリをイメージするものが多く、純粋なネイティブアプリに比べるとどうしてももっさりとした感覚になってしまい、あまり採用されることはなかったように思います。 ReactNativeではこのもっさりとした感覚はなく、とてもスムーズに動作するアプリを作れます。その理由はWebViewを使用せず、ビューやラベル、スイッチなどで本当のネイティブコンポーネントを使った画面が構成されるところにあります。これにより国内でもにわかに人気が出てきています。 UPTOON!のReactNative化 UP
React Native でアプリ開発をして良かったところ・ツラかったところ - BizReach Tech Blog
こんにちは。ビズリーチの新卒事業部でフロントエンドエンジニアをやっている円谷(@___35d)です。以前ビズリーチのデザイナーブログにも登場して、通勤風景の写真でチーム内で相当いじられました。興味ある方はぜひそちらも読んでみてください。今日はエンジニアブログの方を書いていきたいと思います。 さっそく本題ですが、2018 年 11 月に ビズリーチ・キャンパス for OB/OG がフルリニューアルされました。いままで WebView ベースで構築されていたアプリをリデザインし、React Native でフルネイティブ化しました。この記事では React Native を採用するまでに至った背景と、導入してどうだったのかについてお話できればと思います。この記事が、これから React Native を使ったアプリ開発を検討している方の参考になれば幸いです。 目次 はじめに 社内事情と技術選
エンジニアtypeは、各種エンジニアをはじめ「創る人たち」のキャリア形成に役立つ情報を発信する『＠type』のコンテンツです。
react-native meetup #2
ReactNativeMeetup #5 LT https://react-native-meetup.connpass.com/event/53572/?utm_campaign=event_waitlist_promotion_to_participant&utm_source=notifications&utm_medium=email&utm_content=detail_btn
クロスプラットフォーム開発3種の神器 React Native / TypeScript / GraphQL
Kotlin Symbol Processing API (KSP) を使って Kotlin ア プリケーションの開発を効率化する
2018年の夏に「React Nativeはメリデメ両方デカすぎて、気軽に採用すると事業や組織とのミスマッチを起こしやすいので、マッチしてるかどうか考えてから採用しましょうね」という話をしました。 blog.nkzn.info このときは雑多に問題提起してしまったので、具体的なモデルケースを想像しづらいものになってしまっていました。 そこに課題意識を持った私は「2019年はRNにマッチしそうな事業（プロダクト）や組織（チーム）の姿を伝え続ける年にしよう」と位置付け、各所でその方針に基づいた情報発信を行いました。 人材調達の難しさに目をつけた第一弾 その第一弾として、ちょっとフライングして2018年末に公開されたのが次の記事です。 codezine.jp 「どうせビジネスサイドは3プラットフォーム出したいっていうじゃん」 「でも本当に3プラットフォームそれぞれの作法を理解してる人をそれぞれ集
React Nativeハイブリッドアプリケーション開発ことはじめ - tomoima525's blog
こちらはReact Nativeアドベントカレンダー 19日目の記事になります。 ここ1、2年でReact Nativeによるアプリ開発はますます盛んになっていますが、一方でNativeと組み合わせたとハイブリッドアプリケーション開発はまだ発展途上です。 React Nativeの公式ドキュメントにもIntegrating with existing appという項目がありますが、あっさりと書かれている上に鮮度がお世辞にも高くありません。 しかしながら、FacebookやAirbnbなど大企業がハイブリッドアプリケーションを積極的に導入していることや、Nativeアプリを部分的にリプレイスできる利便性から、今後も採用が増える分野と考えられます。本記事ではハイブリッドアプリを開発した自分の経験から、プロコンや実装の基本についてまとめました。 ハイブリッドアプリケーションの良い点/難しい点 そ
GitHub - storybookjs/storybook: Storybook is a frontend workshop for building UI components and pages in isolation. Made for UI development, testing, and documentation.
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
はてぶのお気に入りをタイムライン形式で読めるHBFavというアプリがある。 このアプリは自分にとってはTwitterやFacebookの次くらいによく開くアプリで重宝している。 基本的な機能についてはほぼ不満はない。 しかし、クリップボードにコピーしたURLからブックマークをする方法については満足とはいえなかった。 この機能は、例えばTwitterやFacebookなどでシェアされたURLをコピーしてHBFavを開くと、画面上部にニョキッとURLが書かれたnotification viewみたいなものがでてきて、そこをクリックするとURLのページが開き、そこからブコメを見たり、ブックマークしたりということができる。 挙動自体はワンクリックでシンプルに！という気持ちを感じるしよいのだけど、問題なのは対象のURLがブックマークできるのはそのnotification viewが出てる間だけだとい
PCで我々がWebアプリを多く利用するが、モバイルにおいてアプリは全てだ。今ではモバイルを使っている時間の90%はアプリの利用に費やされている。 ここでいうアプリとはネイティブアプリの事だ。 マーク・ザッカーバーグがネイティブではなくHTML5に投資したのは最大の失敗だったと宣言して以来、モバイルWebは着実に勢いを失ってきている。 しかし皮肉なことに、フェイスブックのエンジニアたちのおかげでそれも過去の事になる。 どういうことか説明しよう。 モバイルWebをReactする ザッカーバーグがHTML5は終わったと宣言した翌年、フェイスブックのエンジニアの一人であるジョーダン・ウォークがWeb開発の新しいアプローチであるReactJSを生み出した。 ReactJSは開発者がJavaScriptのスキルを活用し、アプリ開発をシンプルにできるようになった。しかし他にも多くあるイノベーションのうち
React Nativeについてのメモ
huin Job : Software Engineer(iOS, Android) Use : Objective-C, Swift, Java Like : Gadget, Apple, Photography, Art, Design, UI, UX More posts by huin. 発表直後に一気に話題になりましたがfacebookがReact.jsのスタイルでネイティブアプリを作成するツール「React Native」を発表しました。"Learn once, write anywhere"という思想で、一度学習してしまえばWeb/iOS/Androidとすべての(メジャー)なフロントエンドアプリケーションを作成することができると説明しています。 が、ツール自体はまだ公開されておらず、発表のインパクトの割には中身がしれないのですが、React Nativeが発表されたReac
全体の手順 自分のPC上で、秘密鍵／公開鍵ペアを生成する CSR（Certificate Signing Request - 証明書署名要求）を、(1)の公開鍵を付けてAppleに送る (2)の公開鍵を含む証明書を作り、認証局の秘密鍵で暗号化 (3)の証明書をダウンロードし、キーチェーンへ登録 App IDを登録 プロビジョニングファイルの作成 プロビジョニングファイルをダウンロードし登録 ビルド設定を行う（BundleID, コードサイニング） ビルド、アーカイブ（ipaファイル作成 ※） 証明書の作成 & キーチェーンへの登録 (1-4までの手順) 開発用と配布用の2種類がある 開発用 (Development) https://developer.apple.com/account/ios/certificate/development 配布用 (Distribution) http
※当方iOSアプリ開発経験無し react-native、デモ見たときタップしたら画面上の数が増えるぐらいのアプリしかつくれなさそうという印象だったけど、いま丁度タップして読んだ数が増える程度のアプリつくりたいんで使いたい— 生産職 (@r7kamura) 2016年8月23日 とち狂ってreact-nativeのチュートリアルに沿ってインストールはじめてしまった、死にたい— 生産職 (@r7kamura) 2016年8月23日 殺してくれ 殺してくれ— 生産職 (@r7kamura) 2016年8月23日 アプリ完成した pic.twitter.com/bep81pzWAR— 生産職 (@r7kamura) 2016年8月23日 とりあえずバナナでも表示してみるか— 生産職 (@r7kamura) 2016年8月23日 なるほどなるほど pic.twitter.com/mgLilyL09
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
React Native · Learn once, write anywhere
メルカリのフロントエンドチームが、どんな開発体制で技術選定しているのか聞いてきた！
A library for building cross-platform apps - ReactXP
Tamagui — React Native + Web UI kit
React.js・ReactNative・Redux入門
React Native — write native apps with React.js - /dev/zine
Deco - React Native IDE
Flow導入して数ヶ月がたった所感 - tomoima525's blog
NativeBase: Universal Components for React & React Native
React Nativeの実は使ってはダメなライブラリ素晴らしいライブラリ(随時更新) - Qiita
iOSエンジニア向けのイベントでReactの話をした - laiso
React Nativeはアプリ開発者の夢を見るか？ - アニマネ開発日誌
フロントエンドエンジニアが React Native を触ってみた話
React Native おすすめコンポーネント一覧v2 - Qiita
React製WebサービスをReactNativeでアプリ化した話
React CanvasによるモバイルブラウザのUI改善とそれが起きる必然 - ワザノバ | wazanova
ReactNativeでiOSとAndroidの漫画アプリを同時に作る | Nagisaのすゝめ
エンジニアtype 技術者のキャリアを考えるWebマガジン - 転職＠type
マルチプラットフォーム時代の JavaScript x React 戦略
Web開発者が React Nativeで 開発から本番運用までして辛かった事
React Nativeの「(not) for you」を伝え続けた2019年を振り返る - ナカザンドットネット
ReactNativeで自分用のHBFavを作った - razokulover publog
Reactによってネイティブ/Web論争は終わったのかもしれない
ReactNativeで作ったIOSアプリを公開するまでに必要な手順 - Qiita
急に高まって深夜にiOSアプリつくった - ✘╹◡╹✘