00:01
みなさんこんにちは、ポッドキャスト配信者のKeithこと桑原です。
2024年9月6日の声日記をお届けします。
今日は金曜日ということで、鼻筋で飲まれた方とか、まだ全然絶賛遅くまでみんなでワイワイやってる方もいれば、
スパッと仕事を終えて帰宅したり、プライベートに移った方もいらっしゃるかもしれないんですけど、
私はいつも通りな感じですね。ずっと自宅勤務をしてました。
今日はですけども、一つ目としては、先日からも私の大好きなRiot.jsのエコシステムの一つ、
Riot Flipkartというライブラリーがありまして、これが8年前の更新だったんですけど、
個人的にこれ好きなもので、あんま使う機会はそもそもあんまなかったんですけど、
アニメーションがうまいこと混ざっていたライブラリーになってて、
これを自分の中で一回フォークして、ブランチがそもそもマスターブランチだったんですよね。
8年前ですからそんなもんですよね。
GitHub Pagesにデモページもデプロイされてたんですけど、
今は別にGitHub Pagesって昔はGH-Pagesっていうブランチを切ってアップするみたいなやり方を昔よくやってました。
またそれを自動でやってくれるような確かライブラリーもあったんじゃないかな気がします。
今はGitHubのリポジトリの設定からドックスディレクトリとか別に他のディレクトリ、
もしくはドキュメントルートをそのままGitHub Pagesにすることもできる。
今回はそれに乗っかってドックスディレクトリを1個切って、
その中にインデックスHTMLとコンパイルしたものとかいうのを放り込んで動くようにしました。
これ1個課題というかできなかったことがあって、
ライオットってもちろんCLIが昔からずっと用意されていて、最新バージョンでやってみました。
今はライオットって昔ドットタグっていう拡張子でファイル作って、
その中にコンポーネント、HTML、CSS、JavaScript全部一つにガーンと固めたコンポーネントファイルというのを作ってたんですけど、
今はドットライオットっていう拡張子で作ります。
これ確かバージョン4からですね、以降はずっとその形式でやってたんですけど、
コンパイラー違うな、CLIからコンパイラーを呼び出して、
先にコンパイルというかゲーム自体をトランスファイルかな、
ドットライオットをドットJSファイルにトランスファイルすると。
そのファイルをインデックスHTMLのほうで読み込んで、
03:02
使うってことをしたかったんですけど、なんかうまくいかなかったんですよね。
そもそも僕が久しぶりに書くっていうのもあって、
ライオットで仕事することはほぼないし、最近行動角度も結構減ってるんで、
だいぶ忘れちゃったんですよね。
思い出しながらやってたらなんかできなくて、
結局インブラウザー上でコンパイル&マウントを同時にするっていうようなやり方は知ってたんで、
それでやってます。
なのでDocsディレクトリの中にもコンパイル5のドットJSファイルではなくて、
そのままドットライオットっていうファイルを入れまして、
その中でインデックスHTMLからインクルードして、
そのまま読み込んでコンパイルをして、
マウントをするっていうような書き方で何とか動くようになりました。
なかなか難しかったのはスロットっていう機能があります。
昔はYieldって言ってました。
これは他のライブラリとかフレームワークでよく出るYieldと、
ライオットにおけるYieldってちょっと使い方が違ってて、
今はスロットになったのでもう少し正しいというか、
皆さんと共通の認識であるスロット機能になってるんですけど、
ネーム付きのものでもできますけど、今回はネーム付きじゃないと。
一つしかなかったのでね。
とにかくスロットを置いて、
そのフリップカードっていうライブラリを読み込めば、
そのフリップカードっていうタグもしかもHTMLに置くんですよね。
そのタグの中に入っているチルドレンをそのまんまライブラリのほうで認識をして、
スロットにガンと当て込めるという感じですね。
これはもう言葉で説明するより、ソースコードを見てもらったほうが早いんですけど、
問題なのはスロットで渡すときに渡すほうも渡されるほうも、
うまいことプロプスでアトリビュートを渡したいんですよね。
渡すんですけど、オブジェクトとかプリミティブな値ならば全然楽勝なんですけど、
関数とかメソッドを渡すときがうまくいかなくて、
渡したはずなんですけど、ブラウザーのイベントハンドラーを呼び出したかったんですけど、
イベントがうまく動作しなくて、
オンクリックとかオンマウスオーバーとか、この辺がやりたかったんですけど、
が、効かなくてなんでだっていうところでやってたんですけど、
大元であるapp.riotと今回使うflipkartっていうもの。
これはflipkart.riotって別ファイルで作ってたんですけど、
ライブラリの本体はそのflipkart.riotで、
デモ用に作っている呼び出し側のほうがapp.riotですね。
そのようなコンパイルの順番を変えたんですね。
トランスファイルの順番を変えて、
もっと言うと、トランスファイル自体はいいんですけど、
その後のマウントの順番を変えたんですね。
06:01
先にライブラリのほうのマウントをさせて、
最後に大元のほうのapp.riotのほうのマウントっていう順番に変えたんですね。
これが逆だと思ったんですよ。
先にappをやって全体のほうをマウントして、
その後に細かいライブラリのほうだと思ったんですけど、
逆だったらしいですね。
それでうまくいくのかなっていうのはちょっと疑問だったけど、
結果できたんでよかったっていうところですね。
これができるんだったら、
本来それぞれの.riotファイルをcliからトランスファイルして
.jsファイルにしてコンパイルとかせず、
最初から.mountでいけるんじゃないかと思ったんですけど、
それもいけなくて悩ましいなってところですけど、
時間切れだったんで、
とにかく動くことがまず大事なので、
それで一回リポジトリに上げて、
今GHPagesで見れるようになってますというところですね。
課題はそこにありますけど、
もう一個やりたいのは、
そもそもやっぱりライブラリでnpmとかにも公開したい。
そもそもフォークしたリポジトリなので、
本家のリポジトリの主が見てくださるかは分からないんですけど、
一旦プロリクラー投げようかなと思ってます。
本当に8年前なんで、
全然ライブラリがバラッバラだったんですよね。
package.jsも見ましたけど、
Karmaを使ってて、
TestもMochaとChaiを使ってて、
あとSynonJSとかも使ってて、
本当懐かしすぎましたね。
Traspiler、何使うかというとブラウザリファイ使ってましたね。
めちゃくちゃ懐かしいですよね、ブラウザリファイなんて。
多分今の人名前すら知らないんじゃないかな。
魔術師の帽子みたいなロゴなんですけど。
ちなみに僕懐かしいって言うときながら、
僕はほぼほぼ使ってないですね。
1,2回しか自分が意図的に使わなかった。
結局Webpackがあったし、
途中でロールアップができたんですよね。
ライブラリ作るのに結構ロールアップって割と相性良かったし適した。
アプリケーション作るんだったらWebpackのほうが良かったんですけど。
っていうのがあるので、
中途半端だったっていうのと、
ブラウザリファイを特に使う理由があんまりなかったって感じですね。
もう1個でダウンすると、
もしかしてBowerJSON使ってるかなと思ったら、
さすがにBowerじゃなかったですね。
ここまでいったら古すぎてもうどうしようかなって感じでしたけど。
今回のやつはTranspilerが実は入ってなかったんですよね。
なおと本体のほうのCLIを使うような感じの構成になってたんで、
Transpilerを使ってて、
でブラウザリファイ使ってたんですけど、
ちょっとやめようかなと思いましたし、
テストを別にカルマで動かさなくても良くないっていうのはありますね。
ただブラウザにレンダリングさせるためのライブラリーではあるので、
09:01
それのテストをするんだったら確かにブラウザのテストをしたいと。
でカルマを使うってことは、
クロームラウンジャーとかを使ったり、
ファントムJSとかを使って、
ファントムJSラウンジャーとかを使って、
疑似的にレンダリングして確認をするみたいな、
テストをするっていうような感じなんですけど、
それでもいいっちゃいいんですけど、
ファントムJSを見たらカルマのバージョンがですね、
メジャーバージョン0だったんですよね。
で一応最新持ってきたら6だったんで、
どこまで使えるかわからないですけど、
一回それでやろうかなと。
ただTranspilerが、
ブラウザリファイは実に使いたくないなっていうのを確認すらしないんですけど、
多分開発そんな面ではもうやってないと思うんですよね。
というので、一応BeatでLiotの環境、
動くところまでは僕の手元に残っている、
リポジトリックを生やしてあるので、
それを持ってきて、
Beatでやりたいなと思ったんですけど、
Beatとカルマで動くんかなみたいなところがやっぱあるので、
じゃあやっぱカルマじゃなくて良くないと思いつつ、
さっきのブラウザのテストをしたいっていうので、
さあどうしよう。
テストする内容とか何をテストするか次第ではあるので、
次第だったら別にカルマじゃなくてもいいし、
あえてストーリーブック入れて、
ストーリーブックでブラウザ上のテストとかね、
ビジュアルテストしてもいいっちゃいいんですけど、
ストーリーブックとLiotを入れるとなると、
そもそも相性が悪いし、
Liotってタイプスクリプトで一応開発できなくはないんですけど、
手元で僕何度試してもですね、
TS動いてなくないっていう感じなんですよね。
意図的にTSの型とかをエラー出るというか、
間違った書き方をして、
TSのコンパイルのときのエラーに
引っかかってほしいなと思ったんですけど、
引っかからなくてそのまんま普通に通っちゃったりしてたので、
LiotってまだTS動かないんじゃないかと思ったりしてるんですよね。
でも中のソースコードを見ながらやるのもちょっとめんどくさいので、
一周投げようかと思いつつ、
コアコミッターの方はかなり忙しいかな。
そもそも本来はバックエンドの開発をされてる方っぽくて、
ゴーラン結構書いてる方ですね。
なので見ない可能性があるからなっていうので、
TSは置いといて、
最新のストーリーブックに対応させるんであれば、
ライブラリーがTS対応してるのはほぼ必須だったんですよね。
一回やろうとしたんですよ、Liotのストーリーブック対応とか。
そこが本当にめっくすぎて、
うーんって思ったので諦めたってところですね。
メジャーバージョン、最新バージョンじゃなければ
ストーリーブックでも別にいいんですけど。
要は次の課題はTSのところですと。
TSは一回目を瞑って動くところまではまずさせたいので、
インブラウザーで動くところまではできるようになったと。
12:01
なのでNPMでインストールして、
いわゆるモジュールですね。
モジュール形式で動くかどうかインポートして、
ライブラリーをそのままインポートして、
アプリの中で使えるようにしなきゃなっていうのがあるので、
そっちの対応を次進めようかなっていうところです。
そもそもLiotを使ってる人はどんだけいいのっていうのは、
あれなんですけど、一応ですね。
ちょっと見てみますか。
年間でLiotでどれくらいインストールされてるかっていうのを
ちょっと見てみましょう。
今年1年でLiot.jsをダウンロードしてる人っていうのは、
人は分かんないですけど、
少なくともダウンロード数は12万9千とかあるので、
あんなかんな使われてはいるって感じですね。
もちろんリアクトとかVueとかSplitとかSolid、
何やら何やらよりは全然低いと思いますけど、
見ましょうか。
リアクトはですね、
今年1年のダウンロード総数が、
1、10、100、1000万、10万、100万、1000万、1億なので、
8億2762万ですね。
が今年のリアクトのダウンロード数ですと。
リアクトがそれぐらいってことは
ネクストもほぼほぼ一緒でしょうというので、
ネクストを見ますと、
もう一桁上がるのかなこれは。
違いますね。
ネクストの方がさすがにやっぱ少ないか。
ラッパーフレームワークではあるので、
本体の方がやっぱダウンロードされてますね。
でもネクストは今年1年間で、
現時点で2億2011万ダウンロードってところですね。
やっぱりライオットとリアクトを比較しても
1000はないですね。
どうやったってリアクトがもう一番強いし、
JSフレームワークの中で、
リアクトがもう派遣を取っているのは事実ではあるのでね。
そのままリアクトを使い続けるかっていうのと、
リアクトネクストが今すごく神話性が高いというか、
ほぼ二民三脚感があって、
でもじゃあネクストザー使いたいですかっていうと
重いし、
今朝の確かニュースで見つけたんですけど、
YouTubeでChatGPTが公式サイトとか
アプリのブラウザー側の方の実装を
Next.jsからLinuxに置き換えたっていう
YouTubeの動画が出たので、
これすごく面白そうだったので、
ちょっと見ようかなと思います。
後ほどちょっとこの概要欄にも貼っておきますね、
リンクは。
もちろん英語だと思いますので、
見る方は英語ですよっていうのは
お気をつけていただければと思いますけど。
何の話をしたかったかあれですけど、
Riotがそもそも使われてないと
12万ダウンロードしてるから、
なんだかんだ細々と使われていて、
一応Discord公式チャンネルも見てみると、
ちょこちょこ更新とか投稿されてるんで、
海外では使われてるんだろうなっていう感じがします。
15:02
誰も使われてないライブラリ、
Frameworkのエゴシステムのライブラリに手を出す、
手を入れる、実装するって、
人生の時間の無駄じゃないって感じですけど、
いるはいるし、
僕自身はRiot.jsが好きなので、
今後未来でRiotっていうのがあるぞっていうので、
触ってみたい方のためにも
残しておいてよいんじゃないかなっていう感じがしたので、
今やってるというところですね。
そもそも未来の自分は多分Riotを使うと思うんですよ。
簡単なウェブページ作ったり、
簡単なウェブアプリケーションをサクッと作ってみたいとか、
いうんであれば、
やっぱり簡単に作るんだったらRiotは僕大好きでし、
すぐに使えるっていうので、
それがいいなと思ってるんで、
未来の自分を助けるためにもなるかなと思ったら次第ですね。
こういう日記と言いながら、
ほぼRiotの紹介みたいな感じだったので、
一旦Riotの話は止めます。
あと今日やったのは、
社内でOKR、
社内ですね、チーム内でOKRの話をずっとしてて、
そもそもOKRの振り返りもしないといけないし、
あと僕自身も自分の振り返り、
昨季か前季、
なんていうんだろうな。
一個前のクォーターですね。
前の振り返り、
あと前季そのものの振り返りですね。
もしつつ今の本季、
本クォーターの自分の目標とOKRとの紐づきと振り返りと、
っていうのをしっかり決め直さなきゃいけなくて、
育休から終わったばっかりなんですけど、
ちゃんと言語ができてなかったんで、
そこをしたというところですね。
今外部に入っていただいているパートナー方にも、
ちょっと厳しいお言葉をいただきましたけど、
ありがたくどうやったらいいとか、
何が悪くて、
こうしていくと良いものになるっていうのが、
はっきりと言っていただいたので、
すごくありがたかったし、
なかなかこういうクリティカルなお言葉と
フィードバックいただける機会ってやっぱり
そうそうないので、
もちろんちょっとへこいます。
僕も心そんな強くないんで。
したんですけど、
成長のチャンスだっていうふうにすごく感じたし、
一方で僕のやっぱり強みっていうところも、
やっぱり見ていただいてて、
そこと上手いこと、
こう親和性を会社の求めるものと、
自分の今のロール、
ポジションとしてどういうことを求められていて、
あとは自分でやりたいことと、
強みっていうのにしっかり掛け合わせいくっていうような、
もうちょっと具体な話をいっぱいしていただいたんですけど、
っていうところを目指せばいいっていうので、
その辺をしっかりに動かして、
また目標設定し直さないといけないなっていうところですね。
僕個人はそれでいいんですけど、
やっぱりチームとしてOKRをどうするかみたいな話が今出てたんですけど、
そもそもOKRとはっていう話と、
紙無し者としてのOKRとみたいなのが、
チーム内でいろいろ議論になったと言うんですけど、
なんか難しい話なのと、
18:00
ここでしゃべったらなんかいろいろよろしくない気がするので、
伏せますが、
そんな辺のお話がチーム内でわちゃわちゃ出て、
結構今日難しいお話がいっぱい出たなっていう感じがしますね。
とはいえ物事を難しく複雑化しても仕方はないし、
できることなんてたかが知れてるので、
まずはシンプルにして、
早く前に進めるっていう風に流れを作っていく。
そのために僕はEMとして、
他PMとPOとかと連携しつつ、
どうしていくか、
エンジンチームとしてもどうしていくかみたいなところを、
うまいことどうしたところを決めて、
決まったらまたみんなでやっぱり意識合わせて、
さあ頑張って進みましょうという感じですね。
やっぱりこの辺のお話とか動き方、
まとめてすごく難易度は高いんですけど、
だからこそ期待はされてるし、
大事なポジションだなっていうのはすごく感じたので、
EMとしてやっていけそうだなっていう、
感触が今日はすごく持てましたっていうところですね。
そのパートナーの方がすごくありがたく、
その方がきっかけを作ってくださったのが
でかいとは思いますけどね。
ただ契約上もうちょっと、
一緒にお仕事ができる時間はありますので、
もうしっかりぶつかって、
僕の能力とかできなさっていうのを
丸裸にされてしまっているので、
もう失うものも特にないですしね。
しっかりぶつかって盗めるものを盗みつつ、
鍛えていくところは鍛えてもらいつつ、
頑張ってマネージャーとしても成長していきたいなという感じですね。
やっぱりこの年だってこんなにチャレンジャーになれるっていう、
なかなか意外と楽しいですね。
そんな感じです。
あと、毎日恒例、ご飯を話しましょうか。
今日金曜日なんでもう冷蔵庫の中はほぼ空っぽで、
在庫もないので、
明日、あさってでガッとまたスーパーに
まとめ買いをしに行くんですけど、
ニュースでやってる情報通りなんですけど、
僕の住んでる周りにも大米が全然なくてですね。
うちも米切れちゃったので、
次の1週間の丸ごと冷凍弁当ですね。
お弁当作って、お昼ご飯はもうそれを
レンチで食べるだけっていう流れもやってますけど、
米がなくて、米ないメニューどうしようかってなった時に、
基本的には麺類に行っちゃうわけですよね。
というので、
焼きそばもしくは焼きうどんのメニューで、
今回は弁当化しようかなっていうところです。
朝ごはんとかパンだったり、
パスタにしようかなっていうところですね。
本当は米食べたいですけどね、
21:01
ない分は仕方ないのでね。
とにかくまずは焼きうどんと焼きそばで、
塩味とソース味と、
なるべくそこに野菜を加えつつ、
海鮮風にするかどうか、
普通に豚肉でいくかどうか、
いろんなやり方はありますけど、
それで1週間2人分ですから、
合計10食ですね。
ご営業の2人分10食分の、
焼きそばを作ろうかなと思ってますね。
基本家にいるので、
あとは果物とか牛乳とか、
牛乳よりも本当はヨーグルトがいいのかな、
わかんないですけど、
とかをやりたいなと思ってます。
あと余談の一個だけすると、
先に見たニュースで面白かった?
面白くはないですね。
よろしくはないんですけど、
興味深かったのが、
なんだっけ、
韓国産の白菜キムチが減るというか、
あまり売れなくなるかもしれない。
てか出回らないかもしれない、
みたいなニュースを見つけましたね。
というのは、
今年の天候状況かわかんないですけど、
韓国でそもそも白菜が、
なかなか作れなかったらしいんですよね。
そもそも国内でも白菜が少ないので、
キムチがあんまり作れない。
少なくとも作れてる量は、
削退費で全然減ってるらしいんですよ。
日本にも流通する量が減るかもしれない、
っていうニュースを見たんですね。
実際わかんないですし、
どれくらい減るかもわかんないですけど、
一応そんなことがあったよ、
っていうのを見つけたんで。
で、日本人が一番食べる漬物って、
キムチなんですよね。
多分それらへんは予想通りだと思いますけど、
浅漬けとキムチどっちにか食べやすかったら、
間違いなくキムチの方が
皆さん食べられると思うんですよ。
わかんないけど、
僕は少なくともそうですし、
あれ聞いてもそんな感じでしたね。
キムチが減ったらどれだけ、
意外とみんなにインパクトあるのかな、
っていうのは気にはなります。
ただ今のところ、
日本のニュース見た感じ、
なかった気がするんですよね。
報道されるレベルではまだないのかな、
っていうところですけど。
はい、そんなところでした。
で、話を戻しまして、
今日のご飯ですけど、
確か9月4日、3日前ぐらいに、
今年のつきみバーガーが確か解禁になった、
オープンになったはずで、
何らかんな気にはなるというか、
毎年食べてはいるので、
やっぱ食べたいなっていう感じでした。
金曜日でもあるし、
1週間も頑張ったっていうので、
自分のご褒美として、
作っていたところですけど。
で、奥さんに、
なんだっけ、
またいつも通りちょっと、
Uberだけ出前かな、
買っていただきました。
で、いつもはつきみバーガーだったんですけど、
なんか今回は、
ほうじゅんふわ、
なんだっけ、
つきみバーガーでしたっけ、
24:00
なんかそんな感じの、
ちょっと高級感のある、
つきみバーガーがあったんで、
そっちを買っていただきましたと。
なかなか美味しかったですね、
結局は。
カロリーも高そうなんで、
しっかりカロリーを消費したいなっていうところですね。
脂肪分が多いので。
でも美味しかったので、
まだ食べてない方、
つきみバーガーが解禁されてますので、
今年の期間限定ですけど、
しっかり食べて、
なんでしっかりって言ったんだろう。
食べていただければいいんじゃないかなと思ってます。
じゃあ長くなりましたけど、
こんなところですかね。
以上、
1週間お疲れ様でした。
土日しっかり休んでいただいて、
また来週月曜日からスタートダッシュを切れるように、
永久癒やしなっていただければなと思います。
台風も去ったし、
晴れるんじゃないかなと思ってますのでね。
とはいえ、
体調に気をつけていただければなと思います。
じゃあ今日も1日、
お疲れ様でした。
バイバイ。
