はてなブックマーク

Claude Code で HTML と Tailwind CSS (CDN 版) でモックアップを作るのが便利という話をお手伝い先の CTO から教えて貰って、試したところとても良かったので雑に書いて行く。 そもそも HTML はなんとなくわかってるが、 CSS はまったく書けないのでモックアップは今までは Figma を使って作っていた。なぜ Figma なのかというと、単に Figma 有名だし、おそらく多くの人が使ってるっぽいから情報が多いのだろうというだけ。 Figma の解説書を読んだり、Figma 公式 YouTube を見たりして色々学んで、本当に最低限は作れるようになった。実際自社サービスを作る時に開発担当者には Figma でこんなデザインがよいですみたいなものを作り、共有して作業をお願いしていた。 Claude Code でのモックアップ作成Claude Code を

自社製品の WebRTC SFU を利用した社内専用のプライベートオンラインミーティングツールを Claude Code で作ってる。プロダクト名は Misora (み空色) 。 全くコードは書いていないし、見てない。CLAUDE.md をしっかり書いて、指示は複雑なタスクになりそうな場合は、かなり詳細に指示してる。 モチベーションもともと自社専用のオンラインミーティングツールが欲しかったが、開発ツールを利用で困っていたわけではなかった。 またコストかけて作るメリットがあまり見えなかった。ただ Claude Code であれば、かなりコストを抑えて作れると判断してチャレンジしてみた。実際 1 日で最低限の機能を搭載したミーティングツールが出来た。 前提VS Code の Claude Code 拡張を利用Claude Opus 4 (/model opus) を利用WebRTC SFU S

ざっくりと書いて行く 前提Claude Max Plan $200Anthropic API Rate limits Tier 4Claude CodeClaude Max Plan $200 を契約VS Code から利用/model opus を指定色々試してみた。 Redux から Zustand への​移行React Compiler への適用を含むx86_64 上での arm64 クロスコンパイル対応C++ で書かれたサンプルコードの Python ポーティングC++ で書かれた Python ライブラリのセグフォ修正とテストC++ で書かれた Python ライブラリの各種デコーダー実装Opus デコーダーの実装とテストOpenH264 デコーダーの実装とテストlibaom のデコーダーの実装とテストC++ で書かれた Python ライブラリのサンプル実装自社ドキュメントの日

時雨堂では自社サービスに対して、GitHub Actions Self-hosted Runner を利用して負荷試験を継続的に実行しています。 GitHub Actions Self-hosted Runner は Akamai Cloud を利用して構築しています。Akamai Cloud はほとんどのインスタンスに数 TB の転送量が含まれるため、転送量課金が気になる場合でも、気軽に負荷試験を行えます。たとえば Linode 64 GB インスタンスであればインスタンスに月 20 TB の転送量が含まれた価格です。またそもそも転送量の価格が 1 TB で月 5 ドルと格安です。 GitHub Actions の設定例時雨堂が自前で開発している WebRTC 用の負荷試験ツールである Zakuro を使った GitHub Acitons の例を紹介します。 name: zakuro o

DuckDB の FTS (Full Text Search) 拡張と Lindera を利用する事で、日本語全文検索を実現できますが、DuckDB-Wasm と Lindera-Wasm を利用する事でブラウザで日本語全文検索を実現できます。Wasm なので完全オフラインで、利用できます。 さらに、クライアントのリソースということもあり一文字ずつ入力された値に対して Lindera-Wasm で形態素解析して、SQL を実行することでインスタント検索も実現できます。 DuckDB-Wasm (FTS 拡張) + Lindera-Wasm技術的には特に難しいことはしておらず、DuckDB-Wasm の FTS 拡張に Lindera-Wasm で形態素解析した結果を引数として渡して実行しているだけです。 デモサイトを用意しておきました​、もし良ければ試してみてください。 DuckDB-Wa

DuckDB を利用してベクトル検索と日本語全文検索の両方を同時に利用できます。さらにこれらの結果をマージして Reranking を行うことでハイブリッド検索をサクサクっと実現する事が​できます。 Rerankerどうやらベクトル検索した結果と日本語全文検索した結果をマージして、クエリーとマージ結果を再度ランキング付けする仕組みのようです。 ここでは参考にした記事を共有する程度にしておきます。 日本語最高性能のRerankerをリリース / そもそも Reranker とは? - A Day in the Lifeリランキング モデルによる RAG の日本語検索精度の向上 - NVIDIA 技術ブログ今回は Reranker に hotchpotch/japanese-reranker-cross-encoder-large-v1 を利用しました。 以下は参考コードです。 [projec

DuckDB-VSS と PLaMo-Embedding-1B を利用することで、ベクトル検索を実現できますが、DuckDB-FTS (Full-Text Search) と形態素解析ライブラリである Lindera を組み合わせて日本語全文検索を実現できます。 DuckDB-FTS + LinderaDuckDB の全文検索拡張は日本語には対応していないないのですが、スペース区切りでトークン化することで、日本語の全文検索を利用する事が出来ます。トークン化には Meilisearch にも利用されている信頼と安心の Lindera を利用することにしました。 今回この参考コードを Lindera の作者であり検索の専門家でもある Minoru OSUKA 氏にレビューいただきました。本当にありがとうございます。 以下は参考コードです。 [project] name = "duckdb-ft

この記事は間違いが含まれている可能性があります。 もともと自社のドキュメントでは Meilisearch で日本語全文検索を実現していましたが、ドキュメントに質問できるようしたいと思い、簡単な RAG を作りたい！と思っていました。 とりあえず、ドキュメントを分割し、ベクトル化してベクトルデータベースに突っ込んで、質問をベクトル化して結果を引っ張り、それを LLM に食べさせて解説させる、というのができればよいということがわかりました。 ベクトル化はよく使われている OpenAI Embeddings API を利用し、ベクトルデータベースは普段からよく使っている DuckDB に VSS (Vector Similarity Search for DuckDB) という拡張を使うことにしました。 自社のドキュメントをなんとかうまいこと分割して、あとは分割したドキュメントを API を叩い

VS Code の GitHub Copilot が MCP クライアントとして動作する仕組みが追加されたので、Copilot から気軽に自社製品の質問ができたら、快適ではないだろうか？考えた。 そこで、ハルシネーションをできるだけ少なくし、かつ安価で自社製品ドキュメントへの質問ができる仕組みを作ってみることにした。ちなみに LLM 系の知識はほぼ無い。 できあがった Sora Document MCP (Local) 0:00 /0:57 1× GitHub Copilot + Sora Document MCP デモ まぁまぁの速度で、質の高い回答を箇条書きで返してくれるようにはなった。 仕組みについて自社製品のドキュメントは Sphinx というフレームワークをを利用しており、reStucturedText (以降 rst) というマニアックなもので書かれている。この rst を L

なぜ自分が MCP を追いかけているのかを雑にだらだらと書いて行こうと思います。 乱文です。 オープンなプロトコル追いかけている理由は Model Context Protocol がオープンなプロトコルにしたことです。これが ChatGPT Plugins とかのクローズドなプロトコルであれば全く追いかけていなかったと思います。 MCP は Anthoropic 以外でも MCP クライアントを実装しさえしていれば、多くの MCP サーバーと接続する事が出来ます。実際 MCP を公開した Anthropic が提供している Claude Desktop や Claude Code だけでなく Cline や Cursor などが MCP クライアントを実装したことにより、MCP サーバーさえ実装してしまえば、様々な環境で利用できる仕組みになっています。 そして VS Code も MCP

これはラムダノートの宣伝を含みます。 Web は専門ではないが、勝手にお勧めの本を書いておこうと思う。 ハイパフォーマンス ブラウザネットワーキング - O'Reilly JapanWebブラウザセキュリティ ― Webアプリケーションの安全性を支える仕組みを整理する – 技術書出版と販売のラムダノートReal World HTTP 第3版 - O'Reilly JapanWeb配信の技術 ―HTTPキャッシュ・リバースプロキシ・CDNを活用する - 技術評論社プロフェッショナルTLS＆PKI 改題第2版 – 技術書出版と販売のラムダノートいろいろなところで言っているがハイパフォーマンスブラウザネットワーキングを読んで欲しい。10 年以上前の本だが、古い部分は他の書籍でカバーすればよい。 セキュリティ関連は Webブラウザセキュリティがとてもわかりやすい。今や HTTPS ありきの時代にな

DuckDB にローカル用に UI が追加されたことが公開されました。duckdb -ui で呼び出せます。既に CLI を起動している場合でも CALL start_ui() で呼び出せます。 ローカルの DuckDB のデータを利用するこの仕組み、今まで CLI で「あれ？ちょっと列が省略されてて見づらいんだけど ...」というのがなくなります。 クエリーなどをノートブックとして DuckDB 自体に保存ができるようになるため、履歴から過去のクエリーを探す作業から解放されるのもとても良いです。 DuckDB を採用する理由が増えた気がします。 ただ、DuckDB UI の仕組みは ui.duckdb.org へのリバプロっぽい仕組みのようなので、オフラインでの利用は現時点ではできなさそうです。残念。 参考The DuckDB Local UI – DuckDBUI Extension

自社では自社パッケージ製品のクラウド版を提供しています。自社パッケージは大量の JSON Lines 形式のログを出力します。 この大量のログの利用者向けと管理者向けの解析をどうしたものかとずっと悩んでいたのですが、オブジェクトストレージと DuckDB を利用する事で低コストで実現できました。 オブジェクトストレージまず、とにかくオブジェクトストレージは安価な上に何も考えずスケールする仕組みなのがログ置き場としてとても良いです。自社では Akamai Connected Cloud のオブジェクトストレージを利用してますが、250 GB で月 5 ドル、転送量 1 TB 付きという安さです。 自作のログアップローダーを利用しており、 Zstd 圧縮してからオブジェクトストレージへアップロードしています。 自社サービス規模であれば圧縮済みのログのサイズが 10 TB 行ったとしても、月 2

DuckDuckGo のサービスに Email Protection というのがあります。 {好きな名前}@duck.com というメールアドレスを取得できて、それを自分のメールアドレスに転送してくれる機能です。 ここまでならよくある転送機能なのですが、DuckDcukGo Email Protection はさらにサービスのアカウント登録時に自動でメールアドレスを生成してくれます。{単語1}-{単語2}-{単語3}@duck.com といったメールアドレスをサービス毎に生成してくれます。 とても良い機能なのでお勧めです。 DuckDuckGo Email Protection Beta Now Open to All!DuckDuckGo Email Protection is a free email forwarding service that removes multiple k

立ち位置としては零細企業経営者かつ Erlang/OTP でミドルウェアを書いてる人。 Cline は VS Code で Claude 3.7 Sonnet を使って試してみた感想をざっくりと。主戦場である Erlang/OTP では試していない。 Cline によってコードを読み込む、コードを編集するを自動化するだけで結構な革命、コマンド実行は手動でやってみた。 かなり言うことは聞かないし、なんども指示しないと使い物にならない。とにかく優先順位が付けられない。例えば、コード修正したらビルドしてテスト実行してねって言ってるのに、いきなりコミットしようとする。 試した内容SDL の v3 がでたので自社の C++ SDK 向けサンプルで SDL v2 からの移行をやらせてみた。 移行ドキュメントとビルド方法を教えて、エラーが出ないところまでを目標にしてみた。結論としては移行はできなかったが

資料を渡して解説して貰うというのは ChatGPT を利用していたのだが、かなりの確率で嘘つかれるので、だんだん使わなくなってきた。 Google NotebookLM がどうやら、それに特化しているツールっぽいということで試してみたところ、かなり期待通りの挙動をすることがわかった。 Raft の論文を読ませてチョット解説して貰ったところ、ちゃんと何を参考にしたかを教えてくれる。これはスゴイ。複数のリソースも気軽に追加できる。 さらに Studio 機能でポッドキャスト（まだ英語のみ）を生成してくれる。二人で掛け合いながら解説してくれるのは個人的に凄く聞きやすい。 さらに Studio 機能のインタラクティブモード(ベータ版)を利用すると「自分がポッドキャストに参加して音声で質問（まだ英語のみ）」できるようになる。つまりポッドキャストを聞いていて「あーこれもうちょっと詳しく聞きたい」や「こ

Grafana で DuckDB が使えたらいいのに。ログは S3 に置いておくだけで、あとは JSONL や Parquet を DuckDB が引っ張ってきて解析した結果を Grafana で表示できたら。 この夢を実現する Grafana プラグインが最近公開されました。 MotherDuck が開発し OSS (Apache-2.0) で公開されています。 GitHub - motherduckdb/grafana-duckdb-datasourceContribute to motherduckdb/grafana-duckdb-datasource development by creating an account on GitHub.GitHubmotherduckdb 自社製品のログを Fluent Bit で MinIO (S3 または S3 互換オブジェクトストレージ

自社で開発する製品は徹底して依存ライブラリをできるだけ少なくするようにしている。 実際、時雨堂の主力製品である Sora の自社管理外の依存ライブラリは​かなり少ない。 Erlang/OTP と暗号化ライブラリである OpenSSL 。そして Erlang/OTP 特有のプロセス管理ライブラリである gproc 、RabbitMQ が開発している Raft ライブラリの ra 、あとは HTTP クライアントとサーバー。そしてメモリーリーク確認ライブラリだけ。 erlang/otpopenssl/openssluwiger/gprocrabbitmq/rarabbitmq/gen-batch-serverrabbitmq/atenrabbitmq/seshatninenines/cowboyninenines/cowlibninenines/ranchninenines/gunferd/r

自社で DuckDB 向けの Language Server (LS) を開発している。目的はシンプルに「ブラウザ」や「VS Code」で DuckDB を書く時に補完やエラー、ハイライトなどを利用したいから。 DuckDB 向けの LS は、特にブラウザでの利用を想定している。DuckDB は DuckDB-Wasm というブラウザ上で動作する DuckDB がある。つまりブラウザで SQL を書くタイミングが発生する。その際 DuckDB 向けの LS があれば、気軽に利用できるのではないか？と考えたからだ。 LSP 自体は Copilot などの AI とも相性が良く、エラーを気軽に確認できたりするのも気に入っている。 0:00 /0:13 1× DuckDB という名前は製品名に利用できないので LSP for DuckDB にする予定。パッケージ名には付けていいので duckdb