GoogleHomeが安くなってたので勢いで購入 半額だったから買ってきた pic.twitter.com/MLMP4PiBHA— .あーる@生活改善 (@DotEarl) 2017年12月7日 まずやりたくなるのは家電の操作 「OK Google テレビをつけて！」「エアコンを消して！」とかやりたい 調べてみ…

この記事は React Native Advent Calendar 2017 16日目です。 こんにちは。Webエンジニアの@DotEarlです。 Togetterという会社で、自社アプリをReactNativeで開発しています。 目次 目次 モチベーション igniteとは igniteでプロジェクトを始める時 自分用の…

storybookはコンポーネント単位でサンドボックス開発できる開発環境 どんなコンポーネントが存在するか、どんな種類があるか、使い方は？など ドキュメントとしても機能するのであると便利 最近Webの方でよく使われてるようで、ReactNativeでも使える 導入 …

仕事でいきなりredux/redux-saga さらに redux-actions の環境を触ってきて ミドルウェアを使わないシンプルな構成のreduxの理解が浅かったのでちゃんと覚えようと思った 環境構築 お手軽 create-react-app github.com $ create-react-app react-redux-examp…

react-native init appでアプリを始めても最初はreduxやmiddlewareなど いつも決まって使うような環境は入っていない とりあえず試したいけど面倒くさいよ！って時はigniteコマンドを使うと 定番の環境、いわゆるボイラープレートをいい感じに構築してくれる…

前回の記事で導入したReact Native Debuggerを使うと AsyncStorageを直接操作することが出来る rskull.hateblo.jp AsyncStorageとは アプリ本体にデータを保存したい時に使えるkey-valueストア 永続化されるのでアプリを落としてもデータが保持される 実際に…

React Nativeで開発をする際 redux を使用することが多いと思う そんな時に使うと開発が捗るのが React Native Debugger インストール github.com $ brew update && brew cask install react-native-debugger インストールが完了すると、アプリ一覧にアイコ…

資料まとめです セッション情報 | HTML5 Conference . . . .

前にこんな記事を書いたが Androidでは動かなくて調べた rskull.hateblo.jp import { UIManager } from 'react-native'; constructor() { super() UIManager.setLayoutAnimationEnabledExperimental && UIManager.setLayoutAnimationEnabledExperimental(tru…

ReactNativeでスタイルを書きやすくしてくれるライブラリがある styled-comopnentsはスター数が１万を超えの人気ライブラリ 主にウェブの方で使われてるがReactNativeにも対応してるっぽい glamorous-nativeは後発でstyled-componentsなどに影響を受けて出て…

仕事でもずっとReaectNativeばかりで、まじめにフロント書いてないので 勉強がてらポートフォリオサイト作り直した http://rskull.com/#/works 環境構築 $ yarn add react react-dom react-router-dom styled-components Webpack + Babel 関連 $ yarn add we…

FabricのCrashlyticsを使ってユーザーがクラッシュした時のログを収集できる 収集したログからバグってる箇所を特定する方法の一つとしてメモ クラッシュレポートから探る Fabricの管理画面を開いてクラッシュレポートを見ると、こんな報告があった undefine…

Detoxというライブラリを使ってE2Eテストを書いてみる github.com 前提 Mac brew xCode 8.2以上 node 7.2以上 準備 シミュレーターを動かすのに必要なのでインストールする $ brew tap facebook/fb $ export CODE_SIGNING_REQUIRED=NO && brew install fbsim…

メモ $ react-native init App --version v0.46.0 運用してるプロジェクトで入れたモジュールがうまく動いてない時 同じバージョンの新規プロジェクトを作って一番素の状態で想定通り動くかテストしたい時に使う わりと最終手段だけど、問題の切り分けできて…

64K問題 ReactNativeに限った話ではないが Androidアプリでメソッド数が65536を超えるとビルドエラーになる問題のこと Androidエンジニアにとっては常識だと思うが、Webから入った人間からすると結構厄介だった 検索すると沢山ヒットする 分かりやすかった記…

検索したツイートを定期的にSlackに投稿はIFFFTで出来るけど、Chatworkに投稿はZapierという類似サービスくらいしかなかった 一月の制限が割りときつくて途中で止まっちゃので Goの勉強がてら自分で作った github.com まだ作法も全然わからないし まだテスト…

この前書いたActionSheetの記事書いたけど、特定の状況下だと使えないじゃん！ってなることに気づいた rskull.hateblo.jp 駄目だった理由 iOSはネイティブの機能を使ってるのでどこで呼び出しても起動するけど Androidはネイティブの機能ではなく、モーダル…

ActionSheetとは？ この下から出てきてるやつ RN本体でサポートしてくれてはいるが、iOSの標準機能なので iOS用のコンポーネントになってる。 ActionSheetIOS うーん…同じコードで両方対応したいですね… react-native-action-sheet そんなときはコレ github.…

タイトルの通り。 開発ビルドとリリースビルドの証明書がうまいこと設定できない問題はよくあるみたい。 いくつかハマった点をメモする 中間証明書がなかった 【注意】Apple Worldwide Developer Relations中間証明書の期限切れ - Qiita まずはAppleから中間…

アプリ Chrome Xcode Alfred3 Visual Studio Code Slack TweetDeck Google日本語入力 iTerm version3 Docker for Mac Sequel Pro GIT Brewery3 ターミナル 環境構築 $ curl -sS rskull.com/rc/install | sh デフォルトのシェルを変更 $ chsh -s /bin/zsh rbe…

ReactNativeで LayoutAnimation を使うと、要素が消えたり表示したりする時に 勝手にいい感じのアニメーションを付けてくれるから便利 import { LayoutAnimation, } from 'react-native'; ボタンを押すとメニューが出てくる仕様があったとして、それにアニメ…

この先も生き残れるエンジニアになるにはアウトプットを…みたいな記事に毎回脅迫されるから何かしら書いていこうと思い立った。緑のサイトは見るけど書くのは気が乗らないからブログにする。学生の頃のほうがアウトプットしてたんだけど新卒で入った会社に忙…