火曜日のおフロ
Search ...
⌘
K
ポッドキャスト
ブログ
占い
ゲーム
ShowCase
Search ...
⌘
K
#173
1304 cues
2:36:29
Episode #173 transcript
transcript をクリックすると YouTube player がその時刻へ移動します。再生中の行は自動でハイライトされます。
00:15
tomorrow Twitch で配信 YouTube にあかい 毎週土曜6時と3人のエンジニア語り合う勉強会の延長みたいな場所。
00:22
フロントエンドの最新ニュースあいこぎんのつかけた現場のリアル 包み隠さずゆるく深く話す。
00:30
火曜日の炉と夜朝に React の輪と CSS
00:37
最新ブラウザの話題からここ
00:42
でかさ MCP フロントエンドから AI コーディング多岐に わたるエンジニアトークコードと仲間と熱い議論。火曜日の炉
00:56
で会いましょう。
01:11
基礎紹介ツールの話開発環境どう使うおすすめのあれこれシェアし 合おう。
01:27
火曜日の炉と夜朝に React の輪と CSS
01:34
最新ブラウザの話題からここでかさ MCP フロントエンドから AI
01:43
コーディング多岐にわたるエンジニアトークコードと仲間と熱い議論。 火曜日の炉で会いましょう。
01:54
火曜日の
01:58
炉
02:01
また来週
02:08
土曜
02:11
の朝に
02:15
待ってるよ。
02:25
火曜日の炉と夜朝に React
02:30
の輪と CSS 最新ブラウザの話題からここでかさ MCP
02:39
フロントエンドから AI コーディング多岐にわたるエンジニア トークコードと仲間と熱い議論。火曜日の炉
02:51
で会いましょう。
03:22
火曜日の炉へようこそ。土曜の朝 tomorrow
03:34
ほい。173回目。
03:41
3月14
03:45
けいもうあったかくなってきましたと。花粉はまだまだ終わりません と。
03:51
うん。ね。感じですね。
03:56
はい。で、まあ、1週間なんで
04:00
ま、1週間分の記事をちょっと見ていきたいんですが
04:06
はい。はい。 Chrome
04:10
あ共有してなかった。うん。
04:15
えー、うんとほい。ほい。
04:20
ああ、これ何のことかと思ったら
04:24
2週間ごとにリサイクルできんのいんじゃない。これカテゴライズが あれやな。ああ。うん、うん。えっとね
04:32
そのノードがね1年おきになった。えっとこれか。開発ツール ランタイムの先頭のやつとなんかほぼ同時に発表されて
04:42
へえ、と思ってはったんだけど。へえ。
04:47
そ、 Chrome はうん。ま、月1リリースを2週リリースにし ますと。で、なんかこう環境の変化が早いので
04:58
うん。俺達も頑張るからみたいな。なんかそんな
05:02
感じ。で、リリースサイクルを早めましたみたいな。
05:07
変えましたっていう。
05:10
だからめ本当め、めっちゃ早いね、2週間だから。そっすね。146が 出てふんふんって1週間ぐらいかけて新しい機能を眺めていたら
05:22
147βこちらですみたいな情報がもう来てあ、もう、もうかみたい な。
05:29
これは AI コーディングしてるからなんか。
05:34
ああ、そういうのもあるかもね。うん。うん。
05:38
そう、っていうのが、まあ、あってまあまあまあ、まあ、悪いことじゃ ないというかね。すごく早くなったんだという。追いかけるのは
05:47
ちょっと大変かなってなったのとうん。で、ノードがリリースの、 えっとねあれが変わる LTS ああ、そういつだっけ。あの、偶数
05:57
だったじゃん。うん。それが偶数とかじゃなくなって
06:03
ま、毎年1個新しいのにしますよみたいな。うん。サポートしますよ みたいな風になる。で、こっちはなんか
06:13
世間に追いつくために頑張るぞいと逆でうん。メンテ大変すぎるから ちょっと楽にしたいわっていうので、こうサポートするバージョンを
06:23
減らしていくみたいな。うん。ことになるみたいな。
06:32
あ、今まで年2回だったんすね。偶数奇数うん。そんな早かったっけ。 2年に1回っていうことじゃないんで。
06:42
年2回偶数奇数って書いてある。うん、違う。そう。バイアニュアル
06:50
ん。2年に1回じゃない。ん。違う。
06:54
あ。2020何年とかじゃあれじゃなかった。
06:58
違うか。どうだっけ。2年、2年ってことはない。
07:04
え、嘘。
07:08
もっちょい早いような体感はあるけどな。
07:13
ふーん。なんか、あの
07:17
あれが2年間、サポートが2年ぐらいあるイメージ。
07:24
ああ、確かに、確かにこれ見てみたら大体4月にその奇数版出して、 10月に偶数版出してっていうことらしいですね。
07:35
ああ。バイアニュアルって半年に1回っていう意味らしいすね。
07:41
知らんかった。トワイスアイヤーはあ、はあ、はあ。へえ。
07:48
そう、そう、それがなんか
07:52
ま、最新版と1個前2個前かなるんだっけな。なんか、うん。
08:02
とにかく出たやつ、奇数だろうが LTS 扱いになるし、みたいな。 ま、カレントと1個前とみたいな。
08:11
ま、シンプルな。はい、はい、はい。あ、ってことはリリース間隔は 変わんない。ん。あ、いや、変わんのか。
08:19
あ、倍になるのか。だから倍になる。どうだっけな。
08:23
そっすね。あ、メジャーそっすね。だから伸び、伸び、伸びるんです ね。半分になったのかっていうのかな。うん。
08:34
いや、ロードも結構バージョン上がるんだ。うん。
08:38
そう、そう。で、なんか27年からは
08:42
その年とノードのバージョンが一致していくよみたいなことをなんか 言ってする。
08:48
ああ、そうそうそう。
08:54
そうなんだ。うん。こっちはなんかそういうの多いな。
08:58
あそうな。はい。アップルとかそうじゃないすか。 Mac OS も
09:04
ああ、なんか変わったのね。あへえ。
09:08
あ、へえ。あれもか。だったのか。あれどこ行ったんだ。
09:14
ああ。あれなんか楽なのかな、やっぱ。どうなんだろう。分かりやすい すね、なんか。そういうことか。うん。ああ、あれいつ頃のやつね、
09:22
みたいな。はい、はい、はい。それな、なんかあったわ。自分も最近 バージョンアップした何かで
09:29
うん。めっちゃ、めっちゃ上がってそんなことあるって思ってうん。
09:36
なんだっけな。ああ。なんかあったわ。今ああ、そういうことか。確か に18を26とかにした記憶があるわ。うん。うん。
09:47
多分オープンクローもそうですね、ちなみに。へえ。メジャー バージョンみたいな感じですね。ああ。
09:54
メジャーバージョンなんか上げれない縛りみたいななっちゃうけど、 まあ、結局1年じゃ上げないのか。
10:02
ああ、ね。
10:04
メジャーバージョン上げあ、そんなもんか。ま、年1ま、むしろ メジャーバージョン年1で上げすぎぐらいの感覚でもあるか。うん。
10:15
ふーん。え、ちょっとなんか参考にしようかな。うん。で、もう
10:21
年単位にするから、だ、これも2年単位にするってことなんすね、 LTS も。
10:27
うん。ふーん。2年半だったやつが
10:32
2年なる。
10:38
はい、はい。うん、うん。ま、分かりやすいからいいんじゃないすか。 うん。
10:43
まあ、ね。うん。
10:47
ふーん。そう、そう。
10:54
いや、ノードな。
11:03
Node.js はもういろんなとこで使われてるからな。
11:12
もっと早くなってほしいな。スピードがああ、ね。
11:20
うん、うん。クロードはなんか分
11:23
使うみたいな。うん、うん、うん。ま、他のやつとか Gemini とか Gemini CLI とか
11:31
あの、オープンコードとかコーデックスもかな。多分 npm とか 普通にノードなんで
11:39
うん。いや、めっちゃメモリ食うし、遅いんすよね。
11:44
ふーん。ま、そうなんだ、やっぱ。うん。あ、確かに立ち上がりは 遅い。遅いっすね。
11:53
なんで、これ
11:55
ただの TY なのにこんな遅いのっていう感じなんすか。
12:05
ま、最近うん。コマンドを打つと言ったらコーデックス、コーデックス レジウム、クロードしか打たないからそこが遅いってね。うん。そう、
12:14
そう。そう。
12:17
そうなんすよ。
12:21
センター来た、センターの話。あ、センタリングえ、数年ぶりにお ほほ。
12:30
新たなセンタリングがええ。また出るんですか、新しい。
12:36
でも、これなんか、ま、不完全というか、な気はするけど
12:42
ポジションああ。アブソリュートプレイスセルフだ、アラインセルフと え、ジャスティファイセルフ
12:50
はい。のふーん。同時指定のやつだね。お、センター。で、インセット 0。これは、あの、トップライトボトムはい、はい。レフト0みたい
13:01
な。はい、はい。この3行で一応真ん中に寄りますと。いや、これは 逆。まはい。
13:08
アブソリュート真ん中に寄るのがあの、な、なんだっけな。サポートさ れたんだっけな。これが今までも何個かではできてたけどうん。
13:20
えーと動くようになった
13:25
のかな。サファリで通るようになったから使えるようになりましたよ、 だったかな。
13:32
ふーん。
13:35
確か
13:40
だから結構なんかね仕組みの解説が面白くてはい。
13:47
新たな概念が、あ、それそれ。インセットモディファイド コンテイニングブロックふーん。あら、新たなってのは別に、あの、
13:54
我々にとって、うん。私にとって新たなというだけなんだけど。
13:59
そういうものがあるっていう
14:05
ブロックの概念がある。そう、ブロックのなんかまた
14:11
あ、そんな仕組みで決まってたんだ、みたいな。
14:15
これを
14:21
あスタックのコンテキストの話があ、そう、そう。
14:29
それがないと、ないとっていうか、そいつがある、あるからか。
14:35
そのインセット0って指定をしなかった場合うん。は
14:41
何が起こるかっていうとうん。親全体に広がっ
14:47
ああ、ああ。うん。じゃあ
14:51
うーんだっけな。アンスコアちょっと怪しいわ。アンスコア
14:56
そっすね。だから親がそうすね。うん。
15:01
確かそう広がっちゃう。
15:09
ああ、うん、なんかそう、そんなこと解説されてた。うん。
15:15
うん。で、インセットを0にすると、0って書くと、そのその なんちゃらボックスが
15:24
変わると。うん。
15:28
で
15:31
自分自身のサイズになってくれるみたいな。うん。
15:37
ああ、忘れちゃったな。なんかね、そう、そんなのがあってね。うん、 うん。
15:43
インセット0にするとなんか要素が配置されるべき有効領域っていう親 要素全体に広げますって言われたんですけど。うん。
15:53
ってこと。書いてますね。うん、うん。
15:59
ふん。それを書かないとどうなるんだっけな。プレイスセルフセンター 効かないってことですよね。
16:08
自分の要素サイズだけしか取れないみたいなことを言ってますね、 Gemini ちゃん。
16:15
ま、それを0にして親要素いっぱいを表示領域とみなした上で親要素の センターが取れるみたいなニュアンス。うん、うん。ああ、そうかも。
16:24
そうかも、そうかも。
16:31
それがインセットで指定できるんだ。親。え、すごいね。インセットで 親を
16:40
なんかどうにかこうにかできるんだ。
16:50
へえ。ああ、ちょっと待ってよ。なんか
16:54
なるほど。
16:57
知った時めっちゃそういうことだったんだと思ったんだけど
17:04
どこ行ったかな。ふーん。
17:09
そ、なんかトップいくつとかってなんか今まで自分の感覚の理解だと その距離まで引っ張られるみたいな、その
17:21
そのぐらいの力で引っ張られるみたいな認識をしてたのね。
17:25
だから全方位に同じ量書くと真ん中で釣り合うみたいな。うん、うん、 うん。うん。なんかね、それが
17:34
その通りではないんだけど、概ね合ってたんだな、みたいな。うん。 可能な領域が広がるんだな、みたいな。
17:43
認識をしたんだよね。
17:47
へえ。
17:54
あ、アブソリュートの中のトップライトボトムレフトがこの IMCP っていう仮想の枠の中で計算されてるんだ。そもそも。あ、そう、
18:03
そう、そう、そう、そう。
18:06
アブソリュート使ったらもうそうなるんすよ。うん、うん、うん。
18:13
で、何もないと、そうか、自分と一緒になって自分自身のサイズなって いう。うん。
18:20
何もで、全部0にやると親の端から端まで広がって、そう、ああ、 そう、そう、そう、そう。うん。
18:27
うん、うん。
18:30
親がアブソ、ん。自分がアブソリュート自分がアブソリュートで、親 が、ま、レ、レラティヴというか、ま、感じ。うん。
18:46
だった時にだね。ああ、だからトップ0、レフト0、ボトム0ライト0 っての一応意味があったんすね。
18:56
あ、そう、そう。ってやると全部0つける意味があったんだ。
19:00
うん。親の端から端までこの中であなたの位置を考えますになる。私の 位置か。おお。
19:01
あ
19:08
うん。あれ、これ昔からやる技術じゃなかったって?なんかずっとやり ますよね。うん、やるやる。
19:19
で、昔はあの、あれだね。幅と高さを
19:22
固定で書くっていうのもセットでやると真ん中に寄る。はいはいはい はい。だったかな。うん。
19:30
じゃ、違うのってこのあれか。このプレイスセルフセンター。まあ、 そう。うん。ジャスティファイ
19:39
セルフセンターが違うだけ。アラインセルフとジャスティファイ セルフ。で、セルフが、そう。違うだけっちゃだけ。
19:47
で、それが、えっと、た、確かサファリでもちゃんとリリースされて うん。ま、一応使うと思えば使える状態になったと。ああ、なるほど。
19:58
うん。っていう記事なんだけど、個人的にはそこのアイ、アイなんちゃ らブロックが確かに確かに。へえ。そうだったんだというポイント。
20:08
なるほど。あ、じゃ、これも古い概念ってことなんすね。これ自体は。 かなり。うん。
20:15
そう。多分そのあ、これ見たこういう仕様だったんだろうね。うん。
20:22
ああ、だからこの黄色のエリアを指定しているってことなんだかな。
20:27
あ、そうそうそうそうそう。親親の中のこのだけのエリア。
20:34
これが MCB っていうエリアなんだ。そうそう。で、そん中で、 ま、配置しますよ。なるほど。だから、ま、場所の指定とかを基本的に
20:46
はしないで使う。そのポジションアブソリュートトップいくつとかで 使うと、ま、左上
20:53
にくっつくからなるほど。トップ、マイナスとかやると上に出てくし トップ、マイナスでやると下に下がるし、みたいな。はいはいはい。
21:07
これなんかあれすよね。これやった後でマージン
21:11
オートとかやると真ん中に行ったりしますよね、確か。だから、自分 自身高さとか持ってたら。ふる、
21:21
えっとねそれまた別かな。別か。えっと、うん。ディスプレーがイン ラインでその子要素にいないといけないのか。
21:31
うん、うん、うん。あ、こいつ自身がどっかに行こうと思ったらって ことか。
21:38
あ、そうそうそうそうそう。ああ、なるほど。
21:47
あ、そう、だからアラインセルフとか、あ、そういうことか。うん。
21:56
そう、そうなんだよね。へえ、って感じ。
22:05
ふうん。そうだね。だ、そこでイン、あ、どっちだっけ?あ、そう、 インセット0を消すと左上にくっつくんだろうね。
22:17
帰れない。うん。
22:20
あ、エディットできないやつか。
22:27
ドゥイット。なんか本文出てっと。
22:34
ふうん。
22:38
あ、アブソリュートだから、か。お、わかんないね。
22:42
あ、カラディブってのも気になるるし、周りのディブがどういうマーク アップかも気になるし、みたいなとこではあるけど。あ、確かに。
22:52
うん。
22:55
これちょっと予習したくなるな、あの Google のやつ。
23:03
ああ、あ、それね、リンクね、貼ってある。あ、マジすか?さすが。
23:10
これは、どっちに、こっちにすか?えっとねそうそう、これのあ、これ か。えっと、あ、そうそうそうそう。これこれこれ。
23:18
アダムのうん。これが2000、2020年って書いてあってさ。ぜ ん、はい。衝撃だってね、もう6年前。
23:28
これやり始めた頃に見てそうだね。ジェントルフレックス。
23:34
フラッフィーセンターとかね。フラッフィーセンター。ああ、 懐かしい。あ、ジェントルフレックスが結局1番いい。っていう感じ
23:42
だったね。うん。うん。
23:47
アダム元気かな。アダム元気元気そうだよ、一応。うん。 Twitter で生きてます。ショッピファイのなんか作るとか言っ
23:55
てましたね。言ってたし、なんかブログも更新してたな、最近。おお うん。
24:04
元気そうだね。そう、コンテンツセンターがなんだっけ?グリッドか。
24:11
ああ、グリッドもやったね。な。うん。今だとグリッドも結構ありなん じゃないすか?
24:18
なんか兄弟がいるとダメとかがあっあふうん。いるんじゃなかったっ け?
24:27
あ、そうそう一緒になっちゃうみたいな。
24:36
僕はもうジェントルフレックス狂なんで。
24:40
あ、こいつやっぱ1番いいよね。1番もうああ。いつでも使えると いう。素晴らしいですね。
24:47
うん。
24:58
ジェントルフレックス。はあ。
25:05
いやあ、なるほどな。どうなんだろうな。
25:09
昨日だと使えないかな。ちょっとあれか。こっちは複数の要素を真ん中 に置い
25:17
てるよね、多分。だからうん。子供が複数いる感じ。
25:24
だからさっきのとはちょっと違うというか。うん。
25:30
になるけど。
25:37
まあ、これもポジションアブソリュートだからちょっと使い分けがいり ます。あ、そうそう。うん。
25:44
なんかモーダルとかあ、そうね。はい。浮かせる感じの使い方しか。 うん。
25:52
でもね、気をつけないとあの、画面はみ出てったりするから。
25:57
ポジションアブソリュートだから。あの、それなんすよね。うん。
26:02
あんまり使いたくない。そうね。そう、それはそう思う。うん。し使う シーンあんのかみたいなのは自分も思ったね、これ。うん。
26:12
ジェントルフレックスやっぱ最強なんすよね。
26:17
もうポジションアブソリュートした時点でちょっともう怖いんで。怖い よね。うん。はい。ふうん。
26:23
扱い注意。もう JS の出番が来ちゃう可能性があるという。
26:30
切れないかとか。ミンマックスとかちゃんとつけないと。そうそう そう。
26:38
そう、並び順とかも変わるしね。そうすね。
26:43
Z インデックス注意とかもうん。
26:48
あ、そう、これは、ま、同じあれかな。アブソリュートでプレイス セルフくるようになりましたが、去年のやつでうん。
26:59
ま、そうだったんだという感じ。で、サファリがダメとかがここに確か 書いてあったかな。
27:07
うん。
27:11
ふうん。
27:16
アラインセルフは、あら、ジャスティファイセルフってこれ
27:21
何なんですか?アラインアイテムズとかジャスティファイコンテンツと かうん。フレックス、ディスプレーフレックスにした親に書くけど
27:31
うん。あれって子供に書くこともできてはいはい。でアラインアイテム フレックススタートみたいなのを親に書
27:42
いたん時に子供に、いや、私は
27:47
エンドに行きますみたいな。みんなはスタートに並べて言われてる けど、私はエンドでみたいなのを指定する時にうん。セルフ使う。
27:57
ああ。うん。フレックスのコンテナとアイテム、どっちに指定するかが 変わる。
28:05
うん。
28:09
ジャスティファイコンテンツとジャス、アイテムズとジャスティファイ セルフ。
28:17
うん、うん。
28:20
ま、セルフはだからじゅうぶんってことですよね。そうそうそう。
28:26
コンテンツとアイテムズの違いまんまよくわかってない。ああ、それ ね、それわかんないよね。
28:35
あ、フレックスでやってると、ジャスティファイコンテンツとアライン アイテムズ。あ、そうね。フレックスだとそれで済む。はい。うん。
28:43
グリッドだと、その行列をどこに置く、ってのと
28:51
行列の中のどこに置く、みたいな。ああ、なんかチョコレートの箱に 入ってる中で寄せるみたい。説明なかったでしたっけ?なんかあったっ
29:01
すね。あったかも、あったかも。
29:05
その枠は決まってんだけど、そこで左上にみんな寄せる。うん。その中 で寄るみたい。
29:14
そうそうそうそうそう。
29:22
ま、ね、言うて使わんからな、っていう。
29:26
わかんないんだよな。うん。
29:32
うん。
29:36
ああ。
29:38
なんか見たな、そういえば。
29:45
CSS トリックが1番いいかな。 CSS トリックのコンプリート ガイドトゥ
29:54
グリッドレイアウトみたいな。あ、それそれ。それはがね、もうずっと メンテされててええ、すご。
30:03
これにイラスト付きで、そのジャスティファイコンテンツと ジャスティファイアイテムズとか。
30:12
すごい膨大な記事になってる。あ、そう。なんか
30:17
なんかもう参照先に自分の中ではなってるんだけど。はい。
30:24
ああ、でも、うん、なってるな。それちゃんと覚えかけうん。
30:30
これなん、謎の余白なんだ、これ。でね、右側にあれがあるんだよね、 ジャスティファイ。
30:37
あ、なんかいる。アイ、アイテム用プロパティーの、そう、カラムに なってて。ああ、すげえ。
30:43
なんだと思ってたんだ。
30:51
気になるんだ。
31:04
なんかたまたまいい感じの幅になってる。
31:11
あれ、これ閉じれなくなった。それたまにあるよね。なんかうん。
31:25
ほいでチョコ缶の例え、でもなんかだいてそういうことか。
31:33
そうね、枠の中でま、どこに寄っていくか。
31:39
あ、ストレッチとかあるのか。ストレッチがデフォだよね、多分ね。 ああ、なるほど。
31:49
アラインアイテムセンターはもう本当にいつも助けられてますという。
31:54
なんかアイコンとテキストみたいなこう横並びに寄せるみたいな。と か。いや、そうだね。これでアイコンとテキストの
32:04
上下の位置がそろわずにガタガタするから大体これつけて直す。
32:11
そうそう。
32:17
で、ジャスティファイコンテンツは?もうそれ、このブロック自体を もう塊として捉えてそれをもうごっそり持ってくっていうやつか。
32:27
なんで?これはグリッドの場合だから、そう。ああ。あの、普段よく 使うフレックスだとまた挙動ちょっとイメージと違うかも。
32:38
これグリッドセクションってこと?あ、これはもうグリッドのページ。 あ、グリッドページか。あ、そうか。だから、その、なんだ、3
32:47
行、3うん、うん。列とかが固定された状態うん。
32:57
でえっとなんだっけ?アラインコンテン
33:04
とかすると箱ごと動くよっていう話。はいはいはいはい。
33:22
なるほどな。だからいつもやってるジャスティファイコンテント、 ジャスティファイっていうのは左右ってことか。
33:34
そうっすね。左右というかそうね、メインアクシス方向って感じなんだ と思う。
33:42
そう。テキストの方向だと。ま、そうそう。はいはい。
33:49
だからこれが左右にこうごっそり行った、ジャスティファイコンテンツ センターのアラインアイテムズセンター。
34:00
で、こう真ん中に寄るとことか。あ、そうそうそうそうそう。ああ、 なるほど。
34:06
で、これ逆にジャスティファイアイテムズって使ったことないけど
34:13
それもしやったらどうなんのかというと
34:17
上かな。なんか上かな。あ、これか。
34:22
ジャスティファイアイ、ああ。おお。あ、そうなるんか。なるほど。
34:28
チョコレートのやつ。はいはいはい。うわ。
34:32
これもいけるんじゃないすか、でも。そう、要素1個しかなくて
34:37
とかだったら、あの、全然真ん中寄ると思うよ。ああ。
34:42
あ、そっか。要素複数あったらこれよ、子要素の大きさに依存しちゃ うってことなのか。
34:52
ええとむずいな。これがグリッドだからあ、でもいけ幅でいけるか。 決まってる。あ、そう、実質いけるにな、なりがちなんだと思う。そう
35:03
すよね。で、普段使うのはフレックスだからうん。またこれとも違う、 その、外の幅が先に決まらないというか。ああ、確かに。
35:14
だからええ?
35:19
ふふ。これね、自分は永遠に理解できないんだけど。確かにフレックス だとこうインラインですもんね。うん、そうそうそう。だからが
35:29
なんか2個しかない。ライン的な。だからそう、その中で
35:34
ってことなの?で、同じページのフレックス版もあるからえ?一応ね、 見れるよ。そうなんすよ。
35:42
すごい。コンプリートガイドフレックスみたいのがある。おお。
35:47
すごい。
35:53
これね、本当すごいんだよ、なんか。なんかずっとメンテされてて 新しくなってくっていう。
36:08
あ、そう、コメントセクションがあるそう。うん。うん、とかなんか 小ネタセクションみたい。ああ。
36:17
ほんで
36:21
アイテムズ?アイテムズないすね。残念。
36:25
そう、多分フレックスだとあれが、そう。一緒になっちゃうんだろう ね、概念というか、現象というか。
36:34
ああ、そもそも、その、グリッドみたいに内部を小分けしてないよって いう話か。うん。確かにな。
36:43
そっか。そもそもだから使わない方がいいってことなのか。フレックス の時。
36:50
あ、そう、効かないんだと思う。効かないんすね。ああ、なるほど。
36:54
なんか中の配置の区分が違うからどういう考え方がないっていうことな んですか?だと思う。そんな、なんか、うん、ちょっとうまく説明
37:06
できないけどね。グリッドはありつつ並べるだけみたいな。そうそう そうそう。ああ、なるほど。だから塊としてしか捉えられないのか。
37:16
あ、そうそう。横方向枠の概念が1個少ない、1レイヤー少ないという か。ああ、なるほど。みたいな寄せてもジャスするだけ
37:26
ですよね。なるほど、なるほど。
37:31
ああ、なるほど。
37:35
ああ、なるほど、なるほど。
37:40
そっか。グリッドはなんかもうあれですもんね、1つ1つ、小部屋 みたいになっててうん。そうそうそうそう。高層ビルみたいな。
37:51
そうそうそうそうそう。全体的な形だけど
37:55
フレックスはなんかもうスネークみたいなヘッダーみたいな感じ。 うん。
38:00
にょろ、にょろ、1、1列になってるから。
38:04
そうだね。そう。そう、ビル、ビル、そうだね。うん。ビルをどう 建てるか。建てるか。の概念がグリッドだと追加される、レイヤーとし
38:15
て。その部屋の中でどこ行く?そうですよね。部屋の中の真ん中に人が 配置されるのか。
38:22
そう、そう、そう。部屋ごと真ん中に作るのかみたいな。はい、部屋 ごと真ん中にぎゅっと。が一応区別できるけど。
38:29
だ、その、ヘビ、フレックスだともうヘビみたいな感じになるから、 ヘビの中の、なんか胴体部分を3つに分けてみたいな。ここは臓器で
38:38
みたいな。ここが尻尾でみたいな。
38:42
そういう分け方はしない。もう1本ヘビだから。うん。
38:49
頭、胸、腹。腹が一番長いです。みたいな
38:54
感じになるのかな。うん。ボックスとかそういうことはしなくて、もう ヘビ自体をこうぎゅっと圧縮、圧縮してぎゅっと。
39:02
ヘビ自体を左に寄せる感じ。
39:07
あ、なんか、じゃあ、そういうコンテンツしかできないってことか。 なるほど。
39:12
いやあ、これ忘れそうだな。
39:17
忘れたまあたらここに戻ってこよう。いや、そうなんだよ。これ、なん か、なんか無理なんだよな。うん。全然覚えらんないけど。覚えな
39:25
いっすね。これ、自由念、自由念が多いすぎ。でも、本当。ずっとこれ 参照し続けてる。わかんないなってなって。
39:35
ああ、フレックスのアラインアイテムとかは言われるとなかなか。
39:47
フレックスのアラインアイテムは、あれ、普通に使うよね。うん、あり ますね。うん。で、フレックスにはアイテムあるのか、アラインは。
39:59
うん、あ、むしろコンテンツないんじゃない?アラインコンテンツって できないんじゃない?あ、そっか。絶対、絶対スタート方向から詰めて
40:09
置いてくしかないから。あ、確かに、確かに。あれ?
40:14
あ、そっか、アラインアイテムはフレックスのフローに対してはクロス する方向になってんのか。
40:22
あ、アラインコンテンツあるな。書いてあるな。ある、あるんか。
40:27
ええ、だから親、親ががサイズを持ってた場合には効くみたいなことな のか。え?違うな。
40:39
あ、あれ、これカラムじゃないっすよね。ディレクションカラム?
40:46
ディレクション良くわかんないけど、そう、あの、左から右
40:52
がメインでだと思うよ。上からクロス。コンテンツアラインコンテンツ はそうか。で、アイテムが
41:03
アイテムの普通にディレクションはローでスタック。
41:12
かな?ん?ちょっとまあ、でもそうだよな。
41:20
クロスアキシスって書いてあるからな。
41:28
じゃ、行間の調整とかがこうやってできるんだ。アラインコンテンツ で。ああ、そういうことだね。へえ。
41:39
なんか実質同じ挙動に見えちゃうみたいなのが多そうだよ。
41:46
これでも全体の高さってどうやって取るんだ、これ?インラインで並べ てるだけなの?
41:51
だ、全高さが指定されてる時だけってことなのか。だと思う。 フレックス、フレックス、はい。と
42:01
フレックスラップイズセットイズアラップリバー
42:08
あ、でもラップの話しかしてない。
42:13
ええ、そうなの?あ、でも高さは絶対いると思うよ。いっすよね。じゃ ないと。
42:22
スペースないもん、だって。どうやってそう、余白が生まれないから ね。
42:32
へえ。だ、これはすごい原点的っすね、だから。アラインコンテンツを うん。うん。
42:43
で、アラインアイテムはそうだね。そっか、だから実質効いてないよう に見えるんだ。うん。ずっとストレッチのまんまじゃんみたいに思う。
42:52
そうですよね。
42:55
アラインアイテムはでもアラインベースラインって効くのかな?本当 に。
43:02
ま、画像ベースラインはうん。
43:08
なんか偶然はまってるみたいな時以外使わないね。なんか依存だから。 うん。ちょっと怖いっすよね、これ。
43:21
なるほどな。インターとかもね。まあフォント
46:11
フォントあれですけどね。
46:15
フォントに。なんかね、ノートはちょっと下に見えるんでとか。いや、 本当に。
46:23
司会して欲しいっすね、本当に。フォントにね。はい。
46:29
で?これはいつだ?あ、最近のやつか。これはね、これもまたね
46:37
ありまして。ああ。スクロール?スクロールトリガーって言われてんす ね。スクロールトリガーアニメーション、そいつが
46:47
ええ、やばい。やばい。やばい。あのまた、なんだ、その概念はみたい な。で、理解しても
46:57
これで何かを作れる気はしない。ってなるやつがあって。フラックス アニメーションみたいなやつ?
47:04
いや、あ、あ、でもそう、そう、そうだね。そういうのとかに使える やつで
47:10
なんかね概念がめっちゃある。うん。
47:15
で、カスタム要素レジストリーは、まああれね、カスタムエレメント ね。うん、うん、うん。で、こう書いてなくてこれか。そいつ、
47:24
そいつ。うん。スクロールドリブンアニメーション。
47:29
うん。はい。まあそう、インターセクションオブザーバーとかで画面に 入ってきた時にじゃあ、ふわっと表示させましょうみたいな。手続き的
47:40
な感じですね。うん。それがいらないですよと。なるほど。うん。 うん。でタイムライントリガー、アニメーショントリガー、まあ、なん
47:50
ちゃかんちゃあってはい、はい、はい、はい、はい。そういうのはこう やって書きますよねって例がそれ。
47:56
で、ここでドキュメントタイムラインをドライバーとして使用し、とか なんか急に言い出しておお。
48:03
そう、はてって思うんだけど、どうやらドキュメントタイムラインって のはこの0.35秒のこと。
48:11
その時間を元にしたタイムライン。なんか意味が重複しちゃったりなん だけど。
48:18
のことを指してるみたい。ほう。あとの方でスクロールトリガータイム ラインとかうん。いうトリガーだっけ?タイムラインとかが出てくる。
48:28
あそう、そう、そう、そう。スクロール進行状況タイムラインとか ビュー進行状況。はい。スクロールがバーが一番上にある時が0、一番
48:38
下が100みたいなタイムラインもあるしうん。ビューポートに入っ出 たみたいなタイムラインもある。うん。うん。
48:48
それと同じ感じでえっと時間経過みたいなのもタイムラインしてなんか 捉えていると。うん。うん。
48:58
らしい。で、インターセクションオブザーバー的なのをやる時はその ビュー。うん。
49:05
なるほどね。タイムラインにしますよっていう。これだから変数名と その値ってか、ま、関数
49:14
のとかを定義をしているっていう感じ。そうだね、そうだね。うん。 これ CSS プロパティですよね。バ、バあ、そう、そっちはもう、
49:21
うん。普通の。だ、何もしなくてもう急にハイフン、ハイフン T が 使えるわけではない。
49:30
ってことっすよ。あ、どうだったっけな?ええと名付けの コンベンショナルなやり方じゃない?コンベンショナルなのであって
49:38
これもともといるわけではない。定義しなくてよかった気がするな。 デフォルトでなんか入ってんのか、じゃあ。と、一番ん?ハイフン、
49:48
ハイフン T ってやった後に上でハイフン、ハイフン T ってやっ てるだけじゃないの?違うか。そう、そう、そう。そう思ったんす
49:55
けど。
49:57
多分まあ、わかんない。あの方に、そう、完成コードあるかもだけど。 ま、見て T が何は定義されてなかった気はするな。うん、うん、
50:07
うん、うん。なんか名付け系でよくそういうの見るよね。うん、うん、 うん。前の、あの、メガポンメニューみたいなやつの実装とかでなんか
50:17
そんな感じ。あ、アンカーね。うん。ああ、あったっすね。
50:23
でそれでカバー範囲ですとかいうやつが
50:29
まあ概念があったりそこが
50:34
えっとね、アクティベーションそのはい、はい、はい、はい、はい、 はい。
50:41
アニメーションを有効にしますみたいな。うん、うん、うん、うん。の がエントリー100%っていうのはえっと、普通の場合、下からこう
50:51
要素が入ってきて、その要素が100%画面内に収まったらみたいな 感じ。全部見えた時に。
51:00
そう、そう、そう、そう、そう。で、エグジット0は、えっと出ていく 時はもう出ていく瞬間からみたいな。うん。そん時にこの
51:12
T 、ハイフン、ハイフン T がトリガーされますよっていう。 うん。
51:18
出ていく瞬間のエグジット0、全部見えなくなったらじゃないすか? わかんない。えっとね
51:24
マイナス関数になる。あ、かん、あ、えっとそう。
51:30
あ、どっちだっけ?いや、確かでき
51:34
できった時?違う、違う、違う。間違えた。頭がちょん切れかけたら もう。頭が、そう、ぶつかって消え始めたらだったと思う。へえ。
51:44
100%出ていくがみたいな意味だったと思う。意味というか、読み 方。あ、へえ。え、アニメ
51:54
エントリーとそのエグジットのアニメーションがそれぞれ
52:02
でえっとね、これはまだトリガーしか書いてないね。なるほど。から
52:10
トリガーがオンになるかどうかの定義だけをまだやっててああ。順 方向、逆方向の再生とか言ってみる。
52:19
あ、そう、そう、とかがある。あ、本当だ。頭ちょん切れたら。
52:26
そう、そう、そう、で、多分下に消えてくと武器も消え始めたらなん じゃないかな。
52:33
ちょっと全部見えない。ああ、確かに、確かに。うん。
52:39
みたいな
52:42
書き方をする
52:46
のがなんかうん。
52:51
すごい基本系というか、サンプルコードみたいな。うん。うん。
53:01
あ、でも
53:05
あ、なるほど。全部やっぱ出ないとじゃないすか、これ。
53:09
あ、そう、そう、そう。全部出てないとダメ。ああ、なるほど。入り、 100%入った時と0%出た時。だ、出始め。入り切り
53:19
と出始めでトリガーがオン、アクティブっていうのか。アクティブに なる。全部出た時っぽいっすよ、これ。
53:27
こ、ここがエリアじゃないすか、だから。ってこの画面の端っこじゃ なくて、多分ここっすよね。
53:33
いや、いや、違う、違う、違う、違う。あ、違うんすか?うん。
53:37
ビューだから画面端で、そのなんだ、斜線はあれ
53:43
画像のサイズを置いてくれてる。
53:47
ああ、そういうことか。なるほど、なるほど。うん、今んとこ多分 そう。うん。なるほど。うん。
53:54
でも、なんか、そう、そういう風に、その、端っこの位置を変更する みたいなプロパティもあったりする。
54:01
ああ、なるほど。画面端じゃなくて、画面端から10%の距離に対して どう、みたいなのとか。うん。
54:11
え、すごいの、それ。
54:17
うん。
54:29
実装そう、そう。
54:34
ブラウザのね。
54:41
これを宣言的に書く方法をよく考えたよな、みたいな感じなんだけど。
54:48
ちゃんと概念を捉えたんですね。うん。こういうのが真の エンジニアリングの気がするな。いや、すごいよね。 AI にでき
54:55
ない。ま、できる、できるかもしれないすけど。
54:59
まあ、ね、これまでの行動を元にみたいな。パラメーターはこれです、 とか言って。そうですね。それがだからスクロールのビュー。これは
55:08
ね、えっとスクロールは関係ない。あ、ビューかな?ビューポート ビュートリガーの方、うん。スクロールトリガーはサンプルない。この
55:18
コード、この記事にはサンプルないけどまあ、あの、読み込みの進行 状況とか
55:25
こう、下に進めば進むほど伸びてくみたいな、うん。うん。のとかが 作れる。
55:32
確かに、確かに。
55:38
へえ。こういうアニメーションね。
55:43
そう、で、次がえっとね
55:48
入る、オンにするのタイミングとオフにするタイミングをずらしてる サンプル。
55:57
ああ。
55:59
エントリーとエグジットが1000じゃなくてっていうことですか? そう、1000と010にしてる。だから
56:08
ああ。出ていく時は何もかかんないように見える。出ていく時じゃない や。
56:15
えっと100%入ったらオン。うん。になります。
56:21
オンになったらオン、で、オフになる時は何もないよっていうことです よね。えっとオフになる時は、えっとね、一応あってで
56:30
えっと、エントリーが0%の時はずっとオフです。もしくは エグジット、出ていって100%出きったら0になります。0、0じゃ
56:39
ない。オフになります。だね。だからだから1回ここでふっと消えたら ひょっこり出かけて消えたら、まあ、そん時は
56:49
消える時もアニメーション作ってことですか?そう、これ、そうね。 やってないけど。画面から、そう、ビューポートから完全に外に出た 瞬間に
57:00
えっと、ふわっと消えたりしてるはず。
57:05
トリガーのステータスが、あの、変わるタイミング。ピッうん。
57:11
になってるはず。
57:15
え、これなんで2個設定できるの?これがなんかそのずらすためだんだ よね、多分。ほえー。
57:23
えっと
57:26
え、用途がね、スジもパッとイメージできないんだけど。
57:31
オンにする時は、例えばフェードインは、えっと
57:37
ちょっと遅らせたい。要素が全部入ってからフェードインした方がま、 目に入るよね、みたいな。うーん。の、で、えっと、ちょっとでも入っ
57:48
たらフェードインするようにっていうのをエントリー側、エントリー じゃない。
57:53
うーん。イガーワーリなのかな。ま、左に書いて
57:57
で、フェードアウトはあんまり早くフェードアウトし始めると気が散っ ちゃうよね、みたいなのでま、完全に要素が消えてからにしとくか、
58:08
みたいな。うーん。え、よくあんな作ったな。ね。すごい。え、だ、 フラッシュで書いて後の方が、く、ん?
58:19
どういう?
58:23
最初の判定基準で有効に
58:28
なって、有効にする基準が
58:31
えっと、インアクティブ、アクティブにする基準が最初、1つ目。 スラッシュ前。で、スラッシュ後がアクティブからインアクティブ次
58:39
インアクティブにする。うん。なるほどね。しきいち。えー。え、 すごいな、なんか。複雑、複雑。ま、分かるけど。
58:42
あー。
58:51
すご。
58:55
ま、活用できる気が全くしないぐらいちょっとむずい。
59:00
むずい。しん、なんか、言われりゃ分かるけど。うーん。使えない、 使いこなせる気がしないみたいな。うん。
59:10
でも、スクロールでアニメーション作ってるウェブサイトの人々はこう いうのあったらいいなってずっと思ってたんですけど。かもしんないよ
59:18
ね。うん。だ、これ、子要素にしてするってことですよね。全体の スクロールじゃなくて、ビューだから子要素がスクロールエリアに入っ
59:27
た時の話。あ、そう。こ、こっていうかそのアニメーションさせたい もの。うん。そう、そう、そう、そう。
59:36
で、今、全体の10%だから、20%だからみたいな。そういうのじゃ なくて。
59:41
ああ、そうだ。はい。そう、本人の10%入ったら始めるとか。うん。 うん。うーん。
59:50
これ、活用する方法あるのかな?別に
59:54
アニメーションえ、ま、アニメーションはアニメーションだよね。 LP とかで JS とかいらなくなるってことなんすかね?あの、
1:00:03
なんか。あー。なんかゴリゴリしたやつとか。
1:00:07
あと、このデモ、デモのやつとかが結構、ま、使えるとは思わないけど うーん。
1:00:14
ま、頑張ってる。なんか。あ。
1:00:19
すごい感じはある。あ。
1:00:23
そっか。アップデしないといけないのか。あら、ま。私、あれし ましょうか。うん。56。ま、でも、インターセクションオブ
1:00:31
オブザーバーだし、フォールバックされてるって書いてあるから。 ああ、そうなんだ。動きは一緒。一緒。みたい。すげえ。
1:00:39
あ、でも、なんか気持ち違うか。あ、違いますか。ま、でも
1:00:44
なんかもっとシュワって動いてた気がするけど。あと、ガタガタ ガタガタみたいな。
1:00:50
うーん。するみたいな挙動とかもあったけど。
1:00:55
え、これ、なんか、このフォームがニョキって生え、生えてくるって いうか、エクスパンドするみたいなことが言いたいんですか?
1:01:03
そうだね。
1:01:06
ニョキって生えて、で、ちょっと縮みながら出ていって、ニョキって 生えて。
1:01:13
ああ、スクロールエリア来たら動く。
1:01:19
ってことをやってる。えっとねいや、めっちゃ難しかったんだよな、 読んだら。なんか、そう。ちょっと入ったら
1:01:29
グワって高さをニョキっとして、中身も表示します。で、ちょ
1:01:35
っとでも消えたら、とかなんか結構ずらしてた気がする。うーん。あ、 そうか。あと
1:01:41
なんて書いてある、それ?インワークそこ入ってきたら、グワって 表示。ちょっとでも消えたら
1:01:50
消す、みたいな感じかな。うーん。
1:01:57
おしゃれ。なんかあの、普通にしといて思うんだけど。
1:02:03
15%、ん?コンテイン
1:02:08
エントリーあー。いや、そうなんだよね。
1:02:13
これ、習ってないんですけど。そう、習ってないんだよ。
1:02:18
なんかちょっと光具合が違うっていうことですよ。そう、そう、そう、 そう。
1:02:23
基本はカバー?カバーがなんかディフォルトな、なのかな、確か。 あー、ま、なるほどか。だな、さっき。うん、で、カバーとコンテイン
1:02:31
があってうん。
1:02:36
コンテイン15%が何なのかってよくわかんないんだけど。15% ぐらいなんかわかったら始まる。なのかな。
1:02:46
何かしら。15%の11ってことだろうね。そのなんだ、画面外にいる 時って高さ0にしてるからさ、もううん、うん、うん。
1:02:55
瞬間100%になっちゃう、エントリーとかでやろうとする。すると 多分。
1:03:00
あー、そういうことか。うん、から
1:03:04
えっと、さっきのあの、画面端入った瞬間から数える、じゃないやつ。 その、画面端から15%の距離で数えるみたいなことを多分してる。
1:03:17
うーん。あー、そういうことか。エントリーだと自分の要素をサイズ 基準にしちゃうけど、コンテインだと親の、親ってか、ビューポート
1:03:27
基準、か、そういうこと。そう。そうだね、多分。ビューポートから 15%まで行ったらなるほど。有効にしますかな。じゃ、エッジから
1:03:37
どうのってくれればいいけど、なんか違うのかな?
1:03:43
ま、そうか。
1:03:46
いや、でも、おしゃれ。うん、ま、ね。マジで何言ってるか何も分から ん、これ。本当にね。インターポレートサイズ、アライキーワーズ。
1:03:56
なんだ、これ?あ、それはねあれだよ。高さ。ハイトオートの アニメーションを有効にするためのうん。1文だね、ま、魔法の
1:04:07
1文。え、ハイトオートのやつできるんすか?
1:04:11
これで。あ、できる、できる。えー。知らんかった。
1:04:18
インターポレートサイズってなんすか?
1:04:22
分かんない。でも、魔法の分かんないけど。
1:04:27
インターポレートサイズアローのキーワードで
1:04:31
それ、0からオートができる。高さぎゅいって伸ばすの、ハイトオート 無理って、もう、すごい有名なやつですよね、これ。うん、うん。2年
1:04:41
前に登場している。固定キーワード値。
1:04:49
あと、こういうキーワード。有効にする。一方が固有キーワード、もう 一方が数値の場合にアニメーションが補完されます。あー。これでなん
1:04:59
かフラグをオンにして、機能有効にするぜっていうこと?
1:05:06
ぽいね。あー、じゃ、これ、なんか、あれなのかな?計算が走って重く なるから対応したくないっていうこと?そうだね。かもっすね。
1:05:16
あ、だから、オートとかをちゃんと裏側で計算してくれるってやつか。 あ、ピクセルだなって言って、うん。うーん。
1:05:24
えー。えー、知らんかと。なんか、全部で使えたっけな?
1:05:32
なんかえー。うん。 Chrome だけとかちょ、ちょっとあった気 がするけど。えー。うーん。
1:05:41
なんか、これをやっとくと
1:05:45
はーい。そう、そう、0から、確かね、そう、そのコードだとちょっと 上かな?トランジションで確か0と
1:05:54
ハイトオートをやってたと思う。うー、ハイト、本当だ。あ。それ、 それ。
1:06:01
あ。おー。これのカードコンテンツっていうアニメーションじゃない か。に指定されてたか。
1:06:11
うん。0からハイトオートで
1:06:15
ふーん。えー。それね、カードコンテンツって書いてるから、あー。
1:06:22
あ、多分そのアニメーションかかるんだ、これで。ほえー。で、 アニメーショントリガーね。ほえー。えー、あ、こ、こっちに驚きっす
1:06:31
ね。これ。まず、これ知らんかった。えー。
1:06:36
あ。すごいすよ、これ、できるようなったんだ、こんなんで。
1:06:42
ほえー。うん。
1:06:46
えー。クロムだね。 Chrome だけ?あ、やっぱり。うん。だ ね。
1:06:55
ま、これ、なんか、あれっすね。このスクロールとかのトリガー、 アニメーション。有用な場面を考えたい。
1:07:05
そうだね。ゲームとかで使える。ま、 LP とかはね、うん。 LP なの、ゴニョゴニョしたやつって、 JS いらないんですか?
1:07:16
あ、インターセクションオブオブザーバーすよね、だから、あれ、やる としたら。
1:07:20
うん。そうだね。無理ですよね。これができるような るってことすかね?ま、本当に単純な動きとかであれば
1:07:31
って感じなんじゃないかな。あー、ま、でも、そっか。 Mac とか だと中の Mac がなんかゴニョゴニョ動いたりするからとかは、
1:07:39
うーん、難しそう。だけどな。できた。ま、でも、そっか。
1:07:47
LP とか、おしゃれ目的、強調目的か。
1:07:53
うーん。もう、 LP ぐらいしかないっすね、スクロールでなんか ゴニョゴニョ。あんまね。ね。
1:08:02
うん、逆に動かないでくれって思うから。邪魔になるから。
1:08:07
スクロールゴニョゴニョされたら。いうとこはあるけど。
1:08:12
きれいに見せたい時ですよね。うん。アニメーション関連。でも、その 他のデモとかが一応ある。ある。のか。
1:08:22
あ、これあ、あれ、でも自分の Chrome もこれ古いのか。
1:08:35
オークリップアニメーションが、ね。トリガーソース。トリガーの コンテキストソース。
1:08:44
うん。その他のデモ?
1:08:49
あるけど。
1:08:52
ミートザモンスター。ゲームできる。
1:09:00
おー、 LP すよね。ま、そうだね。
1:09:08
ジミニで作ったん。ジミニのウォーターマークついてる。ジミニマーク が。うん。
1:09:16
うん。
1:09:18
これは?高さは全部かしといて、ん?どうやった?
1:09:26
これってスクロールがなんかこうキュって止まるのはどうやるんすか?
1:09:31
それは多分スクロールスナップとかを書いてんじゃないかな。
1:09:39
ミートモンスターのコード一応見れそうだね。ちょっとやばそうだ けど。ダメだ。僕のあれではできない。
1:09:48
あ、でも、スクロールキーワードなるほど。うん。
1:09:53
これなるほどいってスクロール
1:09:57
スナップすね。ってやつがあると思うよ。ほー。
1:10:03
それにまず知らないんですけどって感じですね。そこ。
1:10:08
あ、本当。はい。あのカルーセル
1:10:14
の大体というかえー。ほー。あ、これか。あと、スクロールスナップ。 うん。 Y 軸、縦方向でうん。マンダトリーはなんか
1:10:25
強制。強制、そう、止めるってやつだったと思う。キーってそこに 合わせる。
1:10:34
ルートで書いて、スクロールスナップ。
1:10:40
あ、これがヘッダーフッターにてついてるってこと?かな?多分、 タイトル、その、ゾープとかがうん。だ、なのか。あ、確かに、フル
1:10:49
ハイトって書いてあるから、そっすね。これ、子要素とか。
1:10:54
あー、だから、ルートにこれつけてこう、止めたいとこにセンターって やっとくってこと?か。
1:11:02
スクロールスナップ、アラインは何だろう?ちょっと分かんない。
1:11:07
うん、じゃ、それうーん。
1:11:10
画面フルハイト、100%で表示されつつ、スクロールは計算されてる から、しきいち超えたら下に行くということ?あれかも。
1:11:21
えっとあ、そう、そう、そうね、そうね。えっと
1:11:28
スクロールスナップでよく端っこをピタッと止める。その、画面端に端 っこを合わせるとかが、ま、あると思うんだけど、それをセンターを
1:11:37
合わせるにしてるんじゃないか。
1:11:40
うーん。だ、親に Y マンダトリーのアラインを子要素につける。
1:11:48
そうだね。ってすると、その、子供のスタートが親のスタートとピタッ と合うところで止まる。
1:11:57
なるほど。うん。
1:12:00
で、それが真ん中に来るかどうかみたい。そうだね。さっきのは、親の 真ん中に子供が
1:12:09
の真ん中。真ん中同士が揃ったら止まる。揃う位置で止まる。にし てる。うーん。
1:12:15
うーん。このえ
1:12:20
分かりやすいのか。うん。
1:12:24
これって何?スクロールがどこまで止める?られるかってどこで設定し てんですか?
1:12:33
スクロールどこまで止められる?えなんか、ちょろっと行ったら戻さ れるけどだいぶ行ったら次にページ送りされるとかそういう
1:12:43
そういう話?あー、それは分からんな。うん、なんか近い方になるん じゃない?
1:12:50
あー、じゃ、そこでスクロールした量で見て、半分超えてたら次行っ て、とかみたいな、うん。それも指定できんじゃないすか?
1:12:59
マンダトリーだと多分、もう、そう、そうだよね。うーん。あ、なんか 半分っぽいな。プロパティあるかもしんないけど。
1:13:10
戻される。なんかね、はい。若干ずれててもいいよ、みたいなのとか あったんだ。あー。
1:13:19
で、これにさっきのアニメーションつけるとふわっ、ふわっと。うん。
1:13:27
あ、だから、有効になる、無効になるをいい感じに切り替えてるから、 本当はこういう見え方してんだけど
1:13:34
なんか、オパシティ0だから。あー、だね。うん。
1:13:38
その、モンスターは動いてないように見えるとか。スクロールスナップ とこの今回学んだ
1:13:47
何だっけ?えっと、タイムライントリガー。
1:13:51
うーん。と、アニメーションと普通にスクロールしてるもんな、確か に。テキストは普通にスクロールしててで、イメージは
1:14:01
アニメーションでふわふわってなって確かにオパシティが0いってなっ てるから
1:14:09
イメージが全く動いてないように見えるのはどういうマジックなんだ。
1:14:15
あ、画像動いてない。なんか、スクロールで引っ張られてないように 見えるよね。確かに。あ、いや。ん?いや、確かに。
1:14:28
え?最初と最後は出てくから、普通にポジションで書いてんのかな?
1:14:38
カードコンテンツ。謎すぎる。カード、トランスレート、マイナス 50%。あ、じゃ、もう、真ん中は真ん中なのかな。
1:14:49
キーフレーム、カード。うん。
1:14:55
ワッツ?プレビュー、フルハイト。
1:14:59
重なってて、オパシティだけ変えてる
1:15:04
のか。え、だとしたら、効かない時に上に動いていくのは一体、な、 なぜ?
1:15:12
あ、ポジションスティッキーついてるっすね。プレビュー。
1:15:18
プレビューがそのモンスター?そうだよね、きっとね。メイクだ、 イメージラッパースティッキって書いてあるから。うーん。これ、こ
1:15:28
れっすね、やっぱ。
1:15:31
なるほど。うん。
1:15:36
これで、ま、ブラウザアップデしてたらいけるってことか。かな。
1:15:48
プレビューどこについ、あ、こんなとこにいた。
1:15:54
え、フルハイトで画像を全部抱えてんだよね。
1:16:00
スティッキーでこいつに
1:16:02
あ
1:16:06
そんなことできるんすね。
1:16:11
え、画像の切り替えはだからどこ、どこ、どれでやってるかっていうと
1:16:17
切り替え
1:16:21
画像はショウ TL データショウ TL
1:16:27
ええとへっへっへえっとうん、 JS でいじってる?
1:16:32
いやいや、 JS うん、ないと思う。
1:16:38
プレビューイメージがあるね。ええと49行目とかに CSS の49 行目にドットプレビューのイメージがあって
1:16:49
アニメーションがうん、うん。ショウ
1:16:54
アニメーションがカスタムアイデントデータショウタイプ
1:17:03
プン T 1 T 2プレビューアトリビュートとかから持ってきてる からっす、なんかあれなんだけどこれね、 T 1 T 2とか
1:17:18
うん。やってて、それはどこに書いてあるんだ? CSS のトリガー でなんか
1:17:29
指定がトリガーされるようになってる。そのパーセントとかで
1:17:35
トリガーネーム T T 書いてる、上。
1:17:42
ああ。あ、でも T しか書いてないのか。サポートだからこれは関係 ないです。
1:17:47
それいっちゃうえ。これいっちゃうえですね。うん。
1:17:52
T 123とかってどこで書いてんだろうね。うん。
1:17:56
え、 HTML 側じゃないすか?
1:18:00
CSS CSS 側でその T 1 T 2 T 3 T 4って書い てないっすね。サポートしかないか。もう関係ないし。
1:18:12
魔法の連番になるってこと?いや、なんだろうね。書いてあるじゃない んで。
1:18:20
データショウ T 2 CSS 側でな、何もしないでもいいの?なん もしてないから。
1:18:29
タイプカスタムアイテム
1:18:33
何も書いてないと何もないな。え?
1:18:38
その ID ってやつ ID って何だこれ? ID で連番になんか 認識されるとかな?
1:18:47
どこに書いてある ID ?画像技術タイムライントリガー
1:18:52
っていうん、違うか。コンテンツの中の全部の ID 、 ID が どっかにいる。
1:18:59
いや、と思ったんですがないですね。
1:19:06
あ、 ID あるよ、あるよ。え? HTML の
1:19:11
2121どっかにそっち
1:19:16
あ、ここにあった。ああ、それか。ん?ああ、これ画像あ、あ、そう いうこと?あ、これ画像とここからは違うんだ。
1:19:28
あ、そう、そう、そう。縦のでまず割ってあ、そういうことか。ああ、 なるほど。
1:19:34
あ、これ右と左と違うんうん。カードかなと思った一瞬、これ。ね。 うん。
1:19:41
ああ。さっきのあのスクロールしてる様子とか見てもそう見えるよね。 そっすよね。うん。うん。
1:19:49
あ、別々の要素、おおえだね。あ
1:19:55
はえー、なるほど。あ、ああ、で、そうか。で、それぞれを見せたり 見せなかったりしてるだけなんだ、これ。
1:20:03
あ、じゃ、こっち動いてないんだ。あ、そうか。そうだね、多分そう。 左動いてないんだ。
1:20:10
でもスクロールするとさ、絶対動いてるよね。
1:20:15
これは逆にわからん。
1:20:20
うーん。効かない時はあれか、全然全然効かないのか、もう。なんか そもそも CSS キーってなく
1:20:30
て右も左も高さが一緒のブロックが表示されててみたいな感じなのか な。うん。
1:20:39
ああ。こういうことやってきて、この ID のアトリビュート
1:20:50
に名前ビューでつけて
1:20:54
うわあ、すっげえな、これ。
1:20:58
で、アニメーションアニメーションでクロマティックだよね。うわあ。
1:21:04
データショウデータショウタイプでアトリビュートのプレイフォー プレイバック
1:21:12
すげえ。読めない。
1:21:18
まあ、なんとなく、ま、右側の要素で
1:21:23
こいつに寄り添ってるからこれでこれこっち側を表示するしないって いうふわってしてる。やってるってことですね。なるほど。うん。
1:21:30
うん。はえー。なるほど。
1:21:33
すっげえ。
1:21:36
これはスクロールスナップだけ消したらどうなるんだろう?スクロール スナップはどこにいた?丸ごとちょっと消して
1:21:47
え、いっちゃん、いっちゃん上の方じゃない?アニメーションの
1:21:52
違うか。プレビューのところについてたっけ?あ、えっとね、 CSS の100、もう消しちゃったな。123ぐらいだと思う。
1:22:03
レイヤーでスクロールスナップっていう範囲があって
1:22:10
ああ、でもん?はい、はい。あ、それです。なるほどな。多分ね、あれ だね、サポートしてないからあ、そういうこと?
1:22:21
うん。サポートしてるやつちょっとじゃ、あれするわ。お。お。
1:22:26
画面を画面共有する。
1:22:32
いったかな?
1:22:36
今ここにあったはずのスクロールスナップを消したら
1:22:41
こっちの方がなんかわかりやすいかも。
1:22:47
うん、うん、うん。なんか出てって確かに何パーか出てったあたりで 画像が消え始めて
1:22:54
ちょっと一瞬トイレ行ってきます。うい。うん、うん。ああ。
1:23:00
おおああ、わかりやすい。わかりやすい。
1:23:08
ね。で、これで位置を強制してるからなんかスコン、スコン、スコンっ てこう
1:23:17
うん、なんかエンドロールみたいな出方する。
1:23:24
うん。なるほどね。へえ。
1:23:28
へえ。これちょっとおしゃれだな。
1:23:33
ね。
1:23:35
ナップ入れると
1:23:42
あ、でも、まあ、ま、一緒か。
1:23:49
結局が戻ったりするだけで途中まで動かしてる時の様子は、まあ、一緒 か。
1:23:57
ずっとスクロールバー掴んでれば
1:24:02
クイッてならない。
1:24:07
え、遊び心あるな。
1:24:11
ん、ね。使わないと思うけど。
1:24:17
すごいわ。
1:24:22
ああ、スクロールスナップってなんか隙隙をつくと止まるんだね。
1:24:28
えどっかですか?ちょうど、ちょうど真ん中だったのかな?なんか どっちにもいかなかったいや、ここ?こういう
1:24:38
中間地点で止まった
1:24:41
再現できない。
1:24:47
へえ。あ、お
1:24:51
ジャストジャスト真ん中なのかも。
1:24:56
いわゆるビタ止めってやつじゃないすか?
1:25:01
ちょうどあのなんて言うの?マウスの
1:25:06
くるくる?はい。1個分で
1:25:11
うん、うん。ビタ止めできる。うん。
1:25:16
へえ、でも、これ面白いな。スクロールスナップ?
1:25:21
うん。のなんか多分ど真ん中とかで止まるとどっちにも引っ張られない 領域がある。
1:25:28
え?力が均衡してる
1:25:33
1枚目の画像と2枚目の画像の
1:25:38
あ、違うか、これ。なんか1枚目がバグってるのかな?
1:25:45
なんか引っ張られましたけど、さっき、僕やったら。
1:25:49
なんか変な位置に引っ張られるな。うん。なんか
1:25:55
なんかずれてるかも。なんかずれてますね。うん。
1:25:59
ま、高さクイッて変えたりしてるから
1:26:03
ブラウザも困ったんでしょう。あ、ちょ。
1:26:08
へえ、ま、でも、面白いな。
1:26:11
っていうなんかうん。
1:26:15
いや、ちょっともう3つぐらい勉強なったな。もうパンクだよね。もう 知らんことだらけで。
1:26:23
ま、アニメーション深いすね。ま、使わんからな、アニメーション。 うん。アニメーションは自己満足理論を唱えてるから。
1:26:33
ま、 LP ぐらいかな、やっぱ。
1:26:38
普通のなんか業務系のやつで
1:26:42
ま、使う意味がないからな。うん。うん。
1:26:47
なるほど。楽しみだね。うん。
1:26:51
JS いらんっだってすごいですねと。うん。営業が受注したら花火を あげるぐらいの、あの、お楽しみかな。懐かしい。
1:27:04
懐かしい。
1:27:10
ま、10年ぐらい経ってるかな。
1:27:15
ま、そんなとこすか?はい。うん。うん。で
1:27:20
え、全部やった?フィールドサイズああ、ま、そいつはでも、まあ まあ、まあ。まあ、あれでいい、いいんだけどあののテキストエリアの
1:27:29
高さうん。うん。が中身に応じて伸びたり縮んだりするの?
1:27:37
CSS でいける。ええ。ま、まだいけない。まだいけないけど。 うん。
1:27:43
結構いける。うん。
1:27:48
ではあるんだけど Firefox をもし切ってる環境だったら いける。もう。来た。へえ。いらないっす、 Firefox さん
1:27:58
と。え、インプットタイプテキストの時どうなるんすか?横に伸び るってことじゃん。
1:28:05
右に。こと?どうなんだろうね。ちょっと試してないわ。
1:28:10
それ出てんのか。出てないのか。デモがあるかな?名前あ、そうだね、 横に伸びるね。プレイ。
1:28:19
ああ、伸びてそう。おおおお
1:28:25
ライブラリ使ったり、なんか、ね、要素複製していや、すごいや。これ とか出たのが
1:28:32
これ以外にエンターとかする方がいいのか。ん?
1:28:37
いや、そのインプットタイプテキストの時はエンターとか押せないの か。押せないっす。ああ、それはね、うん、送信になっちゃうね。
1:28:45
うん。あ、で、この挙動こう、エンター押しちゃったら、もう、 テキストエリアいらなくなっちゃうからな。
1:28:53
もう、そこの違いぐらいすよね、だってインプットとうん。テキスト エリア。
1:28:58
へえ。これありそうだね。おお
1:29:03
ね、これえ、 Web 越しにスクロールできるの?そのメアドとかっ て、あ、そっか、なんか別にテキスト選択してビーって引く、選択を右
1:29:13
に引っ張ったりしてお尻を見るとかそういう UI 。
1:29:17
あ、そう、そう、そう。まあ、そうだね。ああ。なんかずっとアプリを やってるとそこなんかロングタップで左右にグリグリとかはい、はい、
1:29:26
はい、はい。あ、これ一応受けますね。
1:29:30
うん。ま、普通にえ、すごいね、これ。足りなかった時のやつだね。 うん。で、マックスウィズとかマックスハイトつけたらそこまでで
1:29:40
スクロールなるとですね。へえ。
1:29:44
そっか。あれ、テキストエリアも今ってなんか自動で上下伸びないん でしたっけ?なんかラム、ラムじゃないや。なんかやんないといけない
1:29:52
んでしたっけ?ラインっていうの。はい。
1:29:56
で、これ JS 必須ですね、これ。
1:30:00
すごいね、これ。これはすごい。
1:30:06
ね。え、これでいいじゃん。これに変えよう。
1:30:11
Firefox いらない。 Firefox いらない。うーん。 Firefox 使ってる人なんかいないでしょ。ね、そんな。
1:30:23
まあ、いいや。現実ね、そうね。そう、採用はできる。 Firefox 使ってる人って、ま、大体こうオタクな人というか、
1:30:32
その、技術詳しい人でうん。ま、別に自分で何とでもできる。何とでも できる人だから、どうせ。うん。
1:30:41
そう、 HTML 編集してバリューでも変えといてってそう、そう、 そう。なん、なんとでもできない人は Firefox 使わない
1:30:48
から。そうだね。はい。いい気がする。いける。自己責任だと思って Firefox 使ってると思うんで。
1:30:57
もういろんな目にあってるはずだから、 Firefox 使ってる人 って。なんか実際そうですね。
1:31:06
いいんじゃないすか?うん。だよね。ちょっと久しぶりにうん。 フロントネタを
1:31:14
ね、なんか Firefox 使ってる人いないっていうの、なんか MDN を見ながら言うのも深いけど。
1:31:21
確かに。 MDN 頑張ってるね。っていう。
1:31:27
公式サイトは頑張ってる。けど。うん。うん、すごいよね。うん。 Mozilla はい。
1:31:34
Firefox って開発今頑張ってるかな?頑張ってるんじゃないす か?どんぐらい、どんぐらいやってんの?
1:31:42
しっかりやってんじゃないすか?しっかりやってる。しっかりラストに なって頑張ってる。ラストになってんすかね。
1:31:50
あ、さすがに6はいらない。
1:31:54
ま、でもなんだろう?そもそも Mozilla うん。 Chrome やっぱ Google の息がかかっちゃってるから
1:32:04
そういうのを考える人やっぱ Mozilla っていうか Firefox
1:32:10
うん。うん。
1:32:16
まうん。
1:32:18
で、それがどうなるんかな、し、タイプスクリプトはなんすか?6に なってえ、6出ましたと。で、7で5になります。うん。めっちゃ
1:32:29
早い。なんで?うん。めっちゃ早くなって、で、ちょっとサポートとか も変わる?その、サポート、挙動?うん。ま、ブレイキングチェンジと
1:32:37
かあるから6で慣れていってね、移行期間ですみたいな。うん。
1:32:43
このペンタイムパスターの動画結構前に見ましたよね。
1:32:48
1年以上前かな。ああ、そうか。見たかも。だいぶ昔に見た記憶ある。 うん。うん。
1:32:57
ま、いいんじゃないすか?せっかくえ?どっかが関係ないのか。これは あはい、はい。これはなんか
1:33:07
ええとこれどっかエージェントっていうのが
1:33:12
へえ。オープンコードみたいなやつです。はい、はい。
1:33:16
だ、 CLI みたいな感じで普通にクロードっていう感じです。
1:33:22
ゴーデックスみたいな。うーん。どっかエージェントって打つとこの TUI が立ち上がって、で、しかもどっかの中で動くから安全みたい
1:33:30
な。はい。うーん。そう、そう。ヤムルファイルにその自分使いたい
1:33:39
なんか書いとくとその API を使って
1:33:43
できるという、できるよっていう。ふーん。ま、それはどっか側から 作ったってことですね、これ。あ、これ、あ、本当だね。どっかすら
1:33:52
どっかエージェントそう、そう、そう、そう。本当だ。だ、席はお使用 したいんじゃないすか?ああ。
1:33:59
ま、でも、ありがたいね。簡単に導入できるな。うん。へえ。すごい、 直々にそうだね。出たんだ。
1:34:10
いや、全然ありだと思いますね。うん。
1:34:14
危ないからもう。いろんなジミーちゃんとかよく事故ってたしな。 うん。
1:34:21
いや、本当ね。結構危ないすからね。
1:34:25
本当に。未だに息子のミッションできないもん。チキンでえ?
1:34:32
パーミッション?
1:34:36
あのなんだっけ?デンジャラス3スキップパーミッションああ、はい、 はい、はい、はい。はい。アローオールみたいなやつでしょ。アロー
1:34:43
オール、はい。
1:34:47
チキンでっていうか、まあそうね。ま、しない方がいいけどま、した方 が効率上がるという。
1:34:56
うん。そうなんだよね。はい。こ
1:35:00
なんかコーデックスをなんか先週の流れで使えるようになった。なんか コーデックスっていちいちあんまりこうその場のスクリプトの曲求めて
1:35:02
あ
1:35:09
こないことに気づいて、なんかそれはそれでいいのかみたいな気持ちに はなってる。うん。ま、一応設定でできますけど。
1:35:17
クロードって結構さ、なんかこれは許可するとかしたくてもかその場で 実行するコマンドにニューラインが含まれてますとかで一時止められる
1:35:26
じゃん。なんだっけ?ニューラインがあれたらでもあれはなんか結局 正規表現でヒットしてるだけなんで
1:35:36
ま、自分のアローリストにそれがひっかからなかったから今日毎回許可 して来るっていう。
1:35:42
うん、そうだよね。なんかそうそうなんか正規表現で絶対取れない、 なんかそのデスコマンドをいってやると
1:35:52
なぬみたいな感じでめんどくさいなと思ってんだけど。うん。あるね。 こっちが全部シェルスクリプトとかにかけてそういうのをやってるね。
1:36:01
はい、そうそうやってるそうそう。そういうのやめたいから全部まとめ てって言ってもなおそれをやってる。
1:36:10
ま、あとなんかネットワークアクセスとかをこう許可不許可、不許可と か、あの、ドメインベースでできるみたいなのは
1:36:19
ああいうのはいいかなと思いますね。結局だからま、ローカルで何して もいいんだけど、ま、そのこのディレクターの中だったら何してもいい
1:36:26
んだけどそうそのネットワークアクセスが怖くてその変なプロンプト 読み込んでどっかにドットエブの内容を送っちゃうみたいな
1:36:37
うんうんうん。そういうのが怖いからどっかのネットワークでリストし てやるって感じ?うん、 GitHub とかだけはいけるけど他は
1:36:45
だめみたいな。にしときゃまあアウトだけ防いどけばまあなんか
1:36:52
大丈夫な気はしますけど。そうだよね。それなんか前自分でやろうとし てどっかの設定とかリサーチかけて確かにできるなと思ってめんど
1:37:04
くさくてやんなかったから。そういう設定だけしとけばいいようになれ ば便利か。うん。
1:37:12
で、あとちょっと最近僕作り始めたんですけどこれまだまだちょっと
1:37:18
あの、側しか作ってないやってないんですけど、このグローバル パーミッションっていうの作り始めて
1:37:24
おお。コーデックスなりクロードなりパーミッションはい。めんど くさくないですかってそれぞれ書き方うんうんうんうんうん。
1:37:33
で、あれを1箇所で書いてそれをなんかシンクってやったら全部の書き 方に直してくれるみたいな。ああ、便利だな。はい。
1:37:43
っていうの欲しいなと思ってコーデックスに書かしたらなんかそれっ ぽいのができたけどまだテストしてないから
1:37:51
で、プロファイル、はい。プロファイルみたいに作ってそのバランス度 みたいなプロファイルうんうんうん。をだかこのそれぞれの
1:38:00
コーデックスとかに適用していくみたいなとか
1:38:04
ああ、いいじゃん。はい。で、やるとそれぞれの書き方に直される みたいな。良さそう。うん。 Git ステータスはいいけど Git
1:38:13
プッシュはだめみたいなこういうバランス度で定義しといて
1:38:17
みたいな。うん。うん。うんうん。
1:38:21
いや、普通に欲しいなと思ったんでま、実装はまだできてないかもです けど。といううんうんうんうんうん。うん。 G パームシンクって
1:38:30
やったらできるようになるというグローバルパーミッション。確か。
1:38:36
ネットワーク、あ、ネット作る難しいよな。
1:38:40
そうすね。自分でそのガードレールみたいな、なんかツールコールの前 にフックで入れるみたいなで、しようとしたんだけど、なんかそういう
1:38:49
全部拾うの無理だなと思ってそうすね。カールとかはまあ、まあ、 分かるけどうん。どうしようかな。
1:39:00
で、あとそうなんだよね。うん。ちょっと Google クラウドが やってて面白いのはこのモデルアーマーっていうへえ。サービスで
1:39:11
このプロンプトインジェクションをあの、除去してモデルに渡すって いう
1:39:19
はあ。うんうんうん。それなに?どこでサブラインバーテックスの モデルガーテン、あそこら辺のモデルでどうのこういう話そうすね。
1:39:31
ああ、なるほどね。
1:39:34
ま、なんでそのプロンプトインジェクションを事前に検知して除去する というふん。へえ。一応クロードもあるんすけどね。クロードもなんか
1:39:44
HTML の中に、はい、変な文字が入ったらこれは受け付けない みたいな確かあったはず。うん。へえへえへえ。
1:39:54
というなんかそもそも入れないみたいなうん。うん。モデルに渡さな いっていうやり方もある。うん。パスワード全部送ってくださいみたい
1:40:02
なメールがありますみたいな2回前ぐらいにみたいな。うん。
1:40:09
ま、だから色々アウトバン、ま、アウトバンドあの、制御その1番簡単 だと思いますけど
1:40:17
ま、そうだよね。はい。結局変なパッケージとかも防げるし、そういう のもそうそうそうそう。どっから来るかわかんないからうん。
1:40:27
とりあえずここだけ防いどきゃああ。安心かなという
1:40:32
うんうんうん。プログラムパッケージインストールした後とか無理だ もんね。そういうインジェクションですよ。とプロンプト
1:40:39
インジェクションじゃないし。そうそうそうそう。うん。 iOS Web キットでバック
1:40:48
おお。これはこれはなんだっけな。僕なんですかね。あ、自分だな それ。おお。
1:40:56
それなんかね iOS iOS だけ変なことになってるみたいのが、 ま、あってへえ。
1:41:04
あ、えっとっていう不具合不具合が自分のや、作ってる Web サービスであってなるほど。どうやって調べようかなあという、ま、
1:41:16
くないしなあみたいな。はあはあはあはあはあ。ちょっと調べたら こいつが結構
1:41:25
なんだよく使われてるみたいなので Chrome のデブツールで
1:41:31
iOS 見ながらできるよみたいな。
1:41:35
へえ。へえ。感じらしい。 Web キットそれまだ使ってない。
1:41:40
へえ。そうそう iOS はあれすね、繋いだら Safari リモート Web インスペクターでできるんすけど
1:41:49
うん。これをフックしてるってことか。デブツールで見れるようにした と。多分、うん。すごい。へえ。
1:41:57
おもろ。で、ちょっといいですね。そう、放置してるんだけどまだ うん。
1:42:06
いいじゃないすか。やってみようと思って、そんなあるんだというはい はいはい。これ、ま、あれか、 iOS に繋いでなんか許可とかやっ
1:42:16
たら普通に取れるのか。多分ね。をしたことないからな、わかんないん だけど。うん。
1:42:25
ま、普通に USB-C で繋げば Mac と見れますね。
1:42:29
うん。ブラウザ立ち上げてさっきのコマンドかなんかやったらいけ るっていけますね。
1:42:38
で、ビート、ビートがビートのなんか新しいのが、ま、出たんですけど
1:42:45
それ、あ、これビートの8こいつさっき出たやつか。
1:42:52
で、ま、ロールダウンですね。うんうんうん。ロールアップじゃなくて
1:42:58
で、ま、ラストでめっちゃ速いというやつでうん。なんかこれまでその デブは ES ビルドでビル、ビルドがロールアップだったらしいんす
1:43:07
けど、それがロールアップになったという感じでま、差が小さく、あ、 差がなくなったと
1:43:16
いう感じですね。で、ま、速いよと。
1:43:24
これはやま、でもラストはラストだったのかロールダウン使ってなかっ ただけで
1:43:31
ビートがロールダウン採用しましたよってこと?
1:43:35
ロール ES ビルドは5ですかね。
1:43:41
いや、5対ラストで速度下がるのか。
1:43:46
ああ。ま、ま、5対ラストかなというしくみか。
1:43:50
うん。
1:43:53
で、ま、ロールダウンっていうのはなんか聞いてたけど
1:43:57
ロールダウン全部いったんすねといううん。
1:44:02
ま、速い速いよ。速いよって感じか。うん。
1:44:07
あ、なんかすごい速いらしいすね。ああ、見た見た見た。これ速いよ ね。
1:44:13
うん、確かに左の方は納得感がある速度。うん。納得納得
1:44:20
ま、全然速いけどな、これでも。
1:44:24
ま、上げたらいいんじゃないすかっていう感じすね。うん。
1:44:29
で、なんかビートプラスってのがあって、これがなんかバイオーム みたいななんか ES イントとかうんうん。うん。全部入り?はい、
1:44:38
全部入りのやつらしいすね。
1:44:42
ローン、ローマローム、はい。ローマはもう昔からありますね。
1:44:47
元々ロールアップの名前だっけ?バイオーム、バイオームのバイオーム か、あ、バイオームの名前?そうすね。ローマが目指したところに
1:44:57
そうそう。作ってるってこと?そうそうそう。
1:45:02
なんか諦めたんだよね、そのそうそうそうそう。まあビルドとかむずい から諦めてちょっとちっちゃくしてバイオムっての作って別の
1:45:11
リポジトリすね。うん。うん。
1:45:16
これはなんかうん、こってビートプラスは結構全部入りみたいなうん。
1:45:24
これビートの系統の話ではないんすよね、多分。全然関係ないやつす ね。本当だね。
1:45:33
ま、なんか違うんだ。やつっぽいけど
1:45:39
多分多分
1:45:44
多分違いそう。うん。
1:45:48
これなんこれ?ビートってあれか、そんなにバージョン上がったんだか な?知らない。
1:45:56
OX イントうん。ま、リンターだね。へえ。あ、ラストのなんかやつ あるんすね。うん。オキシデーションコンパイラ
1:46:08
オックス、なんかフォーマッターもあったはず。ありますね。ああ、 それそれ、うん。プリティアコンパティブルフォーマット、ええ。あ、
1:46:18
バイオームしか速い?速いよ。え?速いらしい、らしいよ。バイオーム の上位互換?もしかして
1:46:28
今こっちなんすか?の説もある。マジか。
1:46:33
説あり。こっち行けばいいんじゃないすか、じゃ。
1:46:38
ビートプラスじゃなくてこれか。これだったのか。いや、わかんない。
1:46:44
いや、別に全部入りはまあいいんだけど、結局これ使ってるんだったら これ使えばいいんですよね。多分。
1:46:52
ビートプラスああ、ま、ね、うん。これを使えば
1:46:58
ビートプラスさ、ちょっとどういう立ち位置なんかあんまよくわからん けど。
1:47:04
本当だね。公式じゃな、ないんだね。なさそうだよね。
1:47:14
うん。いや、てかみんなラストまて
1:47:22
へえ。あ、これ使おうかな、じゃ。
1:47:29
うん。
1:47:33
知らないと。
1:47:37
いや、そうだよね。プロンプトってどこちょこまあ遅いじゃん。
1:47:42
遅いっすね。
1:47:45
慣れちゃってるけど遅いといううん。
1:47:51
で、ま、あとは AI 系すか。いつもボタン、リセットボタン押して くれるおじさんよ。
1:48:00
これ4回目すね、この人、この1週間で。
1:48:04
で、結局何かしらバグってた、バグってたんだよね。あ、なんかバグっ てらっしゃったらしいっすね、その数パーセントの人だけがなんか
1:48:12
バグってたと言ってたけど
1:48:17
ああ。
1:48:19
ないか。これか?テイト? Twitter の
1:48:27
あれ?
1:48:29
あのあれがあったはずなんだけど。
1:48:34
うん。 Open AI の記事かなんか?
1:48:38
いや、いや、いや、この人が今日リセットしたかどうかっていうサイト をなんか
1:48:44
そうそうそうそう。有志が作ってておもろかったなと思って
1:48:51
どっかに貼ったんすけどそうそうどっかに貼ったんすけど見た。
1:48:57
で、この人がまたそれにやるアクションしててあ、ここ
1:49:02
イエスって言ってあ、今日はノーでした。
1:49:10
いや、もうなんかこんな感じになってましたね。うん。
1:49:15
なんか1週間で4回ぐらいやったから
1:49:19
ネタになってて
1:49:24
いや、本当にもう無限に使える感覚だったんで、今週か、今週は。
1:49:31
20%使っても99、あ、もう100になってまたすっ使ってまた 100になってみたいな。
1:49:37
Open AI のさ、そのツール群っていうか、サブスクって あんまり切れないって聞いたんだけど、やっぱ X ハイでやると
1:49:44
切れるの?いや、そんなことないすね。いいね。
1:49:49
うん。なんかクロードとかよりも全然節約になるとかいう話をどっかで 見たんだけどそうですね。全然切れないす。クロードは一瞬で切れる
1:49:59
けど、ソネットでも5.4 XI でも全然使えますね。うん。いや、 今週やっぱ1週間ずっと仕事しててもう完全に
1:50:09
GPT 5.4のツール群を整備し始めたもんね。よくて
1:50:15
いや、めっちゃいいすね、 XI は。うん。クロードオーパス
1:50:21
そうなんだよね。100万トークンのやつで使ってたんだけど全然 GPT 5.4の方がなんか会話がスムーズというかし仕事のフローを
1:50:30
までやってくれるから気が利いてる。
1:50:34
いや、やっぱなんかコーデックスもともともプランいらない、ま、い、 いりますけどま、プランいらないって言われるぐらいすごいコード読む
1:50:41
らしくてうん。周辺コードまでちゃんと読んで
1:50:46
きれいにしてくれるからいや、完全にうん。
1:50:52
なんかプラン、ま、勝手に自分でプランモード入っ、ま、入るまでいか ないけどトゥードゥーリストみたいなのはくるしそうそうそうそうそう
1:50:59
すね。クロードもま、そうっちゃそうだけどより、よりその傾向がある 感じはする。うん。
1:51:07
かなりいい感じすね。いや、もうなんか本当に次元が変わった感あり ますね、この XI でうん。
1:51:18
できなかったことがどんどんできるようになってもうちょっと仕事の やり方がかなり変わった気がする。うん。
1:51:26
あ、これループね。ああ、なんかこれ言ってたわ、仕事場の人が。 レビューを自分に来たやつを全部巡回しててやってるみたい。
1:51:37
はい。
1:51:39
へえ。パソコンスリープにならないの?
1:51:44
ん?これをさ Mac で打ってるとして、でもスリープにはなると このセッションだからなるな。なるよね。
1:51:55
Mac を閉じたらスリープになりますね。これまいっててたローンチ D だけ Mac の、そういう感じじゃないの?
1:52:04
あ、そういうこと?このクローンのセッシュ、クロードのセッションを ずっと立ち上げとかないといけないってこと?
1:52:11
これってどういう仕組みでなってんのかね?わかんないす。ローンチ D だったら
1:52:16
うん。普通にローンチ D 書き込みに行ってんだったら、ま、あの、 Mac がスリープになってなければやってくれますね。
1:52:24
ローンチ D は Mac がスリープになってたら動かないす。 スリープになるの?あ、そっか、そっか。スリープから解除したらこれ
1:52:33
やるべきだったねみたいなの見てくれるというそうそうそうそうそう。 そうです。
1:52:38
ま、 Mac 半開きにしとかないとだめすね、ローンチ D 場合 は。
1:52:43
でも半開きしといたら、はい、死なないんで。今の仕事のやつ、 Mac を貸与されててさ、セキュリティソフトで10分で強制的に
1:52:52
なんか放置できなくなるみたいなの切れるというか
1:52:56
いや、そこをなんとか頑張るっていうと、あれです。あの、ログ画面 なるとこすよね。あの、パスワードを入れなきゃいけない。
1:53:07
うん、多分。それでもスリープじゃないんで動きますね。
1:53:13
パソコン自体が動いてるから、あのログアウト画面は別にスリープなっ てないす。動いてますね。
1:53:21
ネットワークとか切れてんだけど、なんかあ、そうなんすね。スリープ なのかな?なんかよくわかんない状態で、とりあえずあのロック画面と
1:53:30
かいう設定の項目で全部10分とかなってんだよね。ああ。触れない それは僕もそうなんすけど、動きますね、夜中ずっと。動く?ああ、
1:53:39
じゃ、ちょっとやってみるか。うん。あ、ロック画面ってあれあれで なんかこれをやらなかったら10分で切れるみたいなやつの設定が全部
1:53:46
10分になってるみたいな。はい。僕のパソコンもそうですよ。で、 あのセキュリティソフトで全部触れないようなってるんで。うん。
1:53:57
ローンチ D さえ触れればか
1:54:00
あ、そうそう。
1:54:02
うん。
1:54:03
うん。
1:54:06
マージリクエストレビューして欲しかったらレビューは俺に設定絶対 しろよって口すっぱく言って終わるか。うん。
1:54:16
ま、もはやもうプルリクのレビューしなくていいと思いますけどね。
1:54:21
もうしてないっすもん。
1:54:25
いやここなんか前前話してなかったしたっけ?レビューはもうしな、し ない方がいいって。
1:54:31
前だっけ?でもなんかそうね今週か先週か
1:54:38
あげた気がするけど話題にもなんか
1:54:44
あ、レビューっていうか AI にレビューをしてもらいにプルリクを 出してその自分がレビューはに設定されてるやつを取ってくる
1:54:54
コードコードっていうかスキルとそれをレビューするスキルを増やし てるかがそれにひっかかる条件ではい。頑張ってほしいみたいなそう
1:55:03
そうだ結局人にレビューじゃなくてま、結局 AI にレビューさせん だからうん。ま、もう
1:55:10
AI がいいって言ったらいいと思うんですよ。うん。
1:55:13
本当はねこれなんかサーバーとかでボット巡回させときたいんだけど ま、仕事場の都合上それはちょっとできないっていうかまあ
1:55:23
ちょっと部長とかに打診すればなんとかなるかもしれないぐらい感じだ けどとりあえず僕は働いてますよみたいな気持ちで
1:55:35
自分のパソコンでループ出したいみたいなはいはいはい。
1:55:39
で、プルプルあ、 PR を引っ張ってきて自分のローカルで エージェントやらせてあ、そうそうはいはい。今ねアプルーブしてない
1:55:47
けど自分がレビューはになってる一覧を取ってくるやつとレビューする やつとスキルあってうん。
1:55:56
とりあえずそれループしたいってなっていううんうんうん。
1:56:00
まあいいんじゃないですか?ループで
1:56:05
ループでうん。でやってもいいしま、普通にコマンドシェルでループ 回してもいいよ。でもいいし
1:56:14
ま、僕の影を使っていいんですよって。
1:56:19
おおここで宣伝していく。ま、僕はこれ使ってますけどね。ま、これ 結局だからローンチ D に入れるだけなんでうん。 UI まあこれ
1:56:28
Python のスクリプトかなんかやってんだけ?これ Python で単純にローンチ D に1行入れててその
1:56:34
Python が呼び出されてで、あのディレクトリにドットカゲの中 にタスクスにマークダウン入れといたら
1:56:41
そのマークただ呼ばれるだけとこれですね。うん、カゲタスクスマーク ダウン入れといたらフロントマターでなんか
1:56:51
論理式書いてま、クロードで動かしたりとかコーデックスで動かしたり とかで、動かしたくない時間とかオートストップとかま、入れといて
1:57:01
ワークリア入れといてあのタスクやらせたらそれで動くと。
1:57:08
で、クロードだとはい、クロードハイフン P とかでインラインで 動くやつで
1:57:14
ま、デンジャラス3でま、やってもいいしまあといううんうんうん。
1:57:19
これデフォルトのデンジャラス3にしてたような気がするから一応 オーバーライドできるんで自分の好きなコマンドで立ち上げて
1:57:29
でもいいしはい、ま、なんでも普通にローンチ D に直接書き込んで もいいと。
1:57:39
うん。ま、コードレビューの話ついでにいくと
1:57:43
まあそうですね今のままレビューを人がやり続ける組織はコード レビュー敬陵化した組織に淘汰されると。
1:57:52
あ、もう物理的無理っすからね。うん。
1:57:56
ま、だからはい、クロードだとサブエージェントですかね。ま、あれで やらせるのがいいと思いますけどね。
1:58:04
レビューをはい。えっとなんかそもそも分離する必要もないと思ってて なんかローカルでやれやりゃいいじゃんっていう
1:58:13
その自分の環境でレビューしながら作ればいいというか
1:58:18
ああ、ま、チーム開発っていうか自分でやればいいみたいなそうそう そうそうそう。うん。いや、そうだよね。いや、そうなんだよね。必ず
1:58:26
それ入れるようにしてるローカルでうん。ま、そもそももう
1:58:32
綺麗なやつが出てくるっていう
1:58:35
ま、一応入れてもいいけどはい。うん。なんか組織の改革と難しい過渡 期にはあるかなって感じ。うん。
1:58:45
いや、結局なんか遅いんですよそのプルリクに作ってそこでなんか別の エージェント動かしてみたいなでそこのやり取り遅いんで
1:58:55
いや、本当にオーバーヘッドめっちゃかかるよね。オーバーヘッドが すごいあるからそのローカルの中で全部一緒に動かしたらうん。もう
1:59:02
それでなんか例えば何もレビューしなかったら60点のやつが出てきて で、その GitHub 上でプルリクで
1:59:10
バーっていっぱい指摘がついてで、そこでまた取り込んで直してみたい なの遅いからそれ60点ローカルではい、80点とか90点とか
1:59:20
先にしといてやった方が指摘が少ないから
1:59:25
チーム開発の定めというかま、別に AI が出る前からができない人 がプルリクで何回レビューしても変なことくるみたいなそうですね。
1:59:36
あ、もういいいいですって言ってフォースプッシュし始めるみたいなの はよくやってましたけど。
1:59:43
うん。いや、難しいよな。いや、やっぱ社員とかだったらね立場上 なんか
1:59:50
ここら辺
1:59:52
とでねうん。
1:59:56
その辺のハーネスをちょっと制御しして
2:00:01
もう勝手に使われるようにしておくとかですかねサブエージェント入れ てうん。
2:00:07
で、最近ねなんかリポジトリその Android アプリを作ってて ま、裏側のバックエンドとかもま、インフラとかもま、色々リポジトリ
2:00:18
分かれててアプリ開発の人たちとかサーバー開発の人たちとかいる中で 自分がなんかサポートみたいな立ち位置でレビューとかよくするみたい
2:00:28
な感じであと AI 活用支援とかま、メインで進めていきたいね みたいなそういう推進的な役割あるんだけど
2:00:38
はい。ま、まずちょっと今の時点で生産性悪い人たちが退場してからの 方がなんか紛れがなくて切れるんじゃないかっていうちょっと
2:00:48
うん。ちょうど今ま、でもその会社側もま、別に自分もフリーで入っ てる意味だからあれだけど会社側も人員削減とかやるみたいな感じで
2:00:59
いろんな請負各社に通じとか出しててうん。みたいな感じだからうん。 なんか今の時点でどれぐらいやろうかなみたいな本当は自分の
2:01:10
用にリポジトリとかプロジェクト横断で情報ナレッジ蓄積されるみたい なリポジトリあるんだけど
2:01:19
で、チームメイトにまだ共有するタイミングじゃないかなみたいななん か微妙なうん。
2:01:24
身の振り方みたいななるほどなるほどね。それははいはいはい。
2:01:29
うん。身の振り方だねまさに。なんかとりあえずま、活動はしないと いけないからそのアプリ開発の中でコーデックスのスキルを書いたりと
2:01:39
かしてたんですけど今週はうんうん。うん。そもそもアプリとサーバー で人が分かれるの意味わからんしなとかもともと言ってたんだけど
2:01:50
うん。そこら辺を提案をしながらいらない人を切ってもらってから ちゃんと運用できるナレッジリポジトリみたいなまとめるかみたいな
2:02:01
ちょっと考えたりしてんですよ。うん。そうそこら辺がそうそう社員 だったらもうなんか否応言わさず作ってお前らいらんって切れるんです
2:02:10
けどうん。まああ、なるほどね。とは結構いっぱいなんかいろんなやり 方あるから
2:02:18
もう共有するやつとその自分で育てるハーネスをなんか分けて
2:02:24
やってくのもいいかなで、ま、その自分の生産性がだけがどんどん 上がっていく状態にもしつつ
2:02:30
ま、これぐらいは多分みんなも使った方がいいかなみたいな共有しつつ みたいなあ、そうそうそうそうそう。
2:02:36
で、僕もあれなんすよモノレポでモノレポの部分はもう誰にも共有して なくて自分用のモノレポ作ってそん中にその会社のレポジトリ1個に2
2:02:46
個3個って入れててで、そのモノレポ部分のスキルとかはもう全部自分 用なんすよね。
2:02:52
うん。もう別に他人に別に強制する必要もないから自分がやりやすい ようにやりたいので
2:03:00
作ってみたいな感じでやってますね。これってちなみにサブモジュール とかでやってる?サブモジュールだとなんかコミット固定されるから
2:03:08
物理的にクローンしたパスとかを書いてる?いやここにあるようみたい なと
2:03:17
えっとなんかもうぎ今はうん。あのあれでやってますねあの
2:03:23
ぎあのなんだぎっていくのは
2:03:29
ぎっていくのはで、あのワークツリーでやってるんすけど例えばうん。 こげ1あ、プロプロジェクト
2:03:39
1うん。うん。うん。これのワークツリーをここに
2:03:45
こう
2:03:47
こう切られてうん。みたいな
2:03:53
なんかここにそのワークツリー1みたいな
2:04:00
感じ。あ、リポジトリ、モノリポニし、あ、モノレポではあるのか、 元々。そういうこと?ん?いや、いや、いや。
2:04:09
ここ、ええと、ここが僕のうん。あの自分の AI 作業場みたいな。 そう、そう、ワークスペースでうん。ここになんかいろんなハーネスが
2:04:20
いるんすよね、その。うん、うん、うん、うん、うん。このドット エージェンツ、ワークグループ、ロード
2:04:27
あ、設定のタグがで
2:04:32
ここはだ共有してない。誰にも。うん。
2:04:37
っていう。で、ここにその自分の会社のああ、そういうことか。はい、 はい、はい、はい、はい。クローンするとでも、こ、こいつも一応
2:04:45
ギットリボ処理なんで、僕のプライベートリボ処理管理してる。うん、 うん、うん、うん、うん。こいつが入ってきちゃうからこいつをギット
2:04:52
イグノーラであのああ、そういうことね。プロじわんっていうのを入れ ちゃってる。プロじわんっとプロじ
2:05:00
わん、ワークツリー。もう入れちゃってああ、イグノーラするのか。 うん。
2:05:09
で、ここは別にだっていらないんでこいつらは管理して、こ、僕管理し てのここだけなんすよ。
2:05:16
うん。ここは知らないんで、何も。うん。
2:05:22
ドットの方がなんか蓄積されやすいのか。なんか自分なんかリポジトリ のメタデータみたいなもって、これはこれのリポジトリでこういう
2:05:30
チームが管理してて、こういうことをやってて、みたいな、こういう 技術使ってるみたいなスキーマみたいなジェイソンを1個置いて、そこ
2:05:37
にローカルのパスを書いて、ここにあるよみたいな
2:05:42
のをやってるんだけどほう。そのメタデータはどこに置いてあるんす か?ああ、は自分のそのワークスペースみたいなリポジトリあって
2:05:54
で、そこからローカルのパスを参照させるみたいな方式になってんだよ ね。ええ。だ、プロじ、プロじ1はこのパスに置いてるみたいな。
2:06:03
ああ、じゃあ、もうなんか超えちゃうんすよ、この上を超えて別のあ、 そう、そう、そう、そう、そう。ああ、なるほど。
2:06:10
まあ、別、それでもいいんじゃないすか。うん。そこはなんかあるんか な?うん。え、そこ、うん、うん、うん。
2:06:19
そのリポジトリでなんかログ調査とかをツールスキルとかを生やして、 ま、例えば G Cloud コマンドでログのリード API とか
2:06:28
叩けるようにとか叩かせてるんだけど、なんかこのコードを見て、ここ ら辺でこういうログ書いてて、そのログが何時何分に出てみたいな。
2:06:36
うん。これはサーバー側ではこういうログになってるんじゃないか みたいな調査勝手にやらせるみたいなことを最近しててはい。
2:06:46
まあ、それ
2:06:49
そう、なんか、ゆくゆくなんかその運用チームみたいな人たちがいて、 エンジニアじゃないんだけど、ログとかアラートとかの電話をつけて、
2:06:59
なんかサポ専みたいな人たちと連携取るみたいな人たちがいるから、 なんかそこら辺
2:07:05
に活用できないかなみたいな気持ちでうん。そういうリポジトリを非 エンジニアがギリギリそういうコーデクシ以外だけ立ち上げて、自然
2:07:15
言語でなんかできるようにしたいなみたいな気持ちが
2:07:19
若干はい、へえ。あし、非エンジニアが?
2:07:24
あ、そう、そう。だから、まあ、なんか将来的にはそのエージェントの ボットみたいななんかチャットにいる形が理想かなと思うんだけど。
2:07:33
うん。非エンジニアがクロードとかクロードアプリ作ったらいいんじゃ ないすか?
2:07:40
アプリ、デスクトップアプリってこと?そう、そう、そう、そう。
2:07:46
ああ、これ言ってなかったんすけど、最近あのうちのデザイナーの人に うん。あの、クロードのデスクトップ入れてもらってプルリクまで
2:07:57
作れるように環境整えました。おお。
2:08:01
おお。で、全く1行もコード書かずに、あの、プルリク作っても最近 マージしました。うん、うん、うん、うん、うん、うん。ええ。
2:08:10
認証とかだけなんか設定、連携の最初やったしてあげてで、ギット貼る と、そのフィグマフィグマはだからデザイナーの方がプロなんで
2:08:20
ここの連携してそのコードとフィグマの差分とかをクロードに検査させ たりとかフィグマでこれ、これ作ったから、これちょっとあの、プル
2:08:29
リク作ってってか、その、書いてって言われるから。プルリクまでやっ てくれるし。
2:08:35
で、プルリク作ったら、もう、あの、環境デプレスするのしてて、今。 あの、マージ前にそのプルリク、プルリクごとにうん。あのユニークな
2:08:44
サブドメインで、あのああ、いいね。だ、そうしたら、もう、 デザイナーもすぐ見れるんで、その画面で普通に。うん、うん、うん。
2:08:53
ローカル環境なくても、はい。問題なかったら、もう、それ
2:08:58
まあみたいな。
2:09:01
で、そういうのにやっぱ向いてるんすよね、クロードの。うん。このコ ワークとか
2:09:08
まあ、あれか、やっぱなんか設定が複雑なところとかは普通にクロード ランとかに外に出してから、それをデスクトップアプリ系でつなぐ
2:09:17
みたいな、そういうのがいいか。
2:09:21
うん。
2:09:24
一応、ここはスキルで全部やっちゃいましたね。
2:09:27
うん。なんか G Cloud コマンドの設定がだるいんだよね。 社内プロキシとかあったりとか。へえ。
2:09:38
なんか独自の証明書をここに設定して、みたいな。この、このっていう みたいな。
2:09:45
うん。まあ、ね。まあ、うん。あ、でも、あれか、証明書は普通に リポジトリに管理しといていいから、それ、イニスクリプトだけ書いて
2:09:53
もらう、書いてもらうじゃない、実行してもらえばいいよね。あの、 なんか G WS みたいな出たじゃないすか、あの、 Google
2:10:01
ワークああ、うん、うん、うん。スペース CLI うん。これの スキル作ったんすよ、僕。
2:10:08
ほう、ほう、ほう。で、これの中身って、あの、カーカールは絶対入っ てるじゃないすか、どの環境でも。うん、うん。で、カールでこの
2:10:16
GWS の、あの、 GitHub リリースイズから最新のなんか G zip ファイル
2:10:23
落としてきてアンジップしてインストールするみたいなのをスキルに 書いて、僕が。うん。スキル MD に。
2:10:33
うん。で、それでもうインストールさせて、その、非エンジニアの人 たちのパソコンに。うん、うん、うん。で、使うよ、使えるようにして
2:10:41
ますね。
2:10:44
ああ、ま、確かに、そういうジップに全部そういうものもバンドルし ちゃって、それを見させるっていうのもあり。で、クロードデスクトッ
2:10:54
プって、あの、スキルのインストールできるんすよ。で、僕がその スキル MD だけ配布、ま、渡して、マークダウンだけ。これを
2:11:02
インストールしてって言って、ポチッと押すとスキル MD が入って で、スキル MD 、この、はい、カールとかでボロボロのやつを
2:11:09
インストールするやつが入ってるんでもう勝手にクロードが実行して くれて
2:11:14
使えるようになるという。あ、確かに。証明書もリポジトリに入れ ちゃったらいいな。確かに。
2:11:20
うん。こうしてあ、確かにな。うん。いや、だから、もう、何もいら ないんすよ、け、 MC P もいらないし
2:11:31
何もいらなくて、カールさえあれば何でもできると思ってます。うん。 確かに。はい。
2:11:38
で、その、なんだ、フィグマも、あの、トークンはだけはちょっと作っ てもらわないといけないすけど、画面から。うん。これ作って、なんか
2:11:46
適当なファイル名でテキスっフィグマトークンのテキストみたいな作っ てもらって、これあの保存して置いてもらって
2:11:56
で、あとは全部カールでいけるじゃないすか、フィグマって、あの レスト API あるから、公開されてるから。
2:12:01
これ全部カールでいけるんで。うん、うん、うん。
2:12:07
という。
2:12:17
で、ギッとハブ、そうすね、 GitHub もなんかそんな感じで いけると思いますね。
2:12:27
うん。うん。みたいな。
2:12:33
あ、デスクトップアプリでいけるか。はい。
2:12:39
いけるかな?いけるかな?今みんな、そうすね、クロードデスクトップ 入れてますね、非エンジニアの人は。うん。
2:12:46
うん。ああ、そうなっていってほしいよな。はい。
2:12:53
で、こっち側がスキルを渡していっていろんなスプレッドシートとか アクセスできるようにしてあげたりとか。うん。
2:13:00
うん、うん。
2:13:03
やってます。 G Cloud コマンドのオーストかってどういう フローになるのかな?その場合。いるで撃って、この URL で認証
2:13:12
して来いって言って、トークン貼り付けるわあるとして。
2:13:18
あ、自分の、あ、でも、サービスアカウントの方がいいんじゃないす か?わかんないけど。そのやり方が。
2:13:24
あ、ま、でも確かにそうだね。あ、確かにそうだ。 G Cloud で、オースでやるその人になりすますから、結構権限強くなっちゃうん
2:13:33
と思うんすよ。ま、ちょっとどういうあれかわかんないけど。
2:13:37
普通にサービスアカウントで。確かにな。うん。確かにな。顧客に配布 するとしてもサービスアカウントの方がいいな。
2:13:46
ま、その人のなりすましでやるかもっと絞ってうん。ま、ロギング ビューアとかね。ビュー権だともうリードしかできないみたいにするん
2:13:58
だったらサービスアカウント。いいすね。あ、確かに。
2:14:03
あ、でもなんか共有の方のプロジェクト、サービスアカウントのキー 発行できないんだよな。
2:14:09
なるほど。
2:14:13
いや、オースの方がいいって。
2:14:17
なんでもできちゃうと思うんで、この人の権限使う。
2:14:22
いや、そこら辺がなんかそうなんだよな。身動き取りづらい管理体制に なってるのもちょっとめんどいな。っていうのもありつつ。なるほど。
2:14:33
ま、でも確かにな。そうす、なんか自分のプロジェクトでなんか何でも 好きにしていい Google Cloud のプロジェクトとなんか
2:14:42
もっとでかい、何チームもいるプロジェクトに相乗りしてて、そっちに サーバーのログが乗ってるみたいな。なるほど。で、そっちはそうなん
2:14:50
で、サービスアカウントの JSON のキーのやつダウンロードでき ないんだよね。
2:14:55
ああ。なるほど。
2:14:59
ま、難しいっすね。そう、そういうめんどさはね、ちょっとある。 なるほど。
2:15:06
で、サービスアカウントだと、例えばスプレッドシートとかもそう、 サービスアカウントのメールアドレスに招待すればそう、見れるみたい
2:15:14
な。ホワイトリスト。ああ、なるほど。はい。
2:15:19
なんか、ほげほげ@うん。ほげプロジェクト。うん。あるね、サービス アカウントみたいな。うん、うん。うん。
2:15:28
とかな。みたいな感じすね。うん。
2:15:33
確かにな。それは。
2:15:42
そう、オースしちゃうと全部見え、見えちゃうんで。
2:15:46
あ、でもサービスアカントってあれか、なんかあ、でもそれは微妙か。 プロジェクトまたいでサービスアカウントに他のプロジェクトの権限
2:15:56
渡すみたいなできるってデックで見たんだけど。そうなんすかね。なん かどっかでねできるかもすね。うん。そのメアドにそのプロジェクトの
2:16:06
ロールつけるみたいな。 AWS ではできますけど。
2:16:11
Google はどうなんだろう。うん。できてほしい。それができれ ば、自分ちで好きにできるサービスアカウントにつけてもらいさえすれ
2:16:20
ばちょっとロギングのビューアだけつけてもらえませんかねって言え ば。うん、うん、うん。
2:16:27
いけるかも。かもすね。
2:16:32
ま、そうすね、この辺のそう、そういうありすね、というキーエンジン の。
2:16:37
ふーん。
2:16:40
で、ちょっともう時間も経ってきたんで、サクサクいっと。
2:16:45
うん。たまご寿司。たまご寿司は草です。
2:16:50
なんか泣いたりするらしいすね、これ。なんか怒ると泣く、と褒めたら これ泣いてる。
2:17:00
悲しそう。
2:17:03
ワットザファックイズフラム、エブ。なんて書いてた、今?のっちって こんなそうすよ。
2:17:11
うん。こんなビヨリンってなるか。これ、いいすね。
2:17:18
めっちゃ泣いてる。
2:17:22
号泣してる。
2:17:27
これ何?これうん。スキルだと思いますね、多分。ふーん。
2:17:34
裏側。何なの?パスリーなの?何なの?うん。
2:17:38
今の多分スコアをなんかどっかの JSON とかに書いてんじゃない すか?エモーションスコアみたいな。スキルで呼び出して。
2:17:49
これどういう機能で書いてんだろう。
2:17:56
おもろい。
2:18:01
ま、おもろい。うん。
2:18:05
あ、あとなんかそのこれもあ、これこれ。これも多分ちょっと似たよう な感じで
2:18:14
このスキルしかないんで、はい、はい、はい。履歴参照して、その利用 者が何がわかっていて、何がわかってないのかを推測する。
2:18:23
そう、新人教育を使うという。へえ。
2:18:27
こういうのだからスキルは向いてます。よね、こういうの。うん。
2:18:32
技術理解度とか今、何もわかってないって言われそうだな。全て任して ますね、みたい。何も言ってきません。
2:18:43
どうなんすかね。うん。うん、なんか GPT 5.4はあまりにも賢 すぎて、もう自分でいいと思うように進めるっしか言ってないんだよ
2:18:52
な。うん。そうそう、なんかソフト雑誌で自分がいいって間違えたら 負けるみたいな状態が嫌だからはい。あ、そうそうそう、それわかり
2:19:00
ます。はい。もうコード1行書きたくないという。
2:19:05
いや、なんかちょっと自分でこれいいんじゃないと思ったら全然もう 負ける。愛着になる。それが嫌で。愛着。はい。それはわかります。
2:19:15
だ、それもちょっとしたこともそうだね。投げた方がいいと思います ね。ちゃんと。こういうのがいいんだと思うんだけど、どうって。
2:19:22
うん。うん。いや、もう、もう自分の思いように進めてって。あ、いい から、いいから、みたいな気持ちになって。
2:19:30
ま、ただ、あの、オーバー、なんて言うの?あのオーバーラーニングと いうか、その
2:19:37
言い過ぎると、それに特化しちゃうんで。うん。
2:19:42
なんか変なロジック入れたりしますね、たまに。ふーん。イフこれ、 イコールこれみたいなも、すっごいスペシフィックなやつ入れて。あ、
2:19:53
自分で言うとはい。そう、そう、そのテストケースだけ通るような。 うん。見た目は確かに通ってるんだけど。中身見たらもうなんかもう
2:20:02
いや、それ無理でしょ、みたいな。汎用的に書かれてないから。うん、 うん。うまくいかないって。
2:20:09
ま、他のセッションからちょっと新鮮な目でレビューをして、説明して とかは言って、それをフィードバックとかして、してるんだけど、それ
2:20:18
ぐらいかな。ま、マルチエージェントの方でやった方がいいすね。 うん。
2:20:24
で、メタがモルトブック買収したよと。
2:20:30
ジェミニツー。ジェミニエンベディングツー出たよと。
2:20:36
あ、アマゾンのトラベルじゃないか。
2:20:39
ふーん。キルがなんか暴走したらしいっすね。へえ。リクリエイト プロダクションインバイアメントとか。結構やばいことしてる。
2:20:51
ま、 AWS レガシーだからな。気持ちはわかる。うん。
2:20:59
いや、その話を聞いて、だからその会社エンジ時代のあれもドロップ データベースほにゃららしようぜ、みたいな。
2:21:06
やっぱ合理的な判断だったんじゃないかと思う。
2:21:10
AI 推奨の改善書だったんじゃないか。
2:21:16
ドロップした方が早いんだ。ビジネス的には知らないけど、システム的 にはそうだったんじゃない。確かに。
2:21:25
確かに。ドロップして作った方が早い。
2:21:32
ま、ローカルでやるとはい。 DDD 。
2:21:37
はい。あ、この人の感想は、なんか UI はクロードの方がいいって 言ってます。あ、なんかこれ、グラフのソート、ソートみたいなやつ
2:21:46
か。あ、そうそうそう。ソートの UI を作ってくれ、って言って。 うん。で、 GPT 4は、なんかすごい説明し過ぎみたいな。情報量
2:21:56
が多いって言ってて。うん、うん、うん。ま、余計なものがうん。って ことですね。
2:22:03
って言ってます。
2:22:06
これをグラフィカルがというせ、なんかあれに使うのか、よくわかん ないなと思ったけど。
2:22:13
ま、どっちもできてはいるから。ま。そうね。本当に見た目の好みって 感じすね。ま、これもちゃんとちょちょすればやってくれると思います
2:22:23
けど。ね。ボルトでやるとこうなるって感じすね。うん、うん、うん。
2:22:30
で、クロード系がそうなるのは、なんかわかる気がする。うん。なんか うん。クロードとかいったのあれが印象あるね、なんか。あ、そういう
2:22:40
こと。うん。だからこれ GPT のこんな感じなのか。うん。ま、 シンキングじゃないか。そうなんだね。あ、はいか。
2:22:52
はいだからってのもあるな。うん、うん。エクスはい。ま、エクスはい はもっとしっかり考えろ。
2:23:03
もっと丁寧にを書いたりするそうそうそう。そうなんだ。空気を読んだ じゃなくて。ジェミニが余計なことするのはなんか、ま、そうだね。
2:23:11
気持ちは。そうだね。
2:23:16
なんかそう、そう、そう。マイクロソフトソフトオフィスですか、 みたいな。
2:23:23
大文字にしときましたよ。校正しときましたよ。
2:23:27
いや、僕でもこれよりこっちのがデカイと思っててこの20ドルプラン でオーパス4.6でやると、55%使ってま、ジェミニ5.4はいだと
2:23:38
4%しか使わん。うん、うん、うん。ふーん。それすごいね。うん。 1/10以下ですね。
2:23:45
うん。ま、僕もこの感覚すね。もっとふーん。消費少ない感じあるけど な。ま、すごいね、それ。ふーん。
2:23:54
あ、そうなんだ。あの、容量がデカイのか、省エネで動いてんのか どっちもか。
2:24:00
なんか5.4がすごいトークン量が減ったらしいっすね。へえ。 ふーん。5.3コーデックスから。
2:24:07
うまいシステムになってるのか、なんかよくわからん。
2:24:12
あ、へえ。そんな違うんだ。はい。そもそも安い。 GPT 。 じゃあ、もうコパイロットの3倍か1倍か1/3かしか見てないから。
2:24:24
あ、そうそうそう、そうです。3倍高いんだ、としか思ってない。 はい。オーパスは高いすね。はい。うん。
2:24:32
で、これ、新しいうん。ライトパンダブラウザ。
2:24:37
って何? AI が操作する用の軽いみたいな。そういう売り込みが。 ヘッドレスって言ってるから。ヘッドレスってね。うん。 GUI
2:24:45
ない。ふーん。
2:24:49
CLI 、ツールから呼び出す用のやつっぽいすね。
2:24:53
ふーん。いいじゃないすか?軽いし。
2:25:00
ヘッドレスブラウザで AI が使いやすい、軽い感じすか。そう、 そうすね。ふーん。
2:25:09
11倍速い。9倍メモリフットプリントが小さい。ふーん。ファスト スタートアップ。フル JavaScript で
2:25:17
エグゼキューション。
2:25:21
ふーん。なるほどね。ま、確かにパペティアとかでクロームヘッドレス がどうだとか言ってましたよね。 AI して。うん、うん。だから
2:25:31
そういうこと。ま、ヘッドレスやるんだったら、ま、いらないすもん ね、グラフィカルレンダー。ああ。
2:25:38
いいじゃないすか。ジーク。ジークで書かれてて。
2:25:42
ブラウザの、そっか、ヘッドレスだとレンダリングの部分何もなくて 通信して、 JavaScript 実行して。
2:25:51
うん。ま、でも CSS とかで仮想的にレンダリングとかしてるのか な。どうしてんだろうね。ここに見えるこれがこうとかってやってんの
2:26:01
かな。 CSS
2:26:06
使ってないとか?かもね。 CSS エンジンとかそういうの入れなく てもそうだね。あ、じゃ、人間がここで見えるとか言ってるの全部
2:26:17
なんか CSS の AI が解釈して頑張るって話。
2:26:22
スクショとかは撮れないもんね。ああ。ビットマップだろうね。撮って 見てとか。そういう機能とかありゃ別だけど、どうなんだろう。
2:26:33
DOM ダンプ。
2:26:36
ま、でもそういう用途じゃないならうん。
2:26:42
単純にテキストクロールするだけみたいな感じよね。うん、うん、 うん。
2:26:47
いや、すごいね。ジグがこういうの使われるんだ、って思った。うん。
2:26:54
ジグもはい、1が出ればねなかなか。確かに。でも
2:27:00
あ、これいった。あ、これもいった。で、クロードかな。
2:27:06
あ、そっか。これ、ね、機能。うん。
2:27:10
で、まあロングコンテキストなると、やっぱ精度落ちるっぽいんです けど。
2:27:15
うん。クロードあんま落ちないよ、みたいな感じですね。
2:27:20
へえ。ジェミニ、 GPT 5.4、そんな落ちてない。
2:27:29
へえ。 GPT あんま変わん、ない、感じないけどな。
2:27:35
うん。ま、そもそもこんな使ってないすね、多分。
2:27:40
ふーん。
2:27:44
なんかサマライズしてくれてるんで、裏側で。ふーん。
2:27:49
でも、コンパクトも速いしな。うん。
2:27:54
ロードコンパクト、結構時間かかるよ、って。うん。
2:28:00
ま、基本的にはもう、あんま長いやつでうん。やらない方がいい。ま、 細かいコンパクトは多分ツールでくれてると思うんで。
2:28:13
という感じすね。ふーん。
2:28:17
で最後に。
2:28:24
いや、わかるな、これ。
2:28:29
うん、でもめっちゃそう。それに動いてるターミナルがもう1枚、2枚 出てるぐらい。そう、そう、いる。
2:28:36
僕は今だから10枚ぐらいオープンコード立ててて。
2:28:42
へえ、すごい。うん。ワーク3で、あの、さっき説明した、ワーク3で うん、うん、うん。切っててこっちで投げて、エクスはいだからもう1
2:28:52
回投げたら、し、もう4時間ぐらいと動き続けたりするから。あ、いい ね。あ、それいいね。そう、そう、そう。4時間とかやっぱあれか、
2:29:01
ドッカーエージェントとかそういうの使って、安心安全で職場でも放置 したい。うん。
2:29:08
ま、あとなんかローカルでやる分には別に、どっか見に行ってとかやら ないんで。そこでずっと動かしといて。
2:29:18
ま、リファクタリングとかでもいいですけど。うん。結構高速。じゃ、 ボトルネックはなんなんだろう?ディスクレーを見て終わったことに
2:29:26
気づく能力。
2:29:31
ま、そうすね。で、コーデックス、たまに音鳴らないんだけど、なんな んだろうな。ああ。終わった時のピッとかあるじゃん、なんかあの、
2:29:39
ピッとで Mac のピボンみたいな音鳴らしてますけど。はい。 たまに鳴らないんだよな。鳴らないんすか。なるほど。
2:29:47
大体鳴るんだけど。うん。
2:29:51
ま、僕も1画面でやってるから、全部並べて。
2:29:55
うん。すごいな。ま、僕あれなんすねさんも、上、あの、ハイパー ランド使ってるんで。うん、うん、うん。ハイパー。タイルにちゃんと
2:30:05
なってる。そう、そう、そう。もう、これのためにあるのかっていう ぐらい、入れてよかったすね、マジで、ハイパーランド。
2:30:14
このターミナル横に並べて。いや、でも確かにね。うん。これ、 Mac でもやりたくなるんじゃないのかなっていう。うん。
2:30:23
Mac のなんだっけ?シフトイットだっけ?あれ使えなくなったもん ね。今なんかあるのかな?そうなんすかね。
2:30:31
なんか、一時使えなくなったから、もう見てないんだけど。うん。
2:30:38
いいよね。そう、そう、こうなるんで。うん。こう、重ならないんすよ ね。絶対に横並びになるっていうやつで。すごいね。これなんか細胞
2:30:48
分裂みたいな感じに。へえ。なるんすよ。
2:30:53
1/2の n 乗のそう、そう、そう、そう。和みたいな。はい。 1/1にする。尽くします、みたいな。うん。そういう説明。
2:31:04
黄金比のなんかやつみたいな。
2:31:09
うん。
2:31:13
これのおかげで、ま、すごい並列でできてるという感じ。
2:31:22
という。うん。うん。
2:31:27
そう、 Twitter でまた新しい AI の情報見ながらこれ いいじゃんって思って。そうだね。
2:31:36
そうか、そうか。この人はなんかインスタとか見てそうだけど。
2:31:40
そうだね。 Twitter 見てるから。うん。
2:31:44
はい。そんなところですかね。はい。結構モリモリでしたが。
2:31:50
次は4月ぐらいですか?2週ぐらい空くのかな。えっとねえっとね、 そう、次回がちょっと難しくて
2:32:00
うん。うん。発表会があるからさ。うん。
2:32:05
ちょ、待った。あ、そうだね。4つかも。うん。うん。ま、また14か かな。はい。
2:32:12
話しながらで。
2:32:15
じゃあ、はい。今日はそんな感じで。はい。はい。お疲れ様でした。 おーい。お疲れ様でした。
2:32:24
火曜日のお風呂へようこそ。土曜の朝つまろう。
2:32:45
Twitch で配信、 YouTube にアーカイブ。毎週土曜 26時と3人のエンジニア語り合う勉強会の延長みたいな場所。
2:32:52
フロントエンドの最新ニュース、 AI コーディングのつかけた現場 のリアル。包み隠さず緩く深く話そう。
2:33:00
火曜日のお風呂と土曜の朝に React Week 、の CSS 、
2:33:08
最新ブラウザの話題からここで
2:33:12
カンファレンス CP 、フロントエンドから AI コーディング、 多岐にわたるエンジニアトーク。この
2:33:22
仲間と熱い議論。火曜日のお風呂で会いましょう。
2:33:42
技術紹介ツールの話、自作環境
2:33:47
を使う、おすすめのあれこれシェアしよう。
2:33:57
火曜日のお風呂と土曜の朝に React Week 、の CSS 、
2:34:04
最新ブラウザの話題からここでカンファレンス CP 、フロント エンドから
2:34:14
AI コーディング、多岐にわたるエンジニアトーク。この仲間と熱い 議論。火曜日のお風呂で会いましょう。
2:34:24
火曜
2:34:28
日のお風呂
2:34:31
また来の来週
2:34:37
ね。土曜
2:34:41
の朝に
2:34:45
待ってるよ。
2:34:55
火曜日のお風呂と土曜の朝に React Week 、の CSS 、
2:35:02
最新ブラウザの話題からここでカンファレンス
2:35:08
CP 、フロントエンドから AI コーディング、多岐にわたる
2:35:14
エンジニアトーク。この仲間と熱い議論。火曜日のお風呂で会い ましょう。
2:35:23
火曜日の
2:35:26
お風呂
2:35:29
また来の来週
2:35:34
ね。
2:35:36
土曜の
2:35:39
朝に待ってるよ。火曜日のお風呂と土曜の朝に React Week 、の CSS 、最新ブラウザの話題から
2:35:49
ここでカンファレンス CP 、フロント
2:35:54
エンドから AI コーディング、多岐にわたる
2:35:58
エンジニアトーク。この仲間と熱い議論。火曜日
2:36:04
のお風呂で会いましょう。火曜日のお風呂また来の来週ね。
2:36:13
土曜の朝に
2:36:18
待ってるよ。火曜日のお風呂と土曜の朝に React Week 、 の
2:36:29
CSS 、