taiki-t's diary

React Native, Rails そして雑多な記録: The world is waiting for you to give it a meaning.

2017-01-01から1年間の記事一覧

曲作り ゲームの町っぽいの

昔作ってあったやつ 昔のゲームの町っぽいやつ作りたいなーと思って作った。 最後のところ、和音全部入れてるけど1個抜かしてもいいんじゃないかなーって思ってる。どうだろう。 www.youtube.com

Elmについて少し調べた

Elmのドキュメント冒頭から俺の脳内で型エラーが起きそう> Elm is a functional language that compiles to JavaScript. It competes with projects like React as a tool for creating websites and web apps.https://t.co/icz36FfdHeなんで言語がReactと比…

generic な connection fragment をRelay Modernで書きたいメモ

複数の親要素が、共通の子要素をもち、その子要素がconnectionな時にfragmentを共通化する方法が知りたい。 よくわからないのでメモ。 この方法でやろうとしたけどエラー出るよね: Spread fragment through Connection · Issue #1983 · facebook/relay · Git…

Install Bulma to Rails 5.1

in terminal yarn add bulma in app/assets/stylesheets/application.scss @import "bulma/bulma" That's it. Restart the server as needed. May apply to other css frameworks. bulma.io

Implement a simple caching for Relay Modern.

update - 2017/11/07: Consulting official docs may make you even happier: Add Caching docs by felippepuhle · Pull Request #2121 · facebook/relay · GitHub. It's not merged by now. Unlike Relay Classic, Relay Modern doesn't come with an autom…

Relay Modernに移行した

今作ってるアプリ、Lylica - 街のおすすめが分かるSNSをRelay ClassicからRelay Modernに移行した。 動機 今後機能を追加していくにあたり、今のうちにえいやとやっておきたかったからだ(とある機能の追加に腰が重かったから先にこっちに着手したというのは…

メモ: ファイル名をキャメルケースにするRubyワンライナー

Relay Modern compatモードで動かしてるんだけど、fragment名についてcomplierではファイル名に依存してて、runtime(?)ではコンポーネント名に依存してる… snake caseとcamel caseにしてるからファイル名変えないと…— taiki- (@taiki__t) 2017年8月9日 とい…

技術コミュニケーションでは「良いと思うので」に理由を添えて生産性を高めよう

「こちらの方が良いと思うのでこうします!」 「これはあんまりよくないと思うので」 というやり取りはよくある。自分も気を抜くとやってしまう。 これは暗黙的に「良い」の概念が共有されていると思いやってしまいがちだが、必ずしも共有されているわけでは…

ターミナルでgit grep して一括置換するコマンド

$ git grep -l 'search word' | xargs sed -i '' -e 's/search word/replacing word/g' こんな感じ。 search word, replacing wordはそれぞれgrepする語、置換後の語を指定。 git grep -lで対象の語が含まれるファイル一覧を取得、 | xargsでそれを sedコマ…

React Native Tab View with default index to 1

When Using React Native Tav View with defalut index to 1, I happened to face a strange behaviour; automatically swipes to index 0 sometimes when opening the scene. So what I did was to set initialLayout and it fixed it. Like this: const in…

React Nativeで画像のトリミング(cropping)

React Nativeで画像のトリミングができる。特に外部のコンポーネントを入れる必要はない。 標準の ImageEditor を使ってできる。 しかしながらいかんせんドキュメントが少ないのでここに記録も兼ねて残そうと思う。 ※ 記事執筆時に使用したReact Nativeのバ…

heroku で定期dbバックアップ

$ heroku pg:backups:schedule DATABASE_URL --at '02:00 Asia/Tokyo' --app your_app_name これだけだった。簡単 devcenter.heroku.com TimeZoneの表記はここから https://en.wikipedia.org/wiki/List_of_tz_database_time_zones

React NativeのImageを使うときの注意

React Native のImageを使うときの注意 とりあえずImage要素にサイズ(widthとheight)は指定する。じゃないと表示されない。 バージョン: 0.44.0 追記: 2017/07/07: 0.47.0以降のバージョンでこの制約は消えそう。Using <Image> with nested content now causes warn</image>…

React Native のTouchableなんとか使うときの注意

TouchableWithoutFeedbackとか使うとき、 とりあえず内部の要素はTextだろうがImageだろうがViewでラップしておくのが無難。 余計なハマりポイントを回避できる。 バージョン: 0.44.0

Lylicaというサービスをリリースした。

Lylica (りりか) というサービスをリリースした。iOSアプリで。 Lylica - 街のおすすめが分かるSNSを App Store で 「世界をもっとダイナミックにしたい」 そう思って作ってきた。きっかけは、昨年(2016)に翻訳書1を出版したことに遡る。 昼間は会社、夜は翻…

メモ:React Native で e2eテストできそうな detox

https://github.com/wix/detox これ使えそうと思ったけど、Permission用Alert周りの処理で詰んだ。 工夫すればできそうだけどまた後ほどtryする。 導入自体はすごく簡単だった。 このIssueがcloseする頃にはそこらへんいい感じになってるのではと期待: githu…

react-devtoolsをReact Nativeで使う

React Nativeで開発でのデバッグにはNuclideを使っていたけど、react-devtoolsも使える。 インストール方 グローバルにインストールする場合 npm install -g react-devtools これでreact-devtoolsとterminalでやれば走る。 プロジェクトにインストールする場…

Mark Zuckerberg's Commencement address at Harvard

www.youtube.com What I thought listening to this is: “It’s not the world that gives you the meaning, the world is waiting for you to give it the meaning.”

GraphQL Mutation

Relay使ってての話なんだけど Mutationはできる限り単一責任にした方が、のちのユースケース変更時にコスト低そう リソースに対する状態変更は、Mutation名を動詞にしてidだけ送るとクライアントとサーバー側を疎結合にできて良さそう UpdatePostStateMutati…

はてなブログthemeのevergreenにサイドバーをつけた

つけたかったので #container { width: 1200px; } #container-inner { min-width: 1200px; } #main { float: left; max-width: 780px; margin: 0 auto; } こんな感じ。適当にやったらできたのでよかった。 まあ正確にはつけたというよりフッターを移動した、…

メモ: puma on heroku, worker と thread

web serverとしてpumaを用い、Railsアプリケーションをherokuで運用するにあたり workerやthreadという話が出てきたのでメモ。 ネタ元は: Deploying Rails Applications with the Puma Web Server | Heroku Dev Center Workers Workerとは pumaの文脈でいうw…

メモ: React Navigation を使い始める時に確認すると良さそうなこと (v1.0.0-beta.10時点)

Release v1.0.0-beta.10 · react-community/react-navigation · GitHub React Navigation V1.0.0-beta.10が出た。そう、React Navigationはまだbetaが取れてない。 使い始める前に現状どんな問題があるか確認しておくと時間を節約できると思う。 どこを確認…

Relay Modern rewriteについてのメモ

We still had that long backlog of ideas, but we knew that we were adding to the tail of the queue faster than we were shifting from the head of it. It was a scary prospect, but we came to the conclusion that it was time to burn it all down…

運がいいとか悪いとか

よく運気をあげるとかいう話を聞く。運をよくすれば物事がうまくいくとか。ただそれだけを聞くと眉唾というか実態のない怪しいものを崇めるような雰囲気が漂う。 運気をあげるために日頃の行いをよくしなさい、的な。 これ、運気っていうとよくわからないけ…

Sketch3 グラデーションでぼかす

かなり前にこんな記事を書いた taiki-t.hatenablog.com グラデーションでぼかす方法はまた今度紹介するなどと言いつつずっと書いてなかったので手軽に手順だけまとめておこうと思う。 四角を二つ重ねてかく。一つ書いて⌘ + Dすれば楽だろうか。 その二つの四…

西日暮里.rb 36回目「Electronではじめるアプリ開発」発売記念 LT 大会!」の記録

nishinipporirb.doorkeeper.jp 参加してきた。というか主催者の一人w 今回はオーガナイザーの一人であるじょうさん (@joe_re) が本↓を執筆したので記念LT会をした。 gihyo.jp テーマは自由。けれど本がElectronということもあり、かなーりfrontよりのLT会だ…

Relay Modernへの移行検討をした

結論: もう少しドキュメントとサンプルが増えてからにしよう(rcが外れる頃かな?) 追記: 2017/08/21: 移行しました: Relay Modernに移行した - taiki-t's diary 背景 現在アプリを作っていて、フロント側の構成はReact Native + Relay + Reduxという感じだ…

Grammarly cm の曲

Youtubeで流れていいなと思った Soul City の Here I come というやつらしい ↓ みたCM www.youtube.com 調べてみるとMarmosetという音楽出版社で配信している。映像に合わせるBGM向けのライセンス提供が主な業態らしい。個人で試聴するぶんには無料でダウン…

React Navigationにコントリビュートした

React Navigation, APIはいい感じなんだけど現状beta版ということもあり、プロダクションで使っていこうと思うとなかなか機能が足りない。 それで2017/4/7現在では、v1リリースに向けて最低限必要な機能を実装していこうという状態にある。(と信じている) …

おーい磯野〜 callback使ってる関数をPromiseでラップしてasync/awaitで書こうぜ〜

JS

例1 const sleep = (ms) => { return new Promise(resolve => setTimeout(resolve, ms)); } const something = async () => { await sleep(100) doSomething() } 例2 Geolocation.getCurrentPosition() - Web API インターフェイス | MDN から // 元メソッド…