Windows が生成する EFI System Partition (ESP) を拡張する ということをしたくなることがあるかと思います。具体的には

1. Windows が入ってたところにマルチブートで Linux 入れたい
2. Windows が生成した ESP を boot として使いまわしたい
3. しかし Windows が生成した ESP は 100MB しかないのでカーネルが複数入らない
   • Linux 用に ESP 別途生成すればいいんですかね? ESP mutiple とかで検索しても「ESP を複数作る必要はない、使い回せ」みたいなことばっか書かれていて辛い

というような状況。

• How to enlarge Windows 10 EFI partition

という Q&A を読むと、 MiniTool Partition Wizard Free を使うとよいであろう、とあります。これで実際に希望の要件を達成することができましたが、若干面倒な操作が必要でした。

Windows を何も考えずにインストールすると

• ESP :100MB
• Microsoft Reserved (MSR): 16MB
• C:

の 3 個が生成されることが知られています。で、この MSR がなんなのか俺は知らないし知ろうとも思っていないのだがとにかく消してはいかんらしい。

MiniTool Partition Wizard Free では C: を縮小して後ろにつめることもできますし、 ESP を拡張することもできるのですが、 MSR を処理することは一見できないように見えます。

そこで Google に聞くと

• Move MSR partition?

What you can do is to Copy the MSR partition to an unallocated space block

とあるので信じます。すなわち MiniTool Partition Wizard Free 上で

1. C: を縮小して後ろにずらす
2. MSR を後ろにコピーする形でずらす
3. もとの MSR を削除する；
4. ESP を空いた部分に拡張する

という操作を予約し、適用します。すると期待どおりに ESP が拡張されますし、 MSR をこのように移動させても Windows の挙動に問題はないようです。ようですと書いたのはこの操作をしてからまだ 10 時間程度しか経過していないために副作用があるかどうかを知らないからです。

とにかくこれで Windows が生成した ESP を拡張して /boot に沢山のカーネルを入れることができて便利になりました、よかったですね。

CircleCI (Performance Plan) vs. Github Actions

結論: CircleCI を買おう

現在ユビレジでは CI は CircleCI (Performance Plan)と TravisCI を使っていて、

• CircleCI:
  • サーバーサイド(いろんな言語がある)
  • Web フロントエンド(Rails アプリのなかで webpack が動いていたり、 create-react-app で作られたペラっとしたものがあったりいろいろある)
• TravisCI:
  • iOS アプリ

というような感じで使い分けている。 Performance Plan なんだから iOS のも Travis から引っ越せばいいんじゃねえの?と思わんでもないのだが、

• Travis の annual 課金がまだ残ってる
• iOS の CI と TravisCI と CircleCI に全部詳しいかつやる気がある人はいない

という事情があり、このようになっている。

ここで CircleCI の Performance Plan について簡単に説明すると

• 課金体系は従量課金
  • 使ってる人数*月15ドルの固定課金
  • 使ったインスタンスの時間あたりの課金
• 並列数は無制限
  • 昔は UI 上 200 並列が上限であるように見えてたけど実際どうなのかは不明。この表示自体はシステムを従来プランと使い回していた故のように思える
  • 200 並列にまだ頭ぶつけたことないので実際どうなのかは知らない、気になる人は営業に問い合わせてみましょう
• 開始時に営業に問い合わせが必要
  • 日本ブランチはあるので日本語でやり取り可能です

といった特徴があります。簡単に言うと安くて便利。というわけで CircleCI Performance Plan でテストを回していたプロダクトの一つで Github Actions を使ってみることにしました。

Github Actions はだいたい以下のような特徴があります

• リポジトリごとに 20 並列までいける
• OSS なら無料、 Private は 11 月から有料化
  • プランはまだ未発表
• 裏側には Azure Pipelines というものが使われている

今回何故か Beta 開始日から我々の組織では Actions (CI)を使うことができたので、今回僕が面倒(?)をみているプロダクトの一つで Github Actions を使用してみました。 create-react-app で開始した SPA で(現在では eject 済み)、純粋に Web フロントエンドだけが存在しているリポジトリです。テストは全て E2E テストで、 jest-puppeteer を使っています。あんまり関係ない話ですがどうも Web フロントエンド界隈ではコンポーネントのユニットテストと型でアプリを守るという思想が流行っているようですが、これらは全て無意味だと僕は思っています。型は VSCode の補完で便利という程度に捉えておくほうがよいと思う。ユニットテストはクソ。

リポジトリごとに 20 並列という制限は、大規模なモノリスがあり多くの従業員がそこで作業をしているという場合簡単に頭をぶつけることになるでしょう。ただし今回僕が Actions を仮投入してみたプロダクトは開発者が 3 名しかいないプロダクトでしたのでそこが問題になることはありませんでした。

プランについては発表しようにも評価のしようがありません。

裏側である Azure Pipelines というか CI の実行部分については、これはもう悲惨としか言いようがない水準です。

• CircleCI の一番下の VM と比べてもかなり遅い
  • CPU も遅いしディスク I/O も遅い
  • 結果としてセットアップフェイズが猛烈に遅くなり大変辛い
• サービス自体安定しているとは言えない
  • 一番辛いトラブルとしてはUbuntu のミラーリポジトリがぶっ壊れているせいで長時間まともに動かないというのがあった
  • その他なぜかいきなり落ちるとか多発

今回 CircleCI と平行するかたちで Github Actions の利用をはじめ、落ち着いてきたら Actions のほうだけに統一みたいなつもりでいたのですが、一向に落ち着くことはなかったので 8/13 に使用しはじめた Github Actions ですが 9/4 で使用を中止し CircleCI だけに戻しました。

あまりにもサービスの品質に問題を感じるため、周囲のエンジニアにインタビューをとってみましたが、 Azure Pipelines 自体が悲惨な品質で、リリース以来あまり改善されてこなかったという話をいくつか聞くことができました。

なお、今回のプロダクトでは CI で実行するあれこれの処理を Makefile に記述し、 CI の設定ファイル内では make hogehoge みたいのだけを書くようにしていたこともあり、 Github Actions の利用開始自体は 30 分もかからずに行なうことができました。このあたり一切面倒なところはありません。

全体として、 Github Actions は非常にストレスフルなプロダクトで、仕事としてやっているプロダクトで金銭的な出費が許される場合には CircleCI の Performance プランを使用することを強くオススメします。11 月に発表される料金がかなり安かったとしてもそれはそうで、出費を節約した結果 CI の不可解な挙動でエンジニアの生産性が落ちるようでは話になりません。

Azure Pipelines の改善が進まなかったことには、そもそもサービスのユーザーが多くなくメトリクスなりユーザーの意見なりを十分に収集できていなかったという可能性はあります。今後 Actions 経由でこれを利用する開発者が増えれば改善されていく可能性はあります。ただし、僕はこれまで Azure のマネージドサービスについて多くの場合において品質面での問題を感じていました。今回だけまともになることあるかなあ、、、

来年の夏ぐらいにまた検証してみたい。

待遇にも文句ないしプロダクトにも愛着は強いんだけど 環境への飽きみたいのが出てきていて、これはまあどうしようもないねえ。

最近同人誌即売会いっても 机全部みればいいじゃんみたいな感じで事前にカタログみたりしなくなっちゃって。なんかでも机全部みるのってそれはそれで見落しありそうということでティアズマガジンちゃんと見てみることにした。

ここのバックエンド Cloud Run にしたらほとんど運用費タダになった。 そこそこアクセスあったからどうなんだろとか思ってたけど Fastly がほぼ全部吸ってくれるから最高。

だるい

はい

Host ヘッダー上書きしたらアプリの動作おかしくなった けどまあなんとかなるだろう。

ここのバックエンド Cloud Run にした

ここはもともと Cloudflare (HTTPS化) => Fastly (キャッシュ) => GKE というかんじで動いていて、 GKE の部分を Cloud Run に差し替えた。

Fastly から Cloud Run を使うには、 Fastly に Host ヘッダーを上書きしてもらえばいい。そのものズバリな説明があって最高便利、よかったですね、 Fastly 最高、金払ってないけど。

React で Android 向けとそれ以外でインタラクションを分ける

コンセプトとしては

const Android = ({children})=>(
  isAndroid() ? children : null
)

const NotAndroid = ({children})=>{
  isAndroid() ? null : children
}

というようなコンポーネントを用意しておいて

<Android>
  <アニメーションとか使わない地味なインタラクション>
    <HogeFuga>
      <Nanika />
    </HogeFuga>
  </アニメーションとか使わない地味なインタラクション>
</Android>

<NotAndroid>
  <豪華なインタラクション>
    <HogeFuga>
      <Nanika />
    </HogeFuga>
  </豪華なインタラクション>
</NotAndroid>

とかこんなん。まあ Android と NotAndroid の中身は適当に想像してください。

なんでこんなことをしたいかというと、

• iOS 端末については年々 GPU が進歩している
• Windows についても Intel の IGP すらわりと進歩している
• 一方で Android 低価格機の GPU はショボいまま

という問題があるので。 Windows 環境でも若干そういう傾向はあるが、特に Android 機において低価格機の GPU は「表示できれば十分でしょ」から進歩しない。なんでこんなことになってんだと思うけど、もうそういうものとして考えていくしかないと思う。

とすると、 Android にだけアニメーションとかを適用しないショボいバージョンを見せる、という選択肢がでてくると思う。 React を使っている場合、しっかりコンポーネントを設計していれば、↑のような感じでそれなりによろしく書いていったりできるんじゃないかな、、、という考え。

実際に現時点でこんなことを実務でやっているわけではないです。今は全体にたいしてなるべくアニメーションとか使わないようなものを出していこうという方針でものを作っています。

ただ、エフェクトの有無が UX に影響するみたいなことが分かってきたら、なるべく多くの環境向けにエフェクトを出そうとかなると思うし、そうなると↑みたいな対処になるのかなーとか。

みんなこういうのどうしてるんだろう。

https://scrapbox.io/shokai/CSS%E3%83%AC%E3%82%B9%E3%83%9D%E3%83%B3%E3%82%B7%E3%83%96%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%82%92SPA%E3%81%A7%E4%BD%BF%E3%81%86%E3%81%A8%E7%A0%B4%E6%BB%85%E3%81%99%E3%82%8B からインスパイアされてこんなことを考えています。

ここの裏側 Go から ruby にもどした

仕事と給与と評価の関係

(1) 仕事の成果を適切に評価することは困難です

営業なら売り上げだろ?違います。売り上げまくってるけど CS 部門に迷惑かける客ばかりつれてくる人とかいますよね。 CRM 使えばそういう人を適切に評価することができるかもしれませんが、大抵おとぎ話でしょう。

(2) 給与ははっきりいって適当に決まります、運です

評価制度やグレード制度が決まってる場合でも結局その運用は最終的には人手なので、、、

(3) 「会社の利益を意識せよ」と言ってくる経営者を信用してはいけない

そういうことはスタッフグレードの人が考えるのであって、現場はそんなことを考えないといけないのであれば組織が成り立ってない。「会社の利益を意識する」というのは「情報の収集と評価」とより抽象化できるが、それは非常に高度で専門的なミッションであって、そんなことを片手間にやると業務執行の質がガタ落ちします。下級管理職やワーカーが利益につながる仕事をできるようにするのが上の人の仕事。

(4) どこかでダメでも別のところでならいける可能性がある

給料上がんなかったら異動願いか転職かしてみましょう

(5) とはいえどこいってもダメみたいな場合もあるかもしれない

まあ、人生いろいろある

かに

ここの実行環境 Cloud Run にしてみた

わりと気軽でいいですね

谷甲州 『硫黄島航空戦線』

マジでやばいな、谷甲州がこんなことになるところを見たくはなかった pic.twitter.com/LtW8PQ2WqT

— 小池陸@ネパール垢 (@ssig33) March 17, 2019

https://www.amazon.co.jp/dp/4125013993/

この記事を先に読んでいただければと思います。

先生の病状は明らかにさらに悪化しておられます。展開は常に意味不明で物事の前後関係は判然とせず、登場人物の人格は常に混沌としています。設定には多くの不整合があり、とても以前の谷先生の作品とは比べられるものではありません。

さらに読んでいて辛くなるのが、おそらく谷先生自身そうした自身の頭脳に迫りくる問題を、認識する瞬間があるのだろうということが文面から伝わってくるからです。

この辺とか読んでてつらい、書いてる谷先生がなにもわからなくなっていることを自覚されてこういう文面になるのだろう、、、 pic.twitter.com/ABHEsFzzUp

— 小池陸@ネパール垢 (@ssig33) March 17, 2019

言いたいことは以前の記事に全部書いたからあまり言葉を重ねたくはない。言いたくないことなのですが、中央公論新社で編集を担当されている方、なぜこれを出版してよいと思ったのでしょうか。本当によく考えてほしい。

Android 機の GPU ってめっちゃショボいことが多いから Web アプリでも Android 向けにはなるべくアニメーション出さないみたいな対処をやっていく必要がある。

React 使って普通に Web サイト書いてるだけなのに iOS と Android 向けにめっちゃコード出し分けていかないといけなくてほんとうに辛い。

iOS にもアニメーション出さない的な方向性でもいいとは思うんですけど、ユーザーテストとかするとアニメある方がずっといろいろよかったりするわけです。

React Hooks 使いまくったプロダクトリリースしました

cookpad TechConf 2019 にいってきた

面白かった、参考になったトーク

スライドとかは Qiita に cookpad がまとめを作っています。

藤井 謙士朗 - 新規サービス開発を加速させる技術とデザイン

このサービスについて、エンジニア視点で書かれた紹介記事はあって Firebaseでバックエンドエンジニア不在のアプリ開発　クックパッドが体感した、メリットと課題 これは結構面白い記事で、レスとしてこんなものを書いたりした。

KomercoではReactでWebの管理画面やティザー画面を作っていて、デザイナーがコードを書いているので、フロントエンジニアもいないんです

と何事もないかのように書かれているところに実際何があるかをデザイナーが何をしているかというのをデザイナー視点で話していた。紹介されているツールや技法は非常に興味深い一方で、

これ簡単にまとめると、プログラミングができる強いデザイナーがいると素早く開発できますみたいな感じの話で、実際ユビレジも異様に強いデザイナーがいて素早く開発できているので非常にその通りだなと思う一方、だからなんだという感じでもあります

— 小池陸@ニューギニア垢 (@ssig33) February 27, 2019

というような一面があったことも否めない。ただ強いデザイナーは強いのでどのように採用するかとか育成するかとかそういうことは常に考えたほうがいいんでしょうね。

水谷 正慶 - スケーラブルなセキュリティ監視基盤の作り方

大企業におけるセキュリティの実務の実際を何一つ知らないので聞いてもへぇとしかならないのだけど、既存の業務においてとにかく膨大な量の手作業がつまっていることはなんとなく感じられた。

リスク評価を Lambda に置いた Go で書かれたプログラムでやってることぐらいしか正直伝わってこなかったんだけど、膨大な手作業をこなしているであろうチームがこうした施策を積極的に取り組んでいることに強い敬意を覚えた次第。俺には無理だわ。

宇津 宏一 - 新規アプリ開発を支えるユーザ・決済基盤

社内向けの基盤みたいなのは非常に大変だろうし、 cookpad もガラケー時代から連綿と伝わるユーザー基盤、決済基盤などがあるなかでこういう作業をやっていくのは本当に大変なことだろうと思う。とにかく大変そう。

その他

https://tabedori.jp/ のたけのこ鳥みたいなキャラがかわいい。

ダメだこりゃというやつ

宇野 雄 - クックパッドが目指す、これからのデザインとプロダクトのあり方

2 月入社の方がクックパッドはダメですという話をして、ひたすら抽象的なトークをするというセッション。「私がクックパッドのデザインプロセスを破壊します」という話をこの人がしたあと、そのあとべつのデザイナーが「既存のクックパッドのデザインプロセスを紹介します」というトークの構成になっていて、当初は聞いていて「これ宇野さんの後の話なんの意味もないよね」と思っていたのだがまあいろいろあるらしいです。

成田 一生 - 基調講演

これは非常に悪いと感じた。「クックパッドは料理を楽しくする会社で、地球人がみな料理を楽しめるようにすることが目的」という内容だった。

この問題について、この基調講演でも触れられていたが、貧困により、料理をせざるを得ない人達というのがいることが「料理が楽しくない」ということの本質的な原因であろうと思う。この問題を解決するにあたって、今クックパッドが取り組んでいる「料理のプロセスを改善する」という方法は殆ど無意味なのではないか。

料理というプロセスがどれだけ改善されたところで、そもそも料理をしたくない人がせざるを得ないという状況があるかぎり、どうにもならない。

この基調講演において「健康的な食事を外食ですることは高い」という問題が触れられていたが、健康的な食事を安価に手に入れられるようになるか、地球人がみな豊かになるかすればいいわけで、農業とかエネルギーとかそういった問題に取り組んだほうが「みなが料理を楽しめる」という状態に早く近付けるのではないか。

LT

内容はすごくよかったのだけど、採用イベントで来場者を床にころがすのが適切かどうかについてはじっくり考えてほしい。会場の問題などいろいろあるのでこのあたり難しいことなのは分かっているつもりですが、、、

LT大盛況です #CookpadTechConf pic.twitter.com/OqOxX2ipf4

— Cookpad Tech Life (@cookpad_tech) February 27, 2019

というわけなので義務は果した。

Encrypted SNI は完全に無意味

政府の役人や政治家はまともにインターネット使ってないので Fastly や Cloudflare を丸ごとブロックしてくるだけ。あんなのにリソース使う暇あったら別のことやったほうがいい。

前ほど Fastly がアグレッシブにキャッシュしてくれない気する

死んでなかったわ

CDN のキャッシュ飛ばすサーバーが死んでる気がする

このサイトの 404 まともに実装してなかったのでやった

Travis CI でビルドが失敗したときだけ Slack に通知したい ということがあるかと思うのですが、残念ながら Travis の Slack 通知にそんなに細かい制御ない。

1. Travis の Slack 通知先を自分のサーバーに向ける
2. そこで中身を選別してビルド失敗だけ選ぶ
3. 選んだメッセージを本当の Slack の通知用 URL に送る

という方法で僕は対処していますが、なんだかなあという感じですね

ねむい

React の Hooks で state に Object を使う

const [obj, setObj] = useState({});
const [value, setValue] = useState(1);

みたいなことをしているときに

useEffect(()=>{
  obj.hoge = value;
  setObj(obj);
}, [value]);

としても、コンポーネントはレンダリングされない。なぜかというと、オブジェクトが変わってるかどうかを React は表面的にしか確認しない(これは利点でもある、不必要な変更の走査やレンダリングがはしらない)。

明示的にレンダリングをさせたい場合、以下のようにすればよい。

setObj(Object.assign({}, obj))

新しいオブジェクトをメモリにつくって乗せてしまえば、オブジェクトのなかにあるデータが全く同じものでも、 React はレンダリングをかける。

こういう感じなので Object を Hooks の State に突っ込むのはいい考え方とは言えない(↑のドキュメントにもほかにもいろいろあんま相性よくないからオススメしないよと書かれている)。

全体的に Hooks はマイクロコンポーネントというか、末端のコンポーネントがとにかく強い力を持つべきみたいな世界観で作られているので、親に巨大な state をもって子にバケツリレーするみたいな実装とあまり相性がよくない。

これは React 全体の思想としてそうという話かもしれない。

プログラミングが出来る と一言で言ってしまうのはあまりよくなくて、ある程度分割して考えるほうがいいと思っている。

1. 自分が必要なものを作ることができる
2. みんながもっている共通の課題のうち、自分の技術力で解決可能なものを見つけて、解決するプロダクトを作ることができる
3. 同僚と協調しながら製品を作ることができる

おおまかにいって「プログラミングが出来る」というのはこの3個のスキルに分割できるのではないかと思っている。そして、これらはそれぞれあまり関係がない。

• 自分の課題を高速に解決することができるが、それを製品や OSS にまとめてリリースすることは出来ない人
• 優れた OSS のポートフォリオを持っているが、同僚という立場の人と協調することはあまり得意ではない人
• 業務としてプログラミングで成果を出してきているが、別に趣味で自分のためになんか作ったりはしてない人
• ゲームを自作しているが、別にそれで食ってこうとか思ってない人

という人達がいると思う。「プログラミングが出来ない」という問題は

• 解決したい課題に対して技術力が追い付いていない
• 自分の技術力に応じた課題を見つけることができない
• 業務としてのプログラミングに必要な協調性が不足している
  • こういうものは意識して訓練するかどうかにかかっている

こういうパターンが考えられる(もちろんこれで全部ではない)。それぞれ必要な訓練は全く別なのだが、これを全部「技術をより深く知ること」で解決できるような気がしてしまうがそれは間違っている。

実際のところ「技術をより深く知ること」により転職がある程度楽になり、転職することで金と時間と気持ちの余裕が手に入りやすくなり、それによりあらゆる問題の解決は楽になる可能性があるのだけど、それが最短のパスである可能性は実はそんなにない。

「プログラミングが出来ない」というのは解決すべき問題としてはあまりにも曖昧すぎるので、自分や周囲の状況を観察してこれを細かいタスクに割っていくことが解決の一助になるし、またそういう課題の捜索と分析という作業を繰り返し行なうことでプログラミングが出来るようになる。

捜査関係事項照会の実務について俺が見てきたこと

俺はどういう人間か: 法律関係のことはあまり知らない(弁護士とキャバクラの値段が同じということぐらいは知っている)。ネトゲや Web サービスの開発を 10 年以上やっている。大量の個人情報を取り扱い金銭化するようなサービスの開発、運営に従事したことはない。高等教育の類いはいっさいうけていない。

警察の捜査関係事項照会について、俺がこれまで見てきた会社ではだいたい管理部門かカスタマーサポート部門が対応していた。法務兼 CS みたいな人もみたことがある。俺がみたものだと、 URL やスクリーンショットをそえて、この投稿者の IP アドレスやホスト名をよこせみたいなかんじであることが多かった。だいたいそれを見れば警察がどういう捜査をしているのかは分かることが多かった。あきらかに不当な照会だなと感じられるものはこれまで見たことがない。

捜査関係事項照会について「お答えできません」という類の回答をするとハイ分かりましたということで終わりになる。その後令状をもってやってくる場合もあるが、なにもないこともある。令状をもってやってきても、ハードウェアとかアカウントとかを取り抑えられるという対処になったのは見たことがない。令状をもってやってきて、規定によりログが残ってませんとなると「なんとか探してもらえないか」ということになるが、それ以上何かという話でもない。

捜査関係事項照会をスルーしている現場をみたことがあるが、そのあとどうなったのかよくは知らない。すくなくともそこの会社の人が令状をもった捜査員とやり取りしているという場面を見てはいない。

国税局から調査関係事項照会書というのがきたことがある。この場合所属していた会社では照会に応じる対処をとったので、国税のをハネた場合に強制調査になるのかとか、その場合の実際の作業はどうなるのかとかは俺は知らない。国税の態度はずいぶん警察より酷いものだと感じた。

捜査関係事項照会に応じるかどうかは本当に企業によって違っていた。このあたり明確なポリシーをもっていると感じられる組織は見たことがない。俺が働いている、働いていたことのある会社ではないが、 LINE は明確なポリシーをもってレポートを公表している珍しい企業だ。ここまでやっている現場を自分でみたことはない。公平性のために言っておくが、俺には LINE 従業員の友人がおそらく 20 名以上存在しているし、 LINE がこのようなレポートを出していることも従業員から聞いて知った。

実務的な話でいうと、 CS 部門、管理部門的には対応工数の最小化に目がいきがちだと思う。これは俺がみてきたことではなく、単なる意見だがこのあたりの対処方針がブランディングに関わるというのが現代では明らかになっているので、広報やマーケティング部門を巻き込んだ対処が必要になってくるのかもしれない。

おそらく実際に捜査関係事項照会で一番おおく行なわれているのは犯罪発生現場近傍の防犯カメラの映像の提供依頼なのだと思うがそのあたりの実務についても俺は何も知らない。個人の位置情報を保存するサービスを運営したこともないのでそういうことを捜査関係事項照会で聞いてくることがあるのかも知らない。俺が警察官なら、被疑者や被害者の名前と電話番号をもとに CCC に「この人どっかの店舗で T カード使用した記録とか出せる?」みたいなことを聞きたくなるよな気がするが、それも想像だ、何も知らない。 CCC の持っている情報はわりと野放図に検索可能であることを知っているが、実際の運用について詳細を知らない。またこれを何故知っているかは言えない(NDA はない)。

警察官や査察官も含めて皆が個人的に知っていることはそれぞれ限定的だ。こういうことについて知っていることを書く人が一人でも多ければいいと思う。

material-ui でカレンダーな UI を作る

こんにちは、金をよこせ死ね。こういう素晴しい書き出しでアメブロを書いている異常者がいたんですがとっくの昔に消えました。アプリ開発をやっているとカレンダーっぽい UI が必要になることはそれなりにあるかと思います。従来 Web だとそういうの非常にだるかったものですが、 material-ui という React Component 集だとそれが簡単にできます。

material-ui 。それにしても酷い名前ですね、何様のつもりなのか。 material-ui にはいわゆる Grid システムをやっていくための Grid という機能があるのですが、それとは別に GridList というコンポーネントをもっています。これはデモをみると

みたいな感じであきらかに汎用的なレイアウトを作ることは想定していないと思うのですが、実際 UI のレイアウトをこれで組むと話が早い。

こんな感じのカレンダーが以下のようなコードで実現できます。

const uuid = require('uuid');

const weekdays = ['Sun.', 'Mon.', 'Tue.', 'Wed.', 'Thu.', 'Fri.', 'Sat.'];
const cardStyle = { margin: 1 }

const Calendar = (props)=>{
  const begining = new Date(2019, 0, 1);

  const calendar = []
  Array.apply(null, {length: begining.getDay()}).map(Number.call, Number).forEach((e)=>{
    calendar.push(<GridListTile key={uuid()}><Card /></GridListTile>);
  });
  Array.apply(null, {length: 32}).map(Number.call, Number).forEach((i)=>{
    const day = new Date(begining.getFullYear(), begining.getMonth(), 1+i);
    if(day.getMonth() === begining.getMonth()){
      calendar.push(
        <GridListTile>
          <Card style={cardStyle}><CardContent><Typography>{day.toLocaleDateString()}</Typography></CardContent></Card>
        </GridListTile>
      );
    }
  });

  return <Paper>
    <GridList cols={7} cellHeight='auto'>
      {
        weekdays.map((w)=>{
          const styles = {};
          if(w == 'Sun.'){styles.color = 'red'}
          if(w == 'Sat.'){styles.color = 'blue'}
          return <GridListTile key={w}>
            <Card style={cardStyle}>
              <CardContent><Typography style={styles}>{w}</Typography></CardContent>
            </Card>
          </GridListTile>
        })
      }
      {calendar}
    </GridList>
  </Paper>
}

記述短くしようとしたらかえって分かりづらくなった気しますね。まあいいや。なんかそれっぽい感じでいろいろ一瞬で書けるので material-ui いいと思う。名前が酷いが、、、

2018 年買ったもののうちゴミまとめ みたいな記事書こうとして買ったものをまとめていたが、一切ゴミを買っていない、反省している。 2019 年はどんどんゴミを買っていきたい。

中国製のとあるキットをかったんですが まあそれがなにかは今は言えないのだが、とにかくこれがすごい。あらゆるコネクタが色や形を適切に分けてあって、どうやったって絶対に間違えて接続することがないように出来ている。

最初キットにろくなマニュアルがなくて「ハァ？」ってなったんだけどこれならたしかにマニュアルはいらない。どんな低能でも組み立てることができる。このジャンルの商品で日米独のものをこれまで触ってきたんだけど、こんなに組み立ての UX が練られているのははじめてみた。

中国の外観デザインというのは 2018 年になっても正直かなりダメな水準だとは思うのだが、こういう UX というか Developer Experience というかそういう分野はすごく進歩している、などと思って中国人に話をしたら俺が買ったメーカーだけがすごいとのことでした。

マネージャーという役割で仕事をしているだけで偉い人ではないです みたいの誠実ではないと思っていて、実際偉いし権威は与えられてるわけでしょう。採用したり、解雇できたり、給与を決定できたり(あるいはそれらの判断に参与できる)するし、大抵給料も高い。

「権威に見合うだけのスキルがあり、組織やプレイヤー個人のキャリアに貢献できるので信用してください」と言い切ればいいし、言い切れないなら別の職が向いているのでは、と思うんだけどそう言い切られると反発する人が多いからこうなってんだろうなあ。

一瞬でつくる家中本

着地点としては

そういうわけで pic.twitter.com/URqbuVYOv1

— 小池 陸@ハイチ垢 (@ssig33) December 16, 2018

こう。これがわりとすぐに出来ます。中本といえば

1. ピリ辛味噌スープ
2. 辛めの野菜
3. 麻婆豆腐

で構成されています。麻婆豆腐については各自のレシピで作ればよいでしょう。私の麻婆豆腐は炒めた挽き肉に豆板醤を加え、創味シャンタンを溶いた酒を入れ、豆腐を入れ、酒がとんだらとろみをつけたというだけのものです。これが麻婆豆腐かどうかは議論の余地があります。普段は食う直前に大量の花椒を入れるので一応麻婆豆腐の定義は満たしている気がしています。

で、味噌スープをどうするかというのが問題で、これがまあ普通にやると面倒なのですが、業務用食材でショートカットしていきましょう。

あみ印 ピリ辛スープ 1L

というものがあります。これは非常によいものです。使い方としては水か中華スープで 10 倍希釈せよとありますが、 50ml のピリ辛スープに 300ml ぐらいの創味シャンタン汁をまぜるのがよいと思います。

辛い野菜についてもこやつにまかせましょう。適当に野菜にこれをまぜながら炒めるとよいでしょう。今回野菜をスーパーにあった「ラーメン用野菜」という適当なカット野菜をつかったので構成要素があまり中本と一致していませんが、まあこれでも味としてはだいぶ中本です。

麺もスーパーにあった適当なやつを使いましたが、もともと麺にそんなに特徴があるタイプのラーメンではないのでそんなんでも十分だと思います。

とにかくこのピリ辛スープはすごく、これを使うだけで 20 分もかからずに家で中本を作れて便利です。一番会社から近い中本新宿店の店長が女にしか話しかけないのが見ていると本当に辛くて、でも中本のラーメンは好きだったのでだいたい同じようなものを家で作れるようになってまりあとってもとってもうれしいです。

デスクトップ Linux を 15 年ぐらい使っている のだが、あまりこの 15 年困ることはなかったと思う。

Vine Linux 2.6 あたりから常用する環境が Linux だったので、だいたい 15 年ぐらいそんなふうであると思う。 GUI にかんしてはいろいろとフラフラした結果、 2005 年ごろから JWM というのを使っていたが、最近いろいろめんどうになって LXDE に引っ越してしまった。

今日常的に起動している GUI なツールは Chrome と Franz と LXTerminal と Steam だけで、まあこれなら OS なんてなんでもいい。昔は Emacs でメールと原稿を読み書きしていた記憶があるのと Skype が必須の時代とかもありましたね。

別段 Linux だから辛いみたいなことはそんなに無かったような気するけど、記録をみると sid 常用してた時代とか 2-3 ヶ月に 1 回ぐらいインストールしなおしとかしてたから、もはや単に記憶が薄れただけかもしれない。

辛いことがすくなかったのは、なんでも Linux でやろうみたいな気持ちがなかったせいかもしれない。ゲームは普通に Windows でやっていた。

やはり革命的だったと思うのは Docker の登場で、これのおかげで「新しい MySQL を使うために sid を使う」「複数バージョンのあれこれを共存させるためにやったものがゴミになって共存させなくなったあと苦しむ」とかが起きなくなった。こういう経験があったので、 Docker とは非常に富豪的なパッケージマネージャーなのだみたいな認識がまずある。

そして なんでも Docker を介して行なわれるようになってきた現代は常用環境が Linux というだけで苦労が減る。

そして Steam Play はかなり革命的な存在で、ゲームもだいたい Linux でやるようになった。

Windows や Mac と比べてこれが使いやすいのかどうかはよく分からない。四六時中 Web アプリを作っている俺にはこれが使いやすいが、非開発者だと Chrome だけ動けばいい時代なんだから ChromeOS のほうがいいんじゃないとか思います。

Linux ずっと使ってるけど「Linux 使ってる、他の環境はクソ」みたいなことを大声でインターネットで叫んでる人みると本当に辛い気持ちになる、これがなぜそうなるのかは自分でもよく分からない。

Cloudflare Workers 試してみた

addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
  if(request.headers.has("X-Testing")){
    return new Response("Hello Peaceful Shit World!")
  } else {
    const response = await fetch(request);
    return response;
  }
}

みたいなクソワーカーをデプロイすると以下のようになる

まあこの例はともかくとして Fastly だと VCL でゴチャゴチャ書いてた部分を JavaScript でゴチャゴチャ書けるようになるのはいいですね。契約形態的にも Fastly よりクイックスタートできるのでよい。

この層でゴチャゴチャしたものを書くべきではないという話はあるんですが、この層でこういうことをやらねばならない人達はいて、そしてそれは私のことです。

dep から vgo に移行した

$ go mod init
$ go build

とするだけで dep から移行できたので楽でよかった、楽でよかったんだけど dep でいいじゃん感は強いし異常者の異常な思いつきを移行ツールなどで必死にカバーしているという印象は強い。

「ライブラリ作者が URL ベースで互換性を維持しつづければ複雑なベンダリングツールも中央集権ライブラリリポジトリもいらない」という初期の発想が間違っていたことを認めて gogems をはやく作ってほしいですね。

最近めっちゃ運用安定してる

ママチャリ問題

ママチャリで画像検索するとこう

ママチャリ 電動 だとこう

ここで問題となるのが、電動のほうででてくるこれが「ママチャリ」という共通認識を得られているのか？ということです。このタイプの小径、低重心、長ホイールベースの自転車、今東京の子育て世代の多くの人が乗っていて、東京では本当にこれを頻繁に見ます。しかし東京以外の都市でこれが氾濫している印象はありません。

ではメーカーがこれを何と呼んでいるかについてですが、

パナソニックは「子乗せ」です。

ママチャリという用語は性やその役割についての現代の認識からするとアナクロであるので使っていないのかなとも思いますが「ママ」ともありまあママが使うこと前提でいろいろ謎です。単に「これはママチャリではないよな」と思っただけかもしれない。

ブリジストンは「子ども乗せ 電動アシスト自転車」です。

ブリジストンはあきらかに男女平等に配慮しています。

ヤマハは「ファミリーモデル」です。

• 「ママチャリ」という用語自体がもともとメーカーや公共団体が使う正式の用語ではなかったこと
  • 「軽快車」のような言葉が使われている
• 「ママチャリ」という用語が現代の性の問題においていささか不適切であること
  • パナはこのあたり無頓着のようにみえますが、、、
• 東京周辺でしか本格的に普及していないこと
  • 坂が多く道路環境も比較的過酷、かつ都市が無秩序に広がっており長距離移動を求められるにも関わらず駐車場が不足という東京の環境に高度に最適化している
  • 値段が 15 万円前後と高価であり地方の所得からすると手が出づらい
• 根本的な問題として日本語およびその文化においてある概念に名前をつけて把握しようという考え方が薄い

などの様々な理由があり「これがいったい何であるのか」という共通の理解が発生していないと僕は考えています。みなさんはこれが何だと思いますか。

Docker を用いてソフトウェアをデプロイするとソフトウェアの品質が上がる

http://b.hatena.ne.jp/entry/bonotake.hatenablog.com/entry/2018/09/06/072800 ここをながめていて思ったことなんですが。

Docker はデプロイにのみ関連するツールであって、ソフトウェア開発の本質には一切関係ないものだ、という考えの人をたまに、いや、よく見る。これは全く間違っていて、 Docker を用いて継続的にソフトウェアをデプロイしているだけでソフトウェアの品質は上がります。ソフトウェアの品質のような問題について考えている人は Docker とそのメンタルモデルに興味をもつべきです。

本来こうした問題について僕がなにかを言う必要はなくて The Twelve-Factor App という文章を読めば十分です。あるいは 大切なことはだいたいHerokuで学んだ というこの文章も非常に有用だと思います。いやこれ Heroku の話じゃんとか思わないでください。 Docker はもともと Heroku クローンである dotCloud の実行エンジンとして開発されたものであり、 Heroku は Docker とそのエコシステムが目指すもの、そして乗り越えるべきものだったのです(部分的には乗り越えていますが、 Heroku は未だに有力なプラットフォームです)。

ところで Docker を使っているだけで何故ソフトウェアの品質が上がるかということを簡潔にまとめたものを改めて書いておくのは悪いことではないと思ったので書いておきます。

• サーバーのファイルシステムなどの「状態」に依存することが出来ないので、ソフトウェアの可用性が上がる
  • よりスケーラブルになる
  • メンテナンス性が上昇する
• 本番環境、検証環境、 CI 環境、開発環境などで同じコード、同じ環境を使用することが出来るので、不具合が早期に発見される
• ログの集約が簡単なので、不具合の発見がはかどる
• いざとなれば簡単にロールバックできるという環境では、大胆な変更も許容されるから、最終的に得られる品質は高くなる

ほかにもいろいろあるとは思いますが、すぐに思いつくこととしてはこんな感じですかね。

ここ数年いろんな勉強会でずっとテストの実行に関する話をしてきて 分かったことがあって、やはり多くのソフトウェアエンジニアはテストに興味をもっていない。コストとしか意識していないのだろう。ただし少数のエンジニアが熱烈にこの分野に関心を持っているということもよく分かった。

あんまり健全じゃないよね、これ。

ゴリラ

ねむい

CircleCI あんま好きじゃない

Firebase でバックエンドエンジニアがいらなくなるは正しくない と思っている。

用語定義が曖昧だが、「バックエンドエンジニア」という言葉でなんとなく想像されるものとしては、 Rails とか Laravel とかでデータベースに CRUD する Web アプリケーションを書ける人を指すと思う。違いますかね。そんなに違ってないと思うが。

Firebase でこれらの知識をもつ人が不要か?というとある程度の規模、機能を持つアプリを作ろうと思うとこれは必須になる。 Firebase のデータベースは機能が少なく(とはいえ Firestore はわりと「これで十分じゃん」ではあるが)、なにか複雑なことをしようとすると、すぐに Cloud Functions という機能に頼ることになる。

Cloud Functions はようするに Firebase の Lambda + API Gateway で、 Firestore になにかが保存されたことをトリガーにして「サーバーレス」のコードが起動される。

典型的にこのトリガーを使うのは以下二つの用途であろうと思う

• 全文検索
  • Firebase に全文検索が実装されていないので外部の全文検索エンジンを使う必要がある
  • 2018 年現在、 Algolia というサービスを使うように推奨されている
    • Firebase の話をあんまり関係ないがこの Algolia は出来がよく大変に便利、 Firebase を使わない人も検討の価値あり
• BigQuery
  • 集計クエリとかは BigQuery に吐いてもらう必要があるだろう、 Firestore への保存をトリガーに BigQuery にコピーするコードを書くのは簡単

そして Cloud Functions には API Gateway 的な機能が高度に統合されており、 AWS でやるよりも簡単にサーバーレスな API を作成、デプロイすることができる。

典型的にはこれは以下のような用途で使用されると思う

• 全文検索
  • Algolia で検索行なうときにアプリの設計次第では適切に権限が制限されたアクセストークンを発行する必要があるが、これをクライアントサイドで行なうことは原理的に不可能なのでサーバーサイドで行なう
• BigQuery
  • BigQuery に実際に SQL を投げて結果を返す API はサーバーサイドに作るほうが何かと楽だし、適切にクオータなどもかけられる
• 認証
  • Firebase が公式に認証フローを用意していないサービスでも Cloud Functions などを使ってサーバサイドを実装すれば Firebase へのログインに利用可能、これについては前に書いた
• 決済
  • Firestore への保存をトリガーに決済を行なう形式は危険、なぜならトリガーは「確実に一回実行されること」が保証されない。複数回走る可能性がある。

こうした API を作成するのに必要な知識は、

• node.js で普通に Web アプリを作る知識
• HTTP ヘッダーを使って認証をする現代で普通のやり方

などであって、極普通にバックエンドエンジニアの知識であろうと思う。

Firebase で本当に不要になるのは「インフラエンジニア」だが、これも実際にアプリが大きくなってくるとどうなるか分かない。すなわち

• CI/CD 環境の整備
• 各種デプロイ、データアクセスの権限の整備
• Cloud Firestore などのデータベースの運用
• Cloud Functions 経由で MySQL などを利用する場合はそれらの整備

といったタスクが出てくることは明らかで、これを解決できるのは、その人がその会社でどのように呼ばれていようと「インフラエンジニア」であろうと思う。

しかし、 Firebase を使う場合でもこうした人達が必要で、結局 Firebase を使う意味はなく、従来のとおりのアプリ開発が結局優位性を持つのか、というとそうではないと思う。

• 多くのことをバックエンドエンジニアとインフラエンジニアに頼らず出来る
  • 彼等は不要にならないが、少なくはできる
• Realtime Database によるデバイス間同期は極めて強力

といった事情で極めて強力、2018 年に 1 からアプリを作る場合最も有力な選択肢の一つだと思う。

ghq で clone したものを peco で検索したあと cd して tmux を開く というようなことをコマンド一発でいけるようにした。

前提となる環境としてはghqを使ったローカルリポジトリの統一的・効率的な管理について - Kentaro Kuribayashi's blogあたり見てほしい。

結論からいうと以下のようにした。

alias opentmux='tmux -2 new-session -s $(pwd | awk -F "/" '"'"'{ print $NF }'"'"') || tmux -2 a -t $(pwd | awk -F "/" '"'"'{ print $NF }'"'"')'
alias gcd='cd "$(ghq list --full-path | peco)" ; opentmux'

1. ディレクトリ名で tmux のセッションを作ろうとして、失敗したらその名前のセッションをアタッチするという alias
2. ghq で検索して cd したあと ↑ を叩くという alias

を登録しました。ぼくは以前から tmux でとにかくぐちゃぐちゃにセッションを作ってしまい、同じディレクトリを開いているセッションが大量に作られたりして破滅していたのだけど、これでかなり便利になった。

ConoHa 捨てる作業完了した

Lightsail 安くなって ConoHa を捨てる決心がついた

2ノードだと落ちるときは落ちるな

えび

多摩のビル火災が AWS の予定地だったことを報じる必要はないとか言ってる人たちに言いたいことなんですけど

Amazon が普段通販サイト Amazon への納入業者を買いたたく感覚で建設業者を買いたたいた結果無理な工程で安藤ハザマのようなダメ会社に発注することになって、安全管理がずさんになってこの大事故につながったみたいな可能性結構あると思うんですよ。

IT で無理してもせいぜいが精神壊す人がでるぐらいだけど建設で無理すればこういうことになるし、今回はまあ死んだの作業員だけだけど周辺住民にだって被害が出た可能性もある。 Amazon に発注者としてこの事故に責任があるかどうかとか検証し報じる価値のあることだし、第一報でとりあえず「発注者は Amazon らしい」と報じることに意味はある。

自分たちの身の回りの狭い常識だけで話すんなよ、死者出てるんだし。