2019-01-05

漫画『ロッキンユー』関連曲リスト

Name: モツ鍋 ＆ 生ラムジンギスカン 石鍋亭
Address: 南五条西3 ニューススキノビル2F, 札幌市中央区, 北海道, 064-0805, JP
Telephone: 011-531-4717

昨年良かった漫画何作もあるけど、個人的なトップ5のうちの1つだと思っている作品にジャンプ＋で連載中の『ロッキンユー』という作品があります。

オルタナ好きと出会ってバンドにハマる話です。最近は初ライブもやって絶好調。序盤のナンバガとの出会いで衝撃を受けるところや、ゆら帝で合わせるとことか最高です。見開きと曲名の組み合わせの使い方がズルいと思う。

ロッキンユー!!! 1 (ジャンプコミックスDIGITAL)

作者: 石川香織
出版社/メーカー: 集英社
発売日: 2018/06/04
メディア: Kindle版
この商品を含むブログを見る

ロッキンユー!!! 2 (ジャンプコミックスDIGITAL)

作者: 石川香織
出版社/メーカー: 集英社
発売日: 2018/11/02
メディア: Kindle版
この商品を含むブログを見る

ところで、SMTP++ #5が来週にあるのですが、そこでこの作品に出てくる曲を集めてプレイしようと思っているので、それに向けて読み直して一覧を作ったのですが、自分だけで所有しているのもアレなので共有します。

15話以降はサブタイトルがジャンププラス上では明記されていないので、文字配置とかからこれだろうというものを書いてます。多分合ってるはず。一部曲名じゃなくてアルバムやバンド名があります。

Track.1
- 透明少女（NUMBER GIRL）
  - タイトル
- September Girlfriend → Iggy Pop Fanclub（NUMBER GIRL）
  - アキラの喋り
- 桜のダンス（NUMBER GIRL）
  - ラスト見開き
Track.2
- 桜の季節／食われちまった
  - タイトル
    - 桜の季節（フジファブリック）
    - 食われちまった（invain（オリジナル））
- ハイエース（フラワーカンパニーズ）
  - アキラが聴いている曲
- 感受性応答セヨ（eastern youth）
- 叙景ゼロ番地（eastern youth）
- 地下都市のメメントモリ（amazarashi）
- イデアの水槽（GRAPEVINE）
  - 以上アキラのオススメアルバムより
Track.3〜Track.5
- ワールズエンド・ダンスホール（初音ミク / WOWAKA）
  - タイトル
  - 勧誘ゲリラライブ演奏曲
Track.6
- 青春狂騒曲〜青雲立志編〜（cali≠gari）
  - タイトル
- cali≠gari
- Plastic Tree
- 9mm Parabellum Bullet
- the cabs
- People In The Box
- レディオヘッド
  - 以上、アキラとひろきが好きなバンドの探り合い
Track.7
- 人間やめときな'99（ゆらゆら帝国）
  - タイトル
- ソフトに死んでいる（ゆらゆら帝国）
- エジソン電（電気グルーヴ）
- 美術館で会った人だろ（P-MODEL）
- Bye Bye Badman（The Stone Roses）
- Karn Evil 9 - 1st Impression（Emerson, Lake & Palmer）
- 野口、久津川で爆死（モーモールルギャバン）
  - 以上、リョウマのiPodのプレイリストより
Track.8
- いけすかない（GRAPEVINE）
  - タイトル
Track.9
- バンドをやってる友達（ゆらゆら帝国）
  - タイトル
- パスピエ
  - さっちゃんが最近お気に入り
Track.10
- 夜行性の生き物3匹（ゆらゆら帝国）
  - タイトル
  - 初合わせリフ
Track.11
- 無い‼ （ゆらゆら帝国）
  - タイトル
- ナゴムコレクション（筋肉少女帯（アルバム））
  - リョウマとひろきのキッカケ
Track.12
- ヤナギノシタニトモダチハオラズ（藤田ハルカ（オリジナル））
  - タイトル
Track.13
- 閃光ライオット（未確認フェスティバルの前進）
  - タイトル
- 未確認フェスティバル（フェス）
- THE ORAL CIGARETTES
- MUSIC VIDEO（岡崎体育）
Track.14
- META Stingray（wooof（オリジナル））
2巻ボーナストラック
- 死んだというのは聞かないが（FoZZtone）
Track.15
- 回想 in my head
  - タイトル（Omoide in my head（NUMBER GIRL）のモジリ）
Track.16〜Track.18
- ハルニレの加速（春の感傷（オリジナル））
  - タイトル（〜Track.18）
Track.19
- Do you like Rock'n Roll !? （N’夙川BOYS）
  - タイトル？
Track.20
- 僕を問う（a flood of circle）
  - タイトル
- カラオケの曲何？「おーもーいーでーもーーそのーー空に流れてー」
- BABY METAL
- Lemon（米津玄師）
  - カラオケで歌った歌
Track.21
- 僕を問う（a flood of circle）
  - タイトル
- ヒューマノイド（ずっと真夜中でいいのに。）
  - タワレコ店内BGM
Track.22
- 僕は初音ミクとキスをした（初音ミク / みきとP）
  - タイトル
Track.23
- キミノメヲ（そらる）
  - タイトル
  - 歌い手のそらるにボカロPのじん（自然の敵P）が提供した曲
Track.24
- キミノメヲ（そらる）
  - タイトル
- アウェーインザライフ（筋肉少女帯）
  - フリーライブ当日のシーンのBGM
Track.25
- ~~VIP（シド）~~
  - タイトル
  - ~~多分シドのやつだと思うけど、表記は「V.I.P.」なのだけど、コマ内のタイトルに . がないのが気になる。単行本で確認したい。~~
- V.I.P. (片想い)
  - シドじゃなくて、ドンピシャの曲があることを知ったのでアップデートしました（2019/05/26）
Track.26
- テレキャスターの真実（凛として時雨）
  - タイトル
Track.27
- LATZ NEW ORDER
  - タイトル
  - 作中のバンド名
Track.28
- SPIRITA（LATZ NEW ORDER（オリジナル））
  - タイトル

2019-01-01

はてなブログおみくじ2019

今年もよろしくおねがいします

はてなブログおみくじ2014

2018-12-13

npmモジュールのアップデートのハードルを下げたい話

このエントリーはKMC Advent Calendar 2018の13日目の記事であり、はてなエンジニア Advent Calendar 2018の13日目の記事でもあります。クロスポストです。よろしくおねがいします。

12日目の記事はそれぞれ以下の記事でした。

npmモジュールのアップデートとの向き合い

皆さん、npmモジュールのアップデート、やっていっていますか？

npmモジュールのアップデートをやっていくこうとしても、フロントエンドで使っている結果としてブラウザを用いた動作確認が大変だったり、そもそもnpmモジュールに詳しくないと影響範囲が分からなくて敬遠されてしまった結果、詳しい一部の人がnpmモジュールのアップデートを気が向いたときにやって治安をなんとか維持しているという状況も少なくないと思います。

npmモジュールのアップデートは頻繁に行いたい
- しかし、ChangeLogの追随や差分検証、動作検証など色々やることがあって億劫
- npmモジュールに対するコンテキストを有していないと、どれがどのように作用をするのかもイマイチ当たりがつかない
なので、npmモジュールのアップデートは気合がある人が月1とかにガッとやる羽目になっていて、なかなか横展開できていない
- 依存性が高い
月1くらいだと積まれているモジュールも多いので、なかなかその状態からmajorアップデートもやるぞとはならない

こういったnpmモジュールのアップデートのコストが高いとメンバーが感じている状況を少しでも緩和するためのアイデアとそれを具体化するCLIツールを作ったのでご紹介です。

npm-safety-updater

上記のような問題について話していたときにこの問題に向き合うアイデアとして次のようなことが挙がりました

ユーザーに配っているJSの中身が変わったら何はともあれ結局手で確認することからは逃れられない
逆に言うと、それに差分が無いときはリリースに載せても問題ないと判断して良さそう
- 今はここも手で上げてみて差分があるかないかを見ているので、それを自動化出来ると、人間は動作確認が必要だったり、複雑なメジャーバージョンアップに注力できそう
また、buildやテストのプロセスが成功するかどうかもコマンドを叩いてみれば分かるはずなので自動化されたい

こういったアイデアを元に作ったのがnpm-safety-updaterです。

主な機能として以下のようなものがあります。

アップデートしたいdepsの種類を指定できる
- 例えば、devDependencies だけを指定するということが出来ます
アップデートするバージョン差分をpatch,minor,majorから選択できます
- patchバージョンアップなら破壊的変更がない細やかな変更だけなので自動化できそうということで対象にするとか出来る
テストコマンドを実行して成功したものだけアップデート
- 設定ファイルで諸々指定できます
失敗するとpackage.jsonやlockを巻き戻す
- npm ciなどのコマンドを使った掃除もやってくれます

例えば次のような設定ファイルを用意すると、初期状態でbuildしたものとjs,cssのdiffが無い場合に成功となった後にgitのcommitまでやってくれるような設定を書くことが出来ます。

{
  "prepare": [
    "yarn run build",
    "mkdir -p /tmp/safety-build",
    "cp -f public/dist/{admin,application}.{js,css} /tmp/safety-build"
  ],
  "testCommand": [
    "yarn run build",
    "diff public/dist/admin.js  /tmp/safety-build/admin.js",
    "diff public/dist/admin.css /tmp/safety-build/admin.css",
    "diff public/dist/application.js /tmp/safety-build/application.js",
    "diff public/dist/application.css /tmp/safety-build/application.css"
  ],
  "onlySuccess": [
    "cp -f public/dist/{admin,application}.{js,css} /tmp/safety-build",
    "git add package.json yarn.lock",
    "git commit -m 'update %PACKAGE_NAME% to v%GOTO_VERSION%'"
  ]
}

1つずつのモジュールをインストールしてはビルドし検証しnpm ci等で環境を整えというのが行われるので、実行自体には時間がかかりますが、それでも人間がちまちまと確認していたのを空き時間やJenkinsなどを利用して実行することが出来るので、まずはこのコマンドを叩いてみるだけでも、アップデート一部は出来るようになるので便利だと感じています。

また、この結果例えば@typesから持ってきているものがpatchバージョンアップで型定義が改善された結果buildに失敗するということにも気づけるので助かっています（こういったものは後で結果を見て人間が手で調整することになるのですが、それでも対象モジュールを手で眺めていくのに比べれば大きな進歩なのではないでしょうか）。

オススメはひとまず npx npm-safety-updater patch,minor --only-devを実行してみることです。普段なかなかアップデートしていないと初回は時間がかかりがちですが、2回目移行は数も減り、確認が本当に必要なものだけに注力できるようになると思います。

また、以前id:masawadaが紹介していたyarn-outdated-formatterとmackerelの組み合わせなどでアラートを出すようにして、そのタイミングでひとまずsafety-updaterを使うというのも良いのではないかなと思っています。

今後の展望について

現在、npm|yarn outdated --json の出力順に結果が依存しているのでなんか上手いこと順番に依存しないようにしたい
設定ファイルの良い感じの雛形を提供したい

何かあれば是非GitHubのissueなどで教えてください → https://github.com/pastak/npm-safety-updater/issues/new

宣伝コーナー

京大マイコンクラブでは部内のシステムのアップデートをやっていきたい新入部員を年中無休で募集しています。京大生はもちろん、他学の大学生や社会人、高校生でも歓迎です。詳細は以下を御覧ください。

株式会社はてなではこのような開発における問題をエンジニアリングで解決するのが好きな方を募集しています。正社員はもちろん僕みたいなアルバイトでも歓迎です。まずはお気軽にランチでもどうですか？

2018-12-11

masawadaといつでも一緒に写真を撮れるmasawada cameraをリリースしました

この記事はmasawada Advent Calendar 2018の11日目の記事です。10日目の記事はid:whywaitaさんのmasawada Advent Calendar 2018 10日目 - なぜにぽえむでした。

というわけで表題のものを作りました。 PCからだとレスポンシブが雑すぎてめちゃくちゃな体験になるので、スマホやタブレットがオススメです。

使い方はアクセスすると書いてありますが、画面真ん中のmasawada画像をタップすると画面に出てくるので、配置を変えたりリサイズしたり出来ます。撮影すると下の部分にギャラリーが出るので適宜保存したりしましょう。

ちなみにServiceWorkerを使って所謂PWAってやつにしてあるので、ホーム画面に追加しておけばオフライン時でも使えて便利です。

作品例

id:daiizくんに手伝ってもらいました。

皆さんも良い画像が撮れたら、是非推奨ハッシュタグの#masawada_cameraでTweetしてください。

おわりに

リポジトリも公開しています。

https://github.com/pastak/masawada-camera

画像を差し替えれば色んなカメラを作れるので、どうにか売り込めないかと画策しています。

明日はid:hitode909さんです。ちなみにこのカメラのアイデアはひとでさんがWebRTC経由でマイクを使っているのを見て、カメラ使えば良いやんってなったのでした*1。明日も楽しみですね。

*1:あとは色々あり、React-Konvaの使用感をチェックしていた

2018-11-28

Uber Eatsのアカウント復活しました

事の経緯

とあるTGIF中にUber Eatsで注文する活動をしていると突然画面がリロード地獄に陥ったので、タブを閉じてcookieを消してログインし直そうとしたら次の画面になった。

助けてくれ！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！ https://t.co/6p2M5F2myt pic.twitter.com/YpkpvQ8NOE
— しみだれココアくん (@pastak) 2018年9月21日

まぁ放置すれば直るだろうと思っていてずっと放置してた。

正確にはメールで問い合わせたりしたいが検索しても電話番号しか出てこないので、電話はなぁと思って諦めていた。

気付き

昨日あたりに周囲の人のアカウントが凍結されていて、彼らのアプリの画面を見ると丁寧に http://t.uber.com/account-disabled を見るようにと書いてあった。僕もやってみるかと思ってアクセスすると、「アカウントの有効化」というページに飛んだので、フォームを埋めて送信したところ半日くらいで復活した。

一応、Uberの利用履歴のところに直近のUber Eatsの注文情報を書いたが、これが有効だったかは不明。