そんな今日この頃でして、、、

コード書いたり映画みたり。努力は苦手だから「楽しいこと」を探していきたい。

アマゾンの商品検索ページを直販のものに限定するブックマークレット

ブラックフライデーの時期で散財が捗りますね!(季節の挨拶)

amzn.to


僕はいつも物を買う時は製品の安心感や配送の迅速性の観点からできるだけ販売元がAmazonになっているものを選ぶようにしているのだけど、ここで問題なのが肝心の商品検索ページで販売元を限定するようなオプションが用意されていないこと。

商品名のそれっぽさやプライム配送の有無である程度は判別できるんだけど、あとは地道に開いては舌打ちして閉じ、別のを開いて・・・という流れになりがち。

Amazon側がそういうの用意してないんじゃしょうがないと諦めていたんだけど、先日ネットを徘徊していて検索結果ページのURLに&emi=AN1VRQENFRJN5を付与するとAmazon直販の結果だけを表示できるという情報を目にする。

続きを読む

『いまから始めるWebフロントエンド開発』感想

 久々に技術ネタ。

 これまでのキャリア的にも自己認識的にも僕の主戦場はサーバサイド開発だと思ってるんだけど、何の因果か最近はフロントエンドとGKE使ったインフラ周りという、バックエンドのプログラム”以外”の部分をいじっている。

 Web全般が興味の対象ではあるし、方向性として「ゆるふわジェネラリスト」を目指そうと思っているのでそれ自体には特に不満は無いというかむしろ良い機会だと思ってはいるけど、これまであまり本気で取り組んできたわけではないので現実的な問題としてフロントエンド開発の知識が絶対的に足りなかった。

 よく言われることだけど、フロントエンド開発まわりは移り変わりは激しい。ここ2・3年で大凡固まってきたとはいえ、横目で見ていた程度の人間がいきなり入っていくには厳しいように思えた。

 何が辛いって、ネットの記事なんかをググっても書かれた時期によって使ってるツールが全然違って参考にならなかったり、ドキュメントを読んでも個別のツールについては分かっても全体感が掴めなかったり・・・。

 そんなわけで良い感じに情報がまとまった書籍は無いかとAmazonを徘徊していて目にとまったのが今回の書籍。最近の出版ぽいし説明読む限りではぴったりだし適度に薄そう。Kindleのみでの出版というところにはやや警戒心も沸いたけど、十分に安いということで思い切って買ってみた。

いまから始めるWebフロントエンド開発

いまから始めるWebフロントエンド開発


 内容は簡潔に

  • ざっくりフロントエンド開発をとりまく現状確認
  • npm、browserify、babelを導入して開発環境を整える
  • express、react、reduxを使ってTODOリストを作成する

といった流れとなっている。

 順を追って「なぜ必要なのか」を解説しながらツールを設定していくので、「よく分かんないけどなんか上手くやってくれる」みたいな状況に陥らず、地に足がついた形で学べるのが良い。

 es6の文法はまどろっこしさが無くて良いし、ちゃんと使えばnpm-scriptsはすごく便利だ。UIをパーツで扱えるreactの有り難みもなるほどよく分かった。

 雑誌より詳しく、ガチな技術書ほど回りくどくなく、ネットの記事よりも体系的なのがちょうど良い感じだ。分量としては一冊の本にするには短いのだが、だからこそ小回りの効くKindleでの出版に向くようにも思う。


 今回は学習を進めるにあたってGitlabにリポジトリを立ててコードなり操作記録なりを保存してたのだけど、これは後で見返したりする上で非常に良かった。後知恵で言えば、開発環境構築もAnsibleで記述すればなお良かったかもしれない。学習をGitで管理するのは結構おすすめ。

f:id:blue1st:20170619125429p:plain:w600


 そんなこんなで学習したのだけれど、職場で使うことになったのはVue.js、Vuex、Webpackだったりするので、実のところ直接的にはそんなに役には立たなかった。ただ、それでも共通する部分は少なからずあるわけで、トレンドを把握しておいたことで理解しやすかったのは間違いない。

 こういう安価で良い意味で薄い技術書のスタイルも結構アリだなーと思った。

いまから始めるWebフロントエンド開発

いまから始めるWebフロントエンド開発



 ちなみにもう一つの「最近やってること」であるKubernetesとかGoogle Container Engineとかについてはもう一個のブログの方でちょいちょい書いてる。

blue1st-tech.hateblo.jp

Bitcoin市場の値動きをチェックするHubotスクリプト書いた

最近はslackチャンネル作って、自分専用のタイムラインとして活用してたりする。

todoリストや備忘録としてはもちろん、Hubotのボットを駐在させて対話的に仕事させて遊んだりしている。


そんなわけで最近作ったのが、Bitcoinの値動き監視するスクリプト。

github.com

まだ体裁整えたりnpmに登録したりしてないけども。

cronでの通知先ルームがgeneral決め打ちだったりね

続きを読む

最近気になった技術ネタ

ここのとこ忙しくて、興味あることもやりたいこともいっぱいあるんだが全然消化できてない・・・


OSの通知センターにRubyからメッセージを投げる

前回紹介したterminal-notifierには、Rubyから使えるterminal-notifier-guardというのがある。

github.com

そんなわけでRubyの勉強も兼ねて

あたりを使ってはてなブログの当日のアクセス数を取得して通知するツールを書いてみた。

github.com

で、ツール自体は一応予定通り動きはしたんだが一つ誤算。

OSXてデフォではcron動いてないんですな。

定期的にコマンド叩かせようと思ってたんだけど、正攻法でlaunchdを記述するにしろ無理やりcron動かすにしろ面倒くさそう。

そのうち定時実行の仕組みを内部に含む形に書き直そうと思う。


Disque

会社のツールではRedisをジョブキュー的に使ってたりもするんだけど、どうやらそのRedisの作者がまさにジョブキュー用のプロダクトを作成してるっぽい。

github.com

qiita.com

そのうち試してみたい。


Electron

Visual Studio Codeで使われていることでもお馴染みElectron

今のところ紹介記事をなぞって動かしてみた程度だけど、本業のウェブ系のスタイルでデスクトップアプリが開発できるのはそこはかとなくワクワク感ありますな。

electron.atom.io

qiita.com

プラットフォーム・ブラウザ間での差異を気にしないでも済むので、例えば管理画面なんかでも使い勝手良いんじゃないかって気がする。


サブドメインワイルドカード指定

新しいのを立ち上げるたびに/etc/hostsを追記するのは面倒くさいし、かといってプライベートでDNS立ち上げるのもなーと思っていたけど、そういえばこの手がありましたな。

qiita.com

クライアントの数が少ない分にはこれが一番楽かもしれん。


bacon.js

同僚におふざけでIQ145本を貰ったんだけど、関数型プログラミング以前に論理展開が飛躍しすぎてついていけないし文章的にも厳しいものを感じて放置気味・・・

本自体はアレなんだけど「じゃあ実際のところ関数型プログラムてどういうの?」という興味だけは沸いたりはする。

qiita.com

さて、そんな中でキーワードとして目についたのがbacon.js

www.publickey1.jp

iQ145本ではなんでわざわざ配列でインプットする必要があるのかビタイチ分からなかった(「クール」とか言われましても・・・)のだけど、↑のスライドでスッと理解できたw

機会見つけて使ってみたい。


Heroku Docker

Heroku | Introducing 'heroku docker:release': Build & Deploy Heroku Apps with Docker

Herokuの'docker:release'の動き | SOTA

HerokuでDockerが動かせようになるの!?と思ったらそういうことではなくて、どっちかというとHerokuの環境を手元で再現できてそのままデプロイできる(=デプロイしてみたら何故か動かないという事態を避けられる)という感じらしい。


YAPC::Asia 2015

yapcasia.org

出不精マンなんでこれまで勉強会とかイベント事には関わってこなかったけど、今年で最後ということで思い切って個人スポンサーチケット買ってみた。

8月が楽しみ。

phantomjs-nodeでスクレイピングしてみる

藤井太洋氏の小説『アンダーグラウンド・マーケット』を読んで興味を持ち、仮想通貨ってやつをちょっとかじってみようということでBtcboxに登録してみた先週。

blue1st.hateblo.jp

「儲けたいぜー」というよりは「ちょっと遊んでみよう」というスタンスではあるけれど、それでも手持ちのコインが値上がりすると少しワクワクしますな。

BTCボックス|ビットコイン取引所

ヘルプによるとAPIが用意されているらしく、確かにサンプルの通りに叩くとそれらしい値が返ってくるが、どうもBitcoinだけが対象でより単価の低いLitecoinやDogdecoinについては見当たらない。

サイトを確認するかぎりスクレイピング自体を禁止する規約は無さそうだった(拾った情報を使ったウェブアプリとかになると流石にNGぽい)ので、各コインの現在の状況を取得できるスクリプトを書いてみた。


使うもの

以前はCasperJSを使用していたものの、あれらはNodeとは独立して動く仕組みなため、取得してきたデータを活用するには「外部コマンドの形で呼んで戻り値として・・・」とか「ファイルを定期的に吐かせて・・・」とか何かしらの歪曲的な手段が必要になる。

blue1st.hateblo.jp


そんなわけで今回はNodeからPhantomJS使えるようにするブリッジphantomjs-nodeを使用してみた。

github.com


また、Hubotのスクリプトを書いていてフィーリングが悪くなかったCoffeescriptを使用してみた。


導入

PhantomJS自体とCoffeescriptをインストールした上でnpm install phantom cheerioで今回使用するphantomjs-nodeおよびcheerioをインストール


記述

githubのReadmeを参考にCoffeescriptで記述する。

btcboxの各種値をスクレイピングするスクリプト。


引数として指定されたコインの種類のURLをpage.openで開き、取得してきたhtmlタグをcheerioに食わせてスクレイピングする。

phantomJSの説明は割愛。(一番上で挙げたエントリの方に書いた)

cheerioはjQueryを再実装したもの(らしい)で、つまり使い慣れたセレクタでhtmlの要素を取得したりできる。

よってChromeディベロッパーツールなんかで欲しい部分のタグを調べてそれを記述してやればよいのだ。


使用法

例えばLitecoinについて取得したければ・・・

$ coffee btcbox.coffee ltc
opened btcbox-ltc? success
価格 ¥169
高値 ¥172
安値 ¥169
売気配値 ¥169
買気配値 ¥168
出来高 668.244

てな具合。


Coffeescriptなんで当然のごとくコンパイルしてJavascriptにもできる。

$ coffee -c btcbox.coffee
$ node btcbox.js doge
opened btcbox-doge? success
価格 ¥0.0144
高値 ¥0.0145
安値 ¥0.0144
売気配値 ¥0.0144
買気配値 ¥0.0125
出来高 17756

今回のスクリプトだけだと特に何をするでもないけど、例えばこれをcronで動かしてストレージに貯めて長期的な値動きをみるとか自動取引に使うとか、何かしらのメッセージにより自分への通知として流すだとか、Nodeなんでそれなりに使いようはあると思う。


Coffeescript最初は目が慣れずに戸惑ったけど、書いていってみればなかなか合理的な文法で面白いですな。

Javascriptのコールバック無間地獄がかなり見易く書き易くなる。

コンパイルされたJavasciptも人間が読める記述になっているのは好印象。

AltJSはそんなに気乗りしなくてやるとしてもDartかなーと思ってたけど、これはちょっと始めてみても良いかなって気がしてきた。

つくって覚えるCoffeeScript入門

つくって覚えるCoffeeScript入門


追記

と、ここまでやってきて、Githubに同じくbtcbox関連のプロジェクトを見つけて読んでみたら、何か普通にltcとかdogeとかも扱えそうな雰囲気。

もしやと思ってAPIの後ろにcoinパラメータ追加してみたら取れた!

https://www.btcbox.co.jp/api/v1/ticker/?coin=btc

https://www.btcbox.co.jp/api/v1/ticker/?coin=ltc

https://www.btcbox.co.jp/api/v1/ticker/?coin=doge

そういうのあるなら書いといてよー・・・

ヘルプ


まあそれはそれとして、Node&Coffeescriptでphantomjsを扱えたので、例えばHubot越しにページのスクリーンショットを取得するとか、もっと複雑なことをさせるとかできるわけだ。

応用は効きそうである。

今週気になった技術ネタ

Linuxサーバの情報を確認するコマンド

Linuxのシステムやハードウェア情報を取得するコマンドを集めてみた

個人的にはガリガリ新しいコードを書くよりはリファクタリングしたりチューニングしたり、あるいは新しいミドルウェアを導入したりする仕事が中心になってきたここ数ヶ月。

muninのグラフの推移を見守るのが基本だけれども、詳細を検討するにはやはり各サーバに入っていって個別に確認する必要はあったりする。

それにしても、そろそろSystemd系に慣れておかないといけない気がする。


にわかに情報が出てきたAngular2

qiita.com

色々な情報をみる限り無印Angularとは結構変わるみたいだから、感覚的にすぐに移行できるとは思わない方が良さそうですな。

paiza.hatenablog.com

最近のJS界隈でもう一つ見逃せないトレンドとして仮想DOMがあるけれど、聞いた話ではAngular2にもそれに近い発想があるらしいのが気になるところ。

React.jsの評判の良さは気になるけれど、どうにも仮想DOMって発想にまどろっこしさを感じてしまって手を出すのに躊躇してしまっている現状なのだが、これが天下のAngularがやるなら無視するわけにもいくまい。


ナレッジ共有システムLodge

lodge/lodge · GitHub

身も蓋もない説明をするとQiita::Teamのクローン。

最近うちの部署でも試しに使い始めてみた。

Wikiでいいじゃんとかそういう反対意見もあったんだけど、個人的にはWikiってみんな好き勝手に書いた挙句とっちらかってしまう印象が強くて、それだったらブログ的に皆が流し見できる方が良いかなーと思っている。

というか↓のツイートが大体代弁してくれてる感ある。

全文検索できないとかデザインがイケてないとかそれなりに不満もあるけれど、Markdownでちゃっちゃと書けてなかなか快適。

とりあえず進捗報告用って名目で皆に利用してもらいつつ、色々な記事を投稿して僕なりに有用性をアピールしていってる感じ。

あとはIRCなりメールなりに更新流せれば良いなーなんて思ったりもする。


Lodgeに限らずRails製アプリ全般なんだけど、ポート転送で動かしてると初回接続時にやたらと遅かったので↓のソケット使う記述に変えたら劇的に改善された!

Redmine を nginx + Unicorn で動かしてみる | cocoa*life