kitak's blog

Kみたいなエンジニアになりたいブログ

Puppeteer でページを自動操作するスクリプトを書く時に使うスニペット

画面が複数あったり、フォームの項目が多い場合に毎回最初から実行して試行錯誤するのは大変。以下のようなスニペットで、 REPL 環境を用意することで、DevTools でセレクタを調べたり、ひとつひとつの操作の挙動を確かめつつ、スクリプトにコードを書き足し…

Nuxt.js で Vuex の結合テストを書く方法を考えた

この間、友人と焼き肉を食べていて、「Nuxt.js で Vuex の結合テスト書くのどうやってますか?」という話になったので、考えてみました。 Vuex の結合テストの定義 この記事では、アクションやミューテーション単体ではなく、 アクションをディスパッチした…

最近読んだ漫画

神々の山嶺 1 (ヤングジャンプコミックスDIGITAL)作者: 夢枕獏,谷口ジロー出版社/メーカー: 集英社発売日: 2015/06/01メディア: Kindle版この商品を含むブログを見る とあるカメラを巡って、一匹狼の登山家と彼を追うジャーナリストが話を動かしていく。 谷…

Rails + Hypernova なアプリを Heroku にデプロイする

個人メモ Heroku Container Registry で Rails アプリをデプロイするときにハマったこと - kitak blog Hypernova で Vue.js のコンポーネントを Rails でレンダリングする - kitak blog の続き。 Rails + Hypernova で作った趣味アプリをデプロイすることに…

悪習を繰り返そうとしたときにフフッと笑う

最近、試しているやつ。何かの本か記事で読んだ気がするのだけど、思い出せない。 タイトルの通りなのだけど、自分が悪い習慣をおこなおうとしたときにフフッと笑うようにすると、その行動を抑制できる(ような気がする)。 例えば、自分の場合だと数分おき…

Heroku Container Registry で Rails アプリをデプロイするときにハマったこと

個人用メモ。 久しぶりに Heroku を触ったら、Dockerfile のコマンドに一部制限はあるものの手元で作ったイメージを動かすことができるようになっているらしく、おお、となった。buildpack を扱うのを避け続けてきた人生でした。 Hypernova の検証のために、…

Hypernova で Vue.js のコンポーネントを Rails でレンダリングする

個人メモ。 Rearchitecting Wantedly's Frontend | Wantedly Engineer Blog の記事を読んで、副業先でも使えるかもと思い、Hypernova を触っていた。 Hypernova を使う個人的なモチベーション リリースまで至った、それなりの規模の SPA ではないブラウザナ…

nuxt-community/typescript-template から生成したプロジェクトに express の API server を組み込む

個人メモ。 GitHub - nuxt-community/typescript-template: Typescript starter with Nuxt.js から生成したプロジェクトで色々開発をしていて、途中で JSON を返す API Server を組み込みたくなった(別リポジトリにしたり、実行環境を分けるのも面倒だった)…

認知的不協和を活用して、気が散るのを防ぐ

ここ数週間、職場で試してみて、良かったやつ。 自分はコーディングや文章を書いていると次々と関係のない考えが頭に浮かんでくる。要は気が散りやすい。気がついたら、本来集中しなければいけないことと別のことに本気を出していたりする。 最近はA4サイズ…

AWS Lambda で Cloud Firestore を使う

Webpack を利用した複数の Lambda 関数の管理 - kitak blog の続きで色々やっていました。 Cloud Firestore を Lambda から使おうとしたんですが、バンドルファイルを実行したらエラーに。grpc まわりでネイティブモジュールのビルドが必要で、firebase-admi…

昭和天皇物語2を読んだ

読んだ。 昭和天皇物語 2 (ビッグコミックス)作者: 能條純一,永福一成,半藤一利出版社/メーカー: 小学館発売日: 2018/03/30メディア: コミックこの商品を含むブログを見る 昭和天皇のお妃選び 下記の藩閥政治の話と絡むのだけど、妃選びが政争の具になるのを…

Webpack を利用した複数の Lambda 関数の管理

こんなかんじでやってみたらどうでしょ、という話。 AWS Lambda を中心にいわゆるサーバーレスのアプリケーションを構築するには、複数の Lambda 関数を作成することになります。 普通のウェブアプリケーションであれば、ひとつのリポジトリでコードを管理し…

API Gateway カスタムオーソライザーを使って、Firebase で認証する

組み合わせただけの話なのですが、個人用メモ。 ちょっと前に「AWSによるサーバーレスアーキテクチャ」を読んだり、手元で色々試してました。本では、認証に Auth0 というサービスを使っているんですが、本が書かれた頃から Auth0 の仕様が大きく変わってい…

ハリー・ディーン・スタントン主演 ラッキーを観た

渋谷のアップリンクで観た。 eiga.com 主役のラッキーを演じるのは、去年の7月に91歳で亡くなった名優ハリー・ディーン・スタントン。この作品は彼の最後の主演作である。 自分がハリー・ディーン・スタントンを知ったのは、ツイン・ピークスの劇場版だった…

Vue コンポーネントをクライアントサイドでテンプレートエンジンとして使う

Vue

forum.vuejs.org に回答したやつ。 コンポーネントを描画した結果の HTML 文字列を取得したいときってあるの?とか思われそうなんですが、たまにあるんですよね(ウィンドウポップアップでプレビューを静的なHTMLで表示する必要があったり、v-html で表示す…

SNS を絶つために StayFocusd っていう Chrome 拡張を使い始めた

これ chrome.google.com 気がついたら、すぐにアドレスバーに「twitter」と入力するので、SNS 中毒を治すために StayFocusd という Chrome 拡張を使い始めた。 指定したドメインの1日あたりのトータル閲覧時間を設定できる。時間を超えたら「仕事してんじゃ…

13デイズを観た

WOWOW で放送してたので作業しながら観た。 13デイズ [Blu-ray]出版社/メーカー: ギャガ発売日: 2017/12/02メディア: Blu-rayこの商品を含むブログを見る 小学生の頃、金曜ロードショーでやってたのを一度観たんだけど、政治的な駆け引きが当時の自分には難…

WebComponent を Vue コンポーネントツリーの末端として使う

JSフレームワークの末端がWebComponentsになるのか、なれるのか、検証してみた - Qiita の記事を読んで、Vue だとどうなるかな、と思って軽く検証した。自分の手に馴染んているのが Vue というだけの理由で、決して React dis ではないです( React は React …

マネー・ショート を観た

観た。 マネー・ショート 華麗なる大逆転 [Blu-ray]出版社/メーカー: パラマウント発売日: 2017/02/08メディア: Blu-rayこの商品を含むブログ (1件) を見る サブプライム住宅ローン危機の発生を予測し、事前に空売り(実際は空売りではないんだけど)するこ…

デヴィッド・リンチ:アートライフ を観た

観た。 映画『デヴィッド・リンチ:アートライフ』公式サイト 不気味で、得体の知れないデヴィッド・リンチの発想はどこから生まれるのか。彼の生い立ちや絵の創作活動を通して探る作品。 彼が語る過去のエピソードに合わせて、彼の版画作品が映される。幼い…

Vue.js で特定のプロパティを変更の追跡の対象外にする

きっかけ とある案件で、とあるサードパーティの SDK を利用していた。その SDK が提供するコンストラクタから生成したインスタンスを Vue.js のインスタンスのデータとして扱おうとしたら、Security Error のような例外が投げられて困った。 (回避するため…

個人サイトを nuxt で書き換え、netlify で公開するようにした

追記: 2018/03/28 唯一イケてなかったのは、netlify のビルドタスクを実行する環境の Node のバージョンが古いこと。async/await が使えず、プリレンダリングに失敗してしまった。これは、しょうがないので、dist もバージョン管理対象にした。 NODE_VERSION…

アレハンドロ・ホドロフスキー監督 エンドレス・ポエトリーを見た

見た。アレハンドロ・ホドロフスキー監督の自叙伝的小説「リアリティのダンス」の映画の続編。 www.youtube.com 臨死体験のような自叙伝 この映画を見て、ホドロフスキー監督が死ぬ前に臨死体験として見る映像はこのようなものなのではないか、という気がし…

Node.js で Request Local なコンテキストを Zone.js で作る (2)

前回の続き Node.js で Request Local なコンテキストを Zone.js で作る - kitak blog 本当に Request Local になってるのかなーと思って、以下のようなコードを書いて、ab (ab -n 1000 -c 100) にかけて確かめた。 import * as express from 'express'; imp…

Vue.js の mixin を作る時に意識していること

これは Vue.js #3 Advent Calendar 2017 - Qiita の18日目の記事です。 Vue.js には、mixin という機能をコンポーネント間で再利用するための仕組みがあります。 今日は自分が mixin を作成する際に意識していること、気をつけていることを紹介しようと思い…

Node.js で Request Local なコンテキストを Zone.js で作る

Request Local なコンテキストが欲しい理由 例えば、Request 毎に id を生成して、その id をログに書き出す内容に含めたい。こうすれば、障害や不具合の調査の際に、Request 単位で起きた事象の把握が容易になる。 Node.js での難しさ ログを出力する箇所が…

ロジ・コミックスとラッセル幸福論

最近の100分de名著でバートランド・ラッセルの幸福論を取り上げているので読んでいる。という話を友人にしたら、「ラッセルといえば、ロジ・コミックスのイメージだった」という話を聞いたので、合わせて読んでみた。 ラッセルの幸福論はラッセルが50代の頃…

MobX の runInAction とは

故あって、React + MobX なプログラムを読んでいたら、 runInAction(() => { this.state = "done"; }); といった runInAction の呼び出しを多く見かけて、なんだろこれ、と思ったのでメモ。MobX 1日目で変なこと書いているかもしれません。 Writing async ac…

getUserMedia でバックカメラを要求する

Andoid Chrome で動くQRコード・バーコードを読み取るアプリを書いていて知った。 navigator.mediaDevices.getUserMedia でカメラを要求すると、デフォルトではフロントのカメラになるのだけど、以下のようにすることでバックカメラを要求することができる。…

THE INCAL を読んだ

読んだ。 DUNE で出会ったアレハンドロ・ホドロフスキーとメビウスが再びタッグを組んで作ったフレンチSFコミック。 街の一角のありふれた場面からビッグバンのように爆発して、宇宙を覆い尽くさんばかりに物語が膨らんでいく。読んでいて圧倒される作品。 …