Katashin

Visle の機能揃ってきたのでドキュメント作った
visle.ktsn.dev

Install Playwright で CI 時間3分使うのきつい

feat: introduce branded path types and module-id utilities to support windows by ktsn · Pull Request #92 · ktsn/visle Summary Introduce branded AbsolutePath and RelativePath types in src/core/path.ts with helper functions (asAbs, asRel, resolve, join, relative, dirname) for type-safe path manipulation Extract mod...

初めてファイルパスのクロスプラットフォーム対応やった（めんどくさかった）
github.com/ktsn/visle/p...

Claude Code が賢くなったことで Visle に実装したいけどやるのめんどくさいなーと思ってた機能をどんどん入れることができてる

Webブラウザエンジニアリング Webブラウザは、現代のコンピューティング環境において欠かせない存在であり、最も広く使われているプラットフォームの一つです。本書は、その仕組みを実践的に学ぶための解説書です。実際にWebブラウザを構築する過程をたどりながら、レンダリング、HTMLパーサー、CSS、JavaScript、マルチスレッド対応、セキュリティモデル、アニメーションとコンポジット処理、ブラウザAPI、アクセシビリティなど、モ...

気になる
www.oreilly.co.jp/books/978481...

Rust 初心者すぎて clone しまくってるからそろそろメモリ管理について学ばないといけない

自作言語のスニペット。struct で定義した型パラメーターを持つ型に対して impl でメソッドを定義している。double は型パラメーターが number の時のメソッド、get は任意の型パラメーターで定義されている。型パラメーターが string のときは double の呼び出しで型エラーが発生している。

自作言語がだいぶ Rust っぽくなってきた

もっと Discord とかでいろんなエンジニアと雑談したいな

UI 大喜利用に作ったネタつまみが、タッチデバイスで触ると思った以上に気持ちいい

長押しドラッグを活用した iOS のポップオーバーメニューインタラクションを Vue.js で実装する - Katashin .info 長押しドラッグを用いて iOS のようなポップオーバーメニュー項目を選択するインタラクションの Vue.js を使った実装方法について解説しています。また、絵文字選択のポップアップの実装例を提供し、指が下側にずれていても選択できるようにする工夫についても触れています。

この記事がわかりやすいかも。example コードの Vue コンポーネントをデモで使ってたり、[at]filename でファイル名つけて import してたりする。
katashin.info/posts/ios-me...

GitHub - ktsn/eleventy-plugin-code-demo: Add interactive HTML/CSS/JS code demos to an Eleventy site using Markdown code blocks. Add interactive HTML/CSS/JS code demos to an Eleventy site using Markdown code blocks. - ktsn/eleventy-plugin-code-demo

そういえば某懇親会で話したけど、僕のブログは eleventy-plugin-code-demo を魔改造して、任意のコード変換を挟めるようにしたり、コードブロック間で ESModule の import ができるようにしてる。
github.com/ktsn/elevent...

「パワポみたいに画像を置ければいい」から始まった地獄（Web UI 実装勉強会 #2） - Katashin .info Web UI 実装勉強会 #2 で行った LT のスライドです。テキストエディターの中に画像を自由に配置できる実装をするため、色々な工夫をしたことについて話しました。

「パワポみたいに画像を置ければいい」から始まった地獄（Web UI 実装勉強会 #2） #web_ui_devs - Katashin .info
katashin.info/slides/word-...

今回の Web UI 実装勉強会、僕からは地獄の UI の話をお届けします

型システムについて語る勉強会的なものやりたい

型システム再入門してる

“Turing Complete User” (Japanese translation) ⌇ Baku Hashimoto This is a rough Japanese translation of Olia Lialina 's essay ”Turing Complete User” (2012). このテキストはネットアートの先駆者の一人、オリア・リアリナの2012年の論考『 Turing Complete U

「チューリング完全ユーザー」が使うことを前提にしてあいまいさを大事にするという考え方、目からウロコだった
baku89.com/turing-compl...

TypeScript に Algebraic Effects がほしい（Mita.ts #8） - Katashin .info Mita.ts #8 で行った LT のスライドです。もし TypeScript に Algebraic Effects の構文があったらどうなるかの予想をし、Algebraic Effects を実装しているライブラリを紹介しています。

TypeScript に Algebraic Effects がほしい（Mita.ts #8） - Katashin .info katashin.info/slides/ts-al...

全体的に explicit で比較的冗長なのも、裏を返せばソースコード上になにが起こってるか全部書いてあるというわけで、それが Context Engineering と相性がいいという感じなのかな

Remix 3、今の時代に手動再描画は不便そうではあるけど、リアクティブシステムなどに依存しない描画の仕組みにして、状態管理やモジュール化から依存を排除したいモチベーションを感じられて、めっちゃ気持ちわかる～ってなってる

Algebraic Effects and Handlers の実装に必要で限定継続について勉強してるのだけど、自分にとってまったく新しい概念でおもしろい
pllab.is.ocha.ac.jp/~asai/cw2011...

2 reasons you should be using single color gradients in CSS YouTube video by Kevin Powell

background-clip を使った border へのグラデーション付与とか、animation-play-state を使ってホバー状態↔通常状態のアニメーション遷移を自然にするテクニックとか。勉強になった。
youtu.be/8NfafU1BgaY?...

Rust でプログラミング言語を作りはじめた｜Katashin 624字

Rust でプログラミング言語を作りはじめた｜Katashin
sizu.me/ktsn/posts/e...

マイクロインタラクションに View Transition API を使おう！（Web UI 実装勉強会 #1） - Katashin .info Web UI 実装勉強会 #1 で行った LT のスライドです。View Transition をページ全体ではなく一部に適用してマイクロインタラクションを実現する方法について発表しました。

マイクロインタラクションに View Transition API を使おう！（Web UI 実装勉強会 #1） - Katashin .info katashin.info/slides/micro...

Thank you for the info!

view-transition-name の値や view transition 関連の擬似クラスを Vue の scoped css みたいにグローバルで衝突しないようにしたいのだけど、似たようなことやってる人いないのだろうか。

デザインにブレーキをかけないエンジニアの動き方（DIST.51） - Katashin .info DIST.51 「モダンWebデザインワークフロー」で行った LT のスライドです。デザイナーにベストなアウトプットをしてもらうためにエンジニアとして心がけている動き方について話しました。

デザインにブレーキをかけないエンジニアの動き方（DIST.51） - Katashin .info katashin.info/slides/colla...

うらやましい… (5回戦突破)

Katashinさんのネームカード Vue Fes Japan 2025 のネームカードページです。チケットを購入して、あなたのネームカードを作成しましよう！

Vue Fes Japan 2025 に参加します！
チケットを購入してネームカードを作成しよう！

vuefes.jp/2025/ticket/...

#vuefes

UI の実装に関する勉強会をやりたい｜Katashin 572字

UI の実装に関する勉強会をやりたい｜Katashin
sizu.me/ktsn/posts/t...

タッチデバイスで pointercancel イベントによるドラッグ中断を回避する方法 - Katashin .info 実用的ですぐに開発に役立てることができる Web フロントエンドの話題を書いている Katashin の個人ブログです。

タッチデバイスで pointercancel イベントによるドラッグ中断を回避する方法 - Katashin .info katashin.info/posts/touch-...