ツール/開発環境

opencli-rs は、55以上の主要サイトに対応したRust製のCLIツールです。サイトごとにAPIやスクレイピング方法が異なる煩雑さを解消し、1つのコマンドで各プラットフォームの情報を取得できます。 opencli-rs とは opencli-rs は、元々TypeScriptで実装されていた OpenCLI をRustで完全に書き直したツールです。X (Twitter)、YouTube、Reddit、Hacker News、Bilibili、Zhihu、Xiaohongshu（小紅書）など多数のプラットフォームに対応しています。Chromeのログインセッションを再利用するため、APIキーなしでデータを取得できます。 出力形式はテーブル、JSON、YAML、CSV、Markdownに対応しており、用途に応じて使い分けが可能です。また、Electronベースのデスクトップアプリをコマンドラインから制御する機能も備えており、GUIアプリの操作をスクリプト化できます。 主な特徴 処理速度が最大12倍に向上 — TypeScript版と比較して大幅な高速化（例: Bilibili Hot の取得が20.1秒から1.66秒に） メモリ使用量を10分の1に削減 — 95-99MBから9-15MBへ シングルバイナリで動作 — わずか4.7MB、追加のランタイム不要でどの環境にも導入可能 インストール インストールスクリプトが用意されており、システムとアーキテクチャを自動検出してバイナリをダウンロードします。 1 curl -fsSL https://raw.githubusercontent.com/nashsu/opencli-rs/main/scripts/install.sh | sh Rustの開発環境がある場合はソースからビルドすることもできます。 1 2 3 git clone https://github.com/nashsu/opencli-rs.git cd opencli-rs cargo build --release AIエージェントとの連携 opencli-rs はAIエージェントとの連携を前提に設計されています。Claude Code や Cursor などに組み込むことで、「Hacker Newsのトップ記事を取得して要約する」「競合のX投稿を定期的にチェックする」といったWeb情報収集の自動化が可能です。 AIエージェント向けのスキルパッケージ opencli-rs-skill も提供されています。 1 npx skills add https://github.com/nashsu/opencli-rs-skill これにより、AIエージェントが AGENT.md や .cursorrules の設定を通じて利用可能なツールを自動的に検出し、自然言語でWebスクレイピングを実行できるようになります。 ...

Browser Use CLI 2.0 がリリースされた。Playwright より速く、コストも半分。起動中の Chrome にそのまま接続できるこのツールは、AI エージェント時代のブラウザ自動化の本命になりそうだ。 Browser Use とは Browser Use は、AI エージェントのためのブラウザ自動化フレームワーク。GitHub スター数は 85,000 超で、Python ベースのオープンソースプロジェクトだ。 従来の Playwright がセレクタベースで要素を特定するのに対し、Browser Use はページ上のインタラクティブな要素をインデックスで管理する。セレクタのメンテナンスが不要で、AI エージェントとの相性が良い。 CLI 2.0 の主な特徴 2026年3月22日にリリースされた CLI 2.0 では、以下の改善が入った。 処理速度 2 倍・コスト半減 バックグラウンドデーモンがブラウザをコマンド間で維持するため、コマンド実行あたりのレイテンシは約 50ms。毎回ブラウザを起動する Playwright と比べて圧倒的に速い。 起動中の Chrome に接続可能 3 つのブラウザモードをサポートする: マネージド Chromium: ヘッドレスで自動管理 リアル Chrome: 既存のユーザープロファイル（Cookie、セッション）をそのまま利用 クラウドブラウザ: Browser Use Cloud API 経由 リアル Chrome モードでは、ログイン済みのセッションをそのまま使える。API が提供されていないサービスでも、ブラウザを直接操作して自動化できる。 AI コーディングツールとの統合 Claude Code、Cursor など主要な AI コーディングツールから直接利用できる。ターミナルからブラウザを操作するワークフローがシームレスになった。 セットアップ 1 2 3 4 5 6 7 8 # インストール（pip install browser-use でも可） uv pip install browser-use # Chromium のインストール browser-use install # 環境チェック browser-use doctor なぜ CDP 直叩きが効くのか Browser Use の高速性の鍵は、Chrome DevTools Protocol（CDP）を直接利用している点にある。 ...

Claude Code を使っていると、プロジェクトのコンテキストを伝える CLAUDE.md の質が作業効率に直結することに気づきます。Anthropic 公式プラグイン claude-md-management に含まれる claude-md-improver スキルは、CLAUDE.md を自動で採点し、改善点を提案してくれる便利なツールです。 claude-md-management プラグインとは claude-md-management は、Anthropic が公式に管理している Claude Code プラグインです。CLAUDE.md ファイルの品質を監査し、セッションで得た知見を反映するための2つのスキルを提供します。 スキル 呼び出し方 目的 使いどころ claude-md-improver 会話で依頼 CLAUDE.md をコードベースの現状に合わせる 定期的なメンテナンス revise-claude-md /claude-md-management:revise-claude-md セッション中の学びを記録する セッション終了時 注意: /revise-claude-md のような短縮名では呼び出せません。必ず /claude-md-management:revise-claude-md と完全修飾名を使ってください。 インストール方法 公式マーケットプレイスは Claude Code 起動時に自動で利用可能になっているため、以下のコマンドだけでインストールできます。 1 /plugin install claude-md-management@claude-plugins-official UI からインストールする場合は、/plugin を実行して Discover タブから claude-md-management を選択します。インストールスコープは以下の3種類から選べます。 スコープ 説明 User 自分の全プロジェクトで有効（デフォルト） Project このリポジトリの全コラボレーターで有効（.claude/settings.json に記録） Local このリポジトリの自分だけで有効 インストール後、/reload-plugins を実行すると再起動なしで有効化されます。 claude-md-improver の使い方 Claude Code のセッション中に、以下のように話しかけるだけで起動します。 ...

海外サービスの UI を調査するとき、スクリーンショット内のテキストを手作業で翻訳するのは地味に手間がかかる。TSUMIKI INC. の鈴木慎吾氏（@shingo2000）が公開した Figma プラグイン Image Translator は、この作業を自動化してくれる。 Image Translator とは Image Translator は、Figma 上で選択した画像からテキストを自動抽出（OCR）し、指定した言語に翻訳する Figma プラグインだ。 主な特徴： 画像からのテキスト自動抽出 — スクリーンショットや UI キャプチャからテキストを認識 多言語翻訳 — 英語、日本語、中国語、スペイン語、韓国語、ポルトガル語などに対応 2つの表示モード — Figma のアノテーション機能で表示するモードと、テキストレイヤーとして配置するモードを選択可能 使い方 Figma で翻訳したい画像を選択する プラグインメニューから Image Translator を起動する 翻訳先の言語を選択する 抽出・翻訳されたテキストがアノテーションまたはテキストレイヤーとして表示される 活用シーン 海外サービスのデザイン調査 競合分析や UI リサーチで海外アプリのスクリーンショットを収集した際、画面内のテキストを素早く日本語で確認できる。翻訳結果がアノテーションとして画像に紐づくため、チームメンバーとの共有にも便利だ。 多言語対応の確認 自社サービスの多言語版スクリーンショットを取り込み、各言語のテキストが正しく表示されているか確認する用途にも使える。 まとめ Image Translator は、デザイン調査における画像内テキストの翻訳という地味だが頻出する作業を自動化してくれるプラグインだ。海外サービスの UI を日常的に調査しているデザイナーにとって、ワークフローの効率化に役立つだろう。 Figma Community: Image Translator 作者: 鈴木慎吾 / TSUMIKI INC.

Figma が提供する AI デザイン機能「Figma Make」を実務で活用するための実践的なコツをまとめる。1000 回以上のプロンプト作成を通じて見つかった知見や、効率的なワークフローを紹介する。 Figma Make とは Figma Make は、Figma に統合された AI 搭載のデザイン生成ツール。テキストプロンプトからUIデザインを自動生成でき、AutoLayout 付きの構造化されたデザインを高速に作成できる。 実践テクニック 1. Context 設計を明確にする AI に指示を出す前に、以下を明確にしておくことが重要: ユーザーペルソナ: 対象ユーザーの年齢層、IT リテラシーなど 実行アクション: 何をデザインするのか具体的に 制約条件: ブランドカラー、フォント指定、アニメーション仕様など 例: 「40代のITリテラシーが低いユーザー向けの、 シンプルで直感的なダッシュボード画面を作成してください。 フォントはNoto Sans JP、メインカラーは#2563EB」 2. 「大枠 → ピンポイント」の2段階アプローチ 一度に完璧を目指すのではなく、2段階で進める: 第1段階（大枠）: 初期プロンプトで全体構造を作る 対象画面の詳細説明 必要な機能リスト デザインテイスト（既知のサービス名で参照すると有効） 第2段階（ピンポイント）: ファイル名やクラス名を指定して細部を修正 3. デザインシステムを活用する 既存のテンプレートやサンプルをインポートして効率化する: 既存のデザインをキャンバスに置いて「これっぽく作って」と指示 Guidelines.md にデザインシステムとコーディングルールを記載 「〇〇画面の△△表と同様の UI で」と既存 UI を参照指示 4. Figma Design との往復ワークフロー Figma Make 単体で完結させるのではなく、通常の Figma Design と組み合わせる: Figma Make でデザインを生成 コピーして Figma Design にペースト Design で手動修正して期待通りに調整 修正版を再度 Figma Make に取り込んで再実行 このサイクルを回すことで、レイヤー構造が整理され、より高品質なコード生成が実現する。 ...

MyScaleDB https://github.com/myscale/MyScaleDB 記事 Unleashing the Power of HNSW Indexes with pgvector

NoCode: Web 制作 【2023 年最新】ノーコード WEB 制作の使い分け完全ガイド｜ Wix・Editor X・STUDIO・Webflow 各種ツールの特徴・機能・選び方 Product: Wix Editor X -> Wix Studio STUDIO Webflow Webflow 最強のサイト制作ノーコードツール『Webflow』とは？ - メリットについて数字を交えてご紹介 - Webflow とは？ノーコードツールの中で最も人気がある理由は？

ngrok 1 brew install ngrok シェルコンプリージョン: 1 2 3 if command -v ngrok &>/dev/null; then eval "$(ngrok completion)" fi ngrok config add-authtoken 1p09hGDXtLcDay6Jz3usWSG1z7L_2upHYxJggN7FbEKcRPP7U 1 2 3 /opt/homebrew/bin/ngrok config add-authtoken *********************************** Authtoken saved to configuration file: /Users/hdknr/.ngrok2/ngrok.yml Default version saved to configuration file: /Users/hdknr/.ngrok2/ngrok.yml

git update-ref -d これだけだと devel/2023-12-14 を pull できない git branch -d devel error: cannot lock ref 'refs/remotes/origin/devel/2023-12-14': 'refs/remotes/origin/devel' exists; cannot create 'refs/remotes/origin/devel/2023-12-14' From github.com:spin-dd/taihei-epm-server ! [new branch] devel/2023-12-14 -> origin/devel/2023-12-14 (unable to update local ref) error: some local refs could not be updated; try running 'git remote prune origin' to remove any old, conflicting branches update-ref でクリアされる git update-ref -d refs/remotes/origin/devel

bash スクリプト bash シェルスクリプトで引数とオプションを解析する シェル変数のデフォルト値を設定する compdef 1 2 3 4 5 6 7 8 9 eval "$(uv generate-shell-completion zsh)" _uv_run_mod() { if [[ "$words[2]" == "run" && "$words[CURRENT]" != -* ]]; then _arguments '*:filename:_files' else _uv "$@" fi } 1 compdef _uv_run_mod uv uv というコマンドに対して、_uv_run_mod という補完関数を関連付けています。 uv の後に Tab キーを押すと、_uv_run_mod 関数で定義された補完候補が表示されます。