iOSDC 2017 Reject Conference days2での登壇資料になります。 https://iosdc-reject-conference.connpass.com/event/64236/ 平素はSwiftでiOSアプリの開発をしています。今年からReactNativeも多少嗜むようになり、その中で得た知見や実装の際で予め気をつけて置くと良いかと思うことや、UI構築の中での違いなどをざっくりとまとめたものになります。
こんにちは、@binaryta です。 先日「React Native OSS ペアプロ会 #3 byFACTBASE」というイベントに参加してきました。 factbase.connpass.com OSSにcommitすることを主眼としていて、React Nativeのissueの問題に解決策を提示したり、解決できそうならPull Requestを送るといった内容です。 このイベントに参加中、レイアウトのバグを直そうとしていた際にYogaを知りYogaに興味を持ちました。 僕は「React Native OSS ペアプロ会」には初回から参加していますが、今後も定期的に開催するみたいなので、興味ある方は是非参加してみてください。 対象 Yogaはクロスプラットフォーム間で共通にレイアウト処理をするべく作られたレイアウトエンジンです。そのためiOSではObjective-C, Android
javascripterです。ハローでは、プロダクトのローンチ前からAutoReserve の開発に関わっています。今回の記事では、AutoReserveでおこなっているコード共通化の取り組みについて紹介します。 背景 AutoReserveのネイティブアプリはReact Nativeで書かれており、またウェブ版は、Reactで書かれています。 ウェブ版では、React Native for Webという、React上でReact NativeのコンポネントのAPIを使えるようにするライブラリを使用しています。 React Native for Webを採用したことで、ハローでは現在、エンジニア1人でiOS、Android、ウェブの全てのプラットフォームに同時展開できるようになりました。 また、不具合修正やデザインの修正も、一箇所を修正するだけで同時にできるようになりました。それぞれのプラ
どうも、大里です。 今回は副業のはなしです。 (TOP画像だと1週間休み無く毎日働いてる感がありますが、そんなことはないです) 話題のツイート 友人が副業禁止されてる会社に副業がバレて二度と副業をしないよう上司に言われた。 言われた通り翌日から会社に行くのを辞めたら鬼電が止まらなかったとか。 友人いわく、何が副業かは俺が決めること。そして二度と副業をしないように言われたのでそうしたのだと。 それを聞いてメッチャ笑ったよww— 茶とらーずの隠れ家* (@chatora_hideout) 2019年7月9日 少し前に副業禁止の会社に関するtweetがバズってましたが、ハウテレビジョンでは副業を全面的に推奨しています。 もちろん事業的に競合する会社はダメとか、体を壊すような無茶な働き方はダメとか一定の基準はありますが、あらかじめ申請した上で副業しているメンバーは結構います。 僕もその1人で、20
React Native入門 ─ Hello,Worldからネイティブ連携まで Kameda Shohei(GLOBAL EDUCATIONAL P...) モバイルアプリ開発におけるWeb技術の可能性を探る特集・第一弾でご紹介するのはReact Native。その生い立ち、チュートリアルから、コードベースやUIを記述する言語、パフォーマンスまで解説します。 概要 React Nativeは2013年にFacebook社内のハッカソンで生まれたプロジェクトです。2014年にiOSアプリのFacebook Ads ManagerをReact Nativeを用いて開発し、2015年3月にオープンソースとして公開されました。そして、半年後の2015年9月にAndroidをサポートし、今年のF8では、MicrosoftがReact NativeでWindowsプラットフォーム(PC, Mobile
会社プロジェクトを 0.44.3 (2017年6月時点の最新版)から 0.49.5(2017年11月頭時点の、最新版のstable)に上げた。思ったより大変だったのでメモっておく。 そもそも何故 ReactNative のバージョンを上げるのか? RN はまだまだ絶賛進化中で、本体のバージョンが上がることで React / React Native のパフォーマンスの向上や、周辺環境の向上、例えば Flow での型チェックがさらに進化するなど恩恵を受けれる。 実際にアップグレードしてCIの実行速度も20%ほど向上した。以下は CircleCI のビルド時間の中央値の値。真ん中あたりでガクッと下がったのがRNのバージョンを上げたタイミング。 また、破壊的な変更が本体に入ることも多く、例えば RN 0.47 から Android ネイティブライブラリ作成で利用されていたcreateJSModu
こんにちは、ネットではウマたんというハンドルネームで活動していて普段はスタビジというメディアやスタアカという教育サービスを運営しています。主にAIデータサイエンスまわりの発信活動や事業を展開してます。 バックグラウンドはデータサイエンスなのですが、サービスやコンテンツなど、何か誰かの目に触れるもの・誰かに使ってもらえるもの・誰かの役に立つものを作ることが好きで、2024年は12ヶ月で12個のサービスを立ち上げる挑戦をしています。 また同時に2024年頭からジョージアという国に拠点を移して海外で挑戦してます。めちゃくちゃいい国なので興味のある方はぜひお越しください!案内します。 さて、12ヶ月で12個のサービスを立ち上げる挑戦って異常に思えるかもしれませんが、実は海外だとよくある挑戦なんです。 最初にはじめたのは超有名なオランダ人の個人開発者「ピーターレベルズ」。 代表的なサービスは以下。
対象読者 JavaScriptとWeb開発の基礎に理解がある方 Reactに興味/関心があり、これから学び始める方 前提環境 筆者の検証環境は以下の通りです。 macOS Sierra 10.12 Node.js v6.6.0/npm 3.10.3 React 15.4.0 Node環境が準備できていない方は別途インストールしてください。Mac環境であればnodebrew、Windows環境であればnodist等のバージョン管理ツールの利用をおすすめします。 Reactの主な特徴 ReactはUIを構築するためのFacebook製オープンソースJavaScriptライブラリです。 2011年にFacebookのニュースフィードにデプロイされて以来、Instagram、Airbnb、Netflix、Paypal、Uberなど数々のアプリケーションで活用されています。Reactの公式サイトには
こんにちは。投稿開発部 ディレクターの五味と申します。 初日の記事から5日間に渡ってお届けしてきた「クックパッド MYキッチン」の連載も、いよいよ今回が最終回です! 私たち投稿開発部では、クックパッドユーザーの中でも特に「レシピを投稿するユーザー」にとって最適なアプリを追求するために、「クックパッド MYキッチン」アプリをリリースしました。ではこれからそこで、ユーザーにどのような体験や機能を提供していくべきでしょうか。 今回は、ユーザーの課題を起点に次の施策を発想していくために行なっている、ユーザーインタビューの取り組みについて紹介します。 App Store / Google Play 料理をつくる人はどんな課題を抱えているのか 投稿開発部は現在「クックパッドにレシピを投稿するユーザーを増やすこと」を目標とし、その戦略として「レシピ投稿の継続率を改善すること」と「レシピを投稿し始める人を
What is GitPoint? View repository and user information, control your notifications and even manage your issues and pull requests. Built with React Native, GitPoint is one of the most feature-rich unofficial GitHub clients that is 100% free. What is GitPoint? View repository and user information, control your notifications and even manage your issues and pull requests. Built with React Native, GitP
ライブエクスペリエンス事業部 エンジニアの高松(@shimpeiws)です。 React Conf 2017 現地レポート (1日目)に引き続き、React Conf 2017 2日目の様子をサンノゼの会場から直接お届けします!!! 1日目のセッションの録画がYouTubeにアップされていました! 1日分が1本の動画(8時間25分!)なので見るのに気合がいりますが、 昨日のレポートやスケジュールを見ながら、気になるセッションをぜひチェックしてみてください! http://conf.reactjs.org/schedule 食事 2日目の感想 Goodbye Flatland! An introduction to ReactVR and what it means for web developers (Michaela Lehr) 概要 メモ Realtime React Apps wi
ちょっと訳あって仕事の一貫としてReactNative + Scala.js の技術検証している。あたまには「全部C#」のライフベアさんの事例がある。弊社、最近メンバー増えてきたけどまだこの規模だと「あのひとはあれができるけどあのひとはこれができなくて」がボトルネックになりうるので、 筋の良い 共通の基盤技術を持つという選択肢のひとつとして検証したいというのがモチベーションとしてある。というわけで、 Reduxは使ってない。「Scalaを基盤技術にしてどこまでできるのか」が検証の目的だから。 Vue.js + Scala.jsでElectronアプリ作ったときと同じ感じで、MVWhateverのVとWhateverの部分は素直にJSで書いている。分厚いMをScalaで書き、UIだけReactNativeで記述する。 以下ファーストインプレッション pros Vue.js + Scala.j
こんにちは、エンジニアの Miho です!Expo に関わるCTO達の座談会、 前編は React Native や Expo の仕組みについて理解を深めながら、導入のメリットや eject の必要性など、1年以上運用してきたからこそ語れる話題で盛り上がりました。 tech.kitchhike.com 後編は、オープンソースコミュニティという視点を中心に、Expo のもつ可能性をさらに深掘りしていきたいと思います! Expo を支える組織 温度感あるOSSコミュニティ、Expo Expo のメリット・デメリット復習 コミュニティへの関わり方と、今後の展望 We’re Hiring! Expo を支える組織 藤崎 祥見(以下、S):改めて Expo の価値や導入のメリットを振り返りたいと思います。React Native を含めて、クロスプラットフォームという特徴は間違いなく、少人数でのネイ
React NavigationRouting and navigation for Expo and React Native apps.
Takuya Digital crafts(man|dog). Love photography. Always making otherwise sleeping. born in 1984. Rollout.io導入アプリがリジェクトされた話題は、3月7日にHackerNewsで盛大に盛り上がりました。 Hot Code Pushというのは、App Storeのレビューを通さずにアプリの挙動を変更できる仕組みのこと。 Rollout.ioはこの仕組みを利用してバグ修正が迅速に行えるサービスを提供していました。 上記Hacker Newsのコメ欄にRolloutのCEOのErezが出てきたりして、顔面蒼白ぶりがひしひしと感じられますねぇ。 これだからプラットフォーム依存は怖い! ネイティブの動きを変えられるようにするのはダメ 何がダメかっていうと、以下のAPIを使って動的に挙動を変えられ
本エントリは3部作のPart2となっております。 Part1: Monorepo/CI Part2: 導入/Bridge Part3: 振り返り/今後 モバイルエンジニアの@hotchemiです。 Part1からすっかり時間が空いてしまい恐縮ですが引き続き弊社のReact Nativeハイブリッドアプリの取り組みについて語っていければと思います。 段階的なインテグレーション 前回のエントリでmonorepoへの移行とCIの整備について語りましたが、今回は実際にどの様にインテグレーションを進めていったかについて説明していきます。 新しい技術を採用するに辺り、ビッグバンリリースを避け段階的に導入を試みていくアプローチの方がリスクを避け柔軟に対応できると考えています。ですので一気に再構築プロジェクトを発令するのではなく、ある機能をリニューアルする際にその画面のみReact Nativeで書いてみ
こんにちは、React Nativeエンジニアの@kiriminです。去年の末くらいからReact Nativeでの開発案件に携わっていまして、ある程度形になってきたので、Webフロント開発の経験がないAndroidエンジニアがReact Native案件にいきなりJoinして感じた事やReact Nativeでの開発の雰囲気などについて週次で開催している社内LT会で共有しました。 ネイティブエンジニアチームによるReact Native開発案件の一例として共有したいと思います。 TL;DR・React Nativeの学習コストはかなり低い ・最新のJavaScriptでの開発はそれなりに快適 ・思ったよりはよく出来ていてAndroidとiOSをあまり意識せず同時に実装出来るのは本当 ・ただしネイティブと遜色ないデザインを実現するにはかなりの努力が必要 ・Reduxは面白いけど難しい An
これはなに 高円寺.dev #3 用の資料 https://koenji.connpass.com/event/160886/ フロントエンド専門じゃない人向けの、フロントエンドの最先端〜やや未来の話です このレイヤーでは Node.js を使うべき/使うと強いという部分がありますが、他言語を否定しているわけではありません。むしろ他言語でこのアーキテクチャを模倣してほしいという話です。 10 年代のフロントエンドのポストモーテム 10 年代まとめ IE が死ななかったので各種ポリフィル、メタ言語からのトランスパイルが発達。しかしモダンとレガシーの乖離が深刻に。 node と npm エコシステムの成立 仮想 DOM がフロントエンドライブラリの標準的な状態管理手法に モジュールシステム需要が ES Modules(ES2015)に結実。しかし webpack は死ねなかった。 モダンとレガ
この記事は React Native Advent Calendar 2020 の 13 番目の記事です。私の視点や感覚をもとに、 React Native を採用する際の現状を記述したものです。 次の方を対象としています。 技術をビジネスの競争力へ転換する責任を負う方 採用の責任を負う方 技術的な詳細については拙著を参照してください。 書いているひと エンジニアリングマネージャーの januswel です。現在は育成をメインに、採用を少し手伝ったり、メンバーのキャリアと組織の方向性をすり合わせるなど、主にピープルマネジメントを担当しています。また、チームでの採用技術の軸足を揃えたり、実案件も少し関わらせていただいてます。 React Native とはなにか React を用いて様々なプラットフォーム上でアプリケーションを構築可能なオープンソースソフトウェアです。開発は Facebook
Opens in a new windowOpens an external siteOpens an external site in a new window After years of native mobile development, we’ve decided to go full steam ahead building all of our new mobile apps using React Native. As I’ll explain, that decision doesn’t come lightly. Each quarter, the majority of buyers purchase on mobile (with 71% of our buyers purchasing on mobile in Q3 of last year). Black Fr
What is React Native?React Native is a JavaScript framework for building cross-platform apps. This guide covers everything you need to know to start developing React Native apps. How to use this guideBuilding with React Native is extremely efficient — but getting started can be a little tricky. You should use this guide as a companion to the official Facebook documentation for getting started. Thi
こんにちは!カミナシでソフトウェアエンジニアをやっているくらさわです! 今回は元々、サーバサイドをメインに開発していた私が、カミナシでモバイルアプリの開発に取り組んでみた話を書きたいと思います! カミナシのチームについて React Native について Expo について 超入門 やってみた感想 終わりに カミナシのチームについて カミナシのプロダクト開発では「単一のチームで顧客への価値提供が可能な体制をとる」という思想のもと、フロントエンド、バックエンド、インフラストラクチャーなどの技術的スタックでチームを分けることはしておりません。 参考記事: type.jp そのため、各個人では得意、不得意はありつつも、チームとしては全ての領域を担当しています。 フロントもサーバもインフラも手を出したいタイプの人にとってはめっちゃいい環境だと思います!おすすめです! そんな環境なので、私もずっと
Facebook gave all attendees of React Conf early access to the source code of React Native, a new way to write native mobile apps. The technology takes everything that's great about React.js and applies it to native apps. You write JavaScript components using a set of builtin primitives that are backed by actual native iOS or Android components. First off, I know it sucks it's not completely public
現役の医師が手がけるプログラミングスクールが開校。医療現場の課題を自身で解決できる人を育てる、日本初の医療者向けプログラミングスクールが開校。プログラミング初心者でも、情熱があればOK。プログラミングを学びたいという情熱を持った同じ医療者達で、楽しく3ヶ月間のプログラミング教育入院しませんか? 医療法人社団新潮会(本社:東京都足立区、理事長 北城 雅照)は、医者や看護師などをはじめとした医療者向けのプログラミングスクール「ものづくり医療センター」を2021年6月にトライアル開校を実施し、プログラミング教育入院希望者を募集致します。 医療法人社団新潮会(本社:東京都足立区、理事長 北城 雅照)は、医者や看護師などをはじめとした医療者向けのプログラミングスクール「ものづくり医療センター」を2021年6月にトライアル開校を実施し、プログラミング教育入院希望者を募集致します。 ■医療現場の課題を自
1年半前は 業務 とか 趣味 で TypeScript を使ってテストも書いてたんだけど、最近は iOS ばかりで忘れてしまっていた。 けどまた仕事で同じような環境を作ったので、テストを書くときにどういう Framework があって役割は何かをメモっておく。 テストフレームワーク テストを書くために必要なライブラリ。 iOS でいったら Quick や XCTest, Rails でいったら rspec とかが該当する。 Mocha - the fun, simple, flexible JavaScript test framework BDD フレームワークで、 assertion の機能は持っていない Jasmine Documentation Matcher というアサーションライブラリを内部で持っているようだ Jasmine使い方メモ - Qiita Jest · 🃏 Del
この記事は React Native Advent Calendar 2017 の 4 日目の記事です。 TL;DRエラートラッキングサービス Sentry の React Native における導入方法の紹介Sentry を使えば、 OS ・バージョン等どのような環境でどのような問題が起きたかがわかるようになるどのユーザがどのようなシチュエーションで問題に遭遇したかがわかるようになる基本的な使い方を紹介 エラートラッキングの必要性とその方法一切の問題無くアプリケーションが動作するのであればそれに越したことはありませんが、十分なテストを以てしても予期せぬ障害は起きるものですよね。 そういった問題は全て解決されるべきですが、そのためには以下が不可欠でしょう。 問題が発生したことに気付ける仕組み問題が発生する原因を(容易に)知ることが出来る仕組み文字通り解釈すれば前者をエラートラッキングと呼ぶ
先日React Native Meetup Portlandという勉強会でReactNativeとNativeのハイブリットアプリ開発について発表をしてきました。アメリカの自社開催以外のの勉強会で発表することは初めてだったので、知見と反省をメモしておこうと思います。 経緯 会社のオフィスは現在サンフランシスコとポートランドにあります。ポートランドは今アメリカで一番人気な街と言われているのですが、実はスタートアップやIT企業も数多くあります。React Nativeは今人気なフレームワークで、つい先週もReact ChainというReact Native(React.jsでない)のカンファレンスが開催されたばかりです。色々な経緯でそんなポートランドのReact NativeのMeetupグループにオフィスを提供して勉強会を開くことになり、自分が発表者の1人として登壇させてもらうことになりまし
Welcome to the very start of your React Native journey! If you're looking for getting started instructions, they've moved to their own section. Continue reading for an introduction to the documentation, Native Components, React, and more! Many different kinds of people use React Native: from advanced iOS developers to React beginners, to people getting started programming for the first time in the
私は新卒で外資系SIerに入社しました。 その後web系エンジニアになるべく、スタートアップへと転職しましたが、わずか1年足らずでまたSIerに戻ることを決意しました。 一見、キャリア的には失敗に見えるかもしれませんが、ITスキル面に留まらず、転職に対する向き合い方など、この期間に多くの学びを得ることができました。 失敗&それを乗り越えた成功体験、反省点等々・・・色んな角度で以下を読んでいただければ幸いです。 また、現在IT系のキャリアに携わっている方だけでなく、 SIer気になってるぞ!という方や、 プログラミングの勉強してエンジニアになるぞー!と奮起している方、 はたまた駆け出しエンジニアになってみたい!という方に対しても 少しでも新しい気づきを提供できればいいなと思っています。 なんで新卒でSIerに入ったのかSIerは「システム開発にまつわる全ての業務を引き受ける企業」と理解してい
React Nativeが発表されました。名前の通りReactでNative Appが書けるすごいやつです! 日付超えたのだけど試すくらい寝る前にやってみたいな、と思いまして! nodeとnpmの他にwatchmanが必要です。最初watchman入れてなくて、なんだこれはって感じだったんですけど、感動につながる重要なファクターなので迷わず入れましょう。注意点って書いたのはこのことです。これだけのことを注意点と大げさに書いてしまったわけです!(なんてことだ!) brew install watchman そして、インストールして、プロジェクト作成。 npm install -g react-native-cli react-native init ReactNativeSample 出来上がったReactNativeSample.xcodeprojをXcodeで開いてRunすればOK
技術広報を担当している外村(@hokaccha)です。 クックパッドでは毎年恒例となっているサマーインターンシップのうち「10 day 技術インターンシップ」を開催しました。今年は8月6日〜8月17日、8月27日〜9月7日という日程で二度開催し、たくさんの学生の方に参加していただきました。 今回の 10 day 技術インターンシップは、前半5日が講義パート、後半5日はOJTコースとPBLコースに分かれるという構成でした。OJTコースではクックパッドの現場に配属され、メンターの指導のもとサービス開発を実践してもらい、PBLコースではチーム開発でプロジェクトを運営していく手法について学びながら、サービス開発の実習に取り組んでもらいました。 前半パートでの講義について資料を公開いたします。 1日目: 基礎技術 初日はインターンで必要になる基礎的な知識の足並みを揃えるために、GitやRuby、Ja
これは Retty inc. Advent Calendar 2017 5日目の記事です.昨日は @shinichi-nakagawa-r の Webなエンジニアのための「Pythonデータラングリング」入門 でした. 始末 今年のはじめ,2月か3月くらいの頃のことです.Retty の Android 版に ReactNative を導入するかどうかが検討された時期がありました.プロトタイプの作成を経て導入の可否はある二人に委ねられることになりました.絶対に ReactNative 入れたいマンと絶対に ReactNative 入れたくないマンです.議論は当然のように平行線でした.双方の主張はそれぞれありましたが,だいたい View だけでなくロジックが記述できてしまう点と ReactNative で Android App らしい UI を組み立てるのが難しい点から来る,メンテナンスコス
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く