2018年4月11日水曜日

reactjsでes6で作ったnpmパッケージはimportできないので要注意的なお話

  • このエントリーをはてなブックマークに追加

タイトル通り。
React Nativeだとそんなことないような気がするんだけど、reactjsだとダメっていう。
class propertiesとかそういうところとかで引っかかる。
ちなみにnpmパッケージじゃなくて自分でes6のcomponentを作ってimportをしたときはbabelの設定をちゃんとしていればOK的な。

とりあえず理由はわからないわけではないんだけど、面倒なので、今日はちゃんとnpm publishする前に確認をしよう的なお話をば。

2018年4月3日火曜日

golangでURL画像のwidthとheightを知りたい的なお話

  • このエントリーをはてなブックマークに追加

たまにそういうときがあってもおかしくないかと。
ということで今日はこういう感じでいけばいいらしいというお話をば。

2018年3月30日金曜日

React16.3.0のざっくりまとめ的なお話

  • このエントリーをはてなブックマークに追加

発表されたので自分用に簡単なまとめ。

2018年3月23日金曜日

electron + parcel + react + react-router-dom + node-sass + reduxなボイラープレートを作った的なお話

  • このエントリーをはてなブックマークに追加

最近管理画面を作るにしても公開する必要ってあるんだっけ?みたいな感じに思ってて。
特に自分たちしか見ることがないのであればわざわざwebで公開する必要ないよね的な。
ってことでMacアプリ作っちゃえばいいじゃん的な。
そうなるとswiftで書いても面倒だしな…ってことでelectronを使うことに。
特に最近React Nativeばかり書いているからかなりモダンな記法ばかりやってたのもあり、
それにwebpackで設定書くのも面倒だなぁと思ってparcelを使おうかと。

ってことでと今日はparcel使いつつのelectronでbabelもりもりなお話をば。

2018年3月3日土曜日

expoでQRコードのデコードをdetachしてreact-native linkせずに行うためのコンポーネントを公開した的なお話

  • このエントリーをはてなブックマークに追加

QRコードをデコードしたいときってあるわけで。
Expoにしても何にしてもカメラでQRコードを読み取ってデコードするっていうのは標準で搭載されているんだけど、
スクショした画像とかQRコードの画像からデコードをするというライブラリは少ないわけで。
さらにいうとそれらって結局のところreact-native linkする必要とかあったりで、NativeModulesで書かれてることが多い。
となるとExpoで使えないから困るよねっていうことになるわけで。

なのでdetachしたりとかExpoを諦める必要のないQRデコードライブラリを作りました的な。
ということで今回はそのライブラリを作るに当たってかなり疲労した部分があるのでそれについてのお話をば。

2018年2月9日金曜日

react-navigationでページ毎にtabの背景色とかactiveTintColorを変えたい的なお話

  • このエントリーをはてなブックマークに追加

React Nativeで公式推奨されているreact-navigationを使って開発しているんだけれども、
困ったことにreact-navigationで微妙に欲しい機能がなかったりする。
そのうちの一つがtabStyleのOverrideというか上書きというかなんというか。

各ScreenのnavigationOptionsでtabBarOptionsも上書きできればいいんだけどできないわけで。
ってことで今回はtabBarの設定をscreen毎に変更する的なお話をば。

2018年2月1日木曜日

Elastic Beanstalkで動画処理をするためのffmpegをインストールするには的なお話

  • このエントリーをはてなブックマークに追加

アプリとかを作っていて、動画を処理したいときってあるかと。
もちろんスマホ内で処理できたりもするけど、
サーバにアップをすることで動画の長さを担保したいとか、全部mp4に統一したいとかその他諸々とか。

そういったときに使うべきなのがffmpegではあるんだけど、これのインストールはなかなか面倒。
ただstaticビルドされたものを使えばちょちょっとやってあげるだけで簡単にインストールできるので、
今日はstaticビルドされたffmpegをelastic beanstalkでデプロイする時にインストールしちゃおう的なお話をば。

2017年11月15日水曜日

componentWillMount()みたいなオリジナルイベントをcomponentに持たせるにはHOC使うと便利的なお話

  • このエントリーをはてなブックマークに追加

ReactとかReact Nativeで開発をしているときに、同じメソッドを書いて云々とかあるわけで。
そんなときにはHOC(Higher Order Components)を使うと大体解決するわけで。
簡単な例としてはどのページにもローディングを導入したいみたいな。
もちろんcomponentWillMountとcomponentDidMountでつらつら書けばいいけど、
それを全componentに適用するとなると骨が折れるんだけど、HOC使えば一発的な。
アニメーションの中身を変えたいときも楽ちん的な。

さらにそれだけではなく、500msたったら各component内のとあることをしていきたいとかあるかもしれない。
けどHOCで処理をやっているので、各component毎に調整するのは面倒だったりするわけで。
そういうときに各component内にwillMountみたいなイベントハンドラが作れると、
HOCで定めたタイミングで各component内で任意のタイミングでとあることができるようになるわけで。

ってなわけで前置きが長くなったけど、今日はHOCを使うかつwillMountみたいなものを作るには的なお話をば。

2017年11月8日水曜日

react nativeでKeyboard.dismissを常に行うために、ScrollViewを使う的なお話

  • このエントリーをはてなブックマークに追加

Keyboardの管理って地味に面倒なやつで。
画面領域をタップしたら見えないようにしたいとかそういう感じではあるんだけど、
普通はKeyboard.dismiss()を叩かないといけないわけで。
となるとそもそものWrapperとしてTouchabelWithoutFeedbackを使ってごにょごにょしようとすると、
そっちのタッチイベントが優先されてScrollViewとかFlatListがスクロールできなくなるっていう。

ってなわけで今日はそんなことをせずに画面をタップしてKeyboardを消すには的なお話をば。

2017年9月29日金曜日

expoでdetachしてXcodeとかAndroid Studioとかでビルドしてみたりするには的なお話。

  • このエントリーをはてなブックマークに追加

一般的にreact nativeで開発をしていると、
iosとかandroidとかっていうフォルダがあってそれぞれの中にネイティブのコードがあったりするんだけど。
expoは煩わしいことを無くしてくれる優秀なやつだから、そういったものも全て吸収してなかったりする。
けど既存のアプリをreact nativeで書き直すとかの場合だと、各moduleをいかしつつブリッジしつつで開発をしたい場合もあって通常のreact nativeに戻したいときもある。

というわけで今日はdetachしてXcodeだったりAndroid Studioでビルドするまで的なお話をば。

Adsense