設定画面を捨てた。Chrome内蔵AI(Gemini Nano)が毎晩1手だけ新規タブを進化させる拡張を作った
新規タブの設定画面を全部消して、代わりにChrome内蔵AI(Gemini Nano)が毎晩1回、画面を1手だけ作り替える拡張を作りました。データもAIも全部Chrome内で完結。 で、完成した仕組みに試しで一晩ぶん撃たせてみたら、AIは初手からいちばん重い手を出してきま...
View ArticleIonic + Svelteにおける役割分担と、Flutter/ネイティブ開発との決定的な違い
はじめに 「Webの技術を使ってモバイルアプリを作る」ハイブリッドアプリ開発において、近年 Ionic Framework + Svelte（SvelteKit） の組み合わせが注目されています。 しかし、Swift/Kotlinを使ったネイティブ開発や、Flutterな...
View ArticleIonic + Svelteでのモバイルアプリのプロジェクト追加手順 (pnpm対応)
はじめに Svelte（SvelteKit）の高い開発生産性と、Ionic Frameworkの豊富なWeb UIコンポーネントを組み合わせて、クロスプラットフォーム（iOS/Android）のモバイルアプリを構築する手法が注目されています。 本記事では、Nextbeat...
View ArticleZoho WidgetとLambdaの連携 第1回：Lambdaの3分割と公開URLの整理
本シリーズでは、Zoho CRMの商談画面に埋め込むWidgetから、入力確認、PDFプレビューと保存、外部送信APIへの依頼、結果の追跡までを行う構成を扱います。 UIとマスタデータの正はZoho CRMに置き、PDF生成や外部API呼び出し、結果の定期照会はAWS La...
View ArticlejQueryを剥がせない現場のための、リアクティビティ後付けライブラリを作った
つくったもの 何を解決したいのか jQuery保守が続く現場、WordPress等でモダンFWを入れる機会がない環境、「jQueryならわかる」人たちに向けて作成しました。これは過去の自分がjQueryからVueへの移行をとん挫した経験がもとになっています。モダン...
View Article月額0円の会計ソフトに、AIチャットを載せた【WebMCP対応・ローカルLLM/クラウドLLM】
以前、こちらの記事で 月額0円の会計ソフト e-shiwake を紹介しました。 その後もコツコツ時間が空いた時に開発を続け、WebMCP 対応と、AIチャット機能（ローカルLLM / クラウドLLM 対応） を追加したので、その紹介です。 アプリ: https:...
View ArticleSvelte 5 ネイティブのデータグリッド「SvGrid」— AG Grid の代替になるか
Svelte / SvelteKit で本格的なデータグリッドが必要になったとき、選択肢は大きく2つに割れます。 React 製グリッド（AG Grid など）を無理やりラップしたもの ヘッドレス専用（TanStack Table など）で、見た目は自分で全部書くもの どち...
View ArticleSvelteのtransitionが動かない。 #awaitブロックでアニメーションされない原因と解決方法
transitionが効かない問題 in:flyを付けたのに、アニメーションが動かない。 例えば次のコードです。
View ArticleSvelteKit で同じ landing を書いたら gzip 32.50 kB、Svelte 単体比 +72% — メタフレームワーク税再び
きっかけ フレームワーク比較シリーズ 6 本目、SvelteKit。 前回の Nuxt 記事で、「メタフレームワーク税」の存在を確認しました。素の Vue 28.76 kB → Nuxt 52.01 kB で +81%。SvelteKit でも同じパターンが出るか、それと...
View ArticleSvelte 5 + Runes で同じ landing を書いたら、gzip −61%。Runes の `$derived` が効きまくる
きっかけ シリーズ 023 件目、フレームワーク比較 3 本目。今回は Svelte 5 + Runes。 021 React: gzip 49.00 kB 022 Vue 3: gzip 28.76 kB (−41%) 023 Svelte 5: gzip 18....
View Articlez-indexの値をほぼbooleanのように扱うUI設計を試してみた
概要 CSSでモーダルウィンドウやドロワーを実装するとき z-index: 9999 といった大きな値を見かけることがあります。 「とにかく上に出したい」という意図での記載かもしれませんが、値を上げていくだけでは根本的な解決にならず、やがて管理しにくくなっていきます。 そ...
View ArticleSVG の d 属性、ノードをドラッグできると一気に読める（Svelte 5 で実装）
この文字列、ぱっと見で読めますか? 私は無理です。 M は Move とわかるけど C の後に 3 ペアの座標が並ぶのは なぜ 3 なのか、...
View Articleconoha-cliでSvelteKitアプリをConoHa VPSにワンコマンドデプロイ
はじめに React、Vue、Angularに次ぐフロントエンドフレームワークとして着実にシェアを伸ばしている SvelteKit。2024年のSvelte 5リリースで導入されたRunes（$state、$props）により、リアクティビティの記述が大きく進化しました。...
View Articleゆるふわフォームバリデーションづくり
フォームバリデーションライブラリの厚み フォームバリデーションのライブラリの導入には、なんとなくハードルの高さを感じてしまう。 大抵、導入の際には現場と「ライブラリ固有の世界観」との擦り合わせが必要になって。なんとか収めても改修の折には再び立ちはだかる事もあって。そんな都...
View ArticleSvelte 5の34パターンをJSON Feedで配信、SvelteKitコードベースをAIで監査する
本記事はcogley.jpの完全版の要約版です。フィード拡張フィールドの詳細、実装メモ（バージョンフィルタリング、自動検出、バイリンガル対応）、3つのインターフェースの比較表などは完全版をご覧ください。 Migrate to Svelte 5は、React・Vue・An...
View Article【Svelte】Svelte の基礎を理解する
本記事の目的 Svelte とは何かを理解する Svelte の特徴を理解する Svelte の基本的な書き方を理解する 本記事は2025年10月現在の最新バージョン 5.39 に則った内容となっています。 目次 Svelte とは Svelte の特徴 ...
View Article非推奨：Remote functionsのSchemaに引数を渡す
注意！ この方法は2025年10月4日時点でのハックです。 責任は取れません… が、一旦動いたので共有します。（そのうち動かなくなるだろうな…） 前提 現時点ではRemote functionsをラップしたものをexportできない Remote funct...
View ArticleRabee UI vs Shadcn：コピー&ペースト型UIライブラリの比較
はじめに 近年、従来のnpmインストール型UIライブラリとは異なる「コピー&ペースト型」のアプローチが注目を集めています。Shadcn-svelteとRabee UIは、どちらもこの新しいコンセプトを採用しており、どちらもSvelteフレームワークを対象としています。 こ...
View ArticleRemote functionsで詰まった〜
祝！ Remote functions、Async SSR みなさん、先日強化されたRemote functionsは使っていますか？ Remote functionsは以前まででラップしないとエラーになり、 SSRされるのはloadi...
View Article【2025年最新】フロントエンドフレームワーク選択の実践ガイド - React19/Next.js15/Svelte5/Astro比較
【2025年最新】フロントエンドフレームワーク選択の実践ガイド - React19/Next.js15/Svelte5/Astro比較 はじめに フロントエンド開発において、フレームワーク選択はプロジェクトの成功を左右する重要な決断です。本記事では、2025年9月時点で...
View Article
