はてなブックマーク

自作リモートMCPサーバーをClaudeDesktopから使えるようにする 将来 AI に仕事を奪われるかもしれない職業… その 1 つであるエンジニアをしています弁護士ドットコム株式会社の井出です。 2024 年 11 月に Anthropic 社が発表した Model Context Protocol （以下、 MCP と略す） についてご存じでしょうか。GitHub や Playwright の MCP を日々活用しているなど MCP についてご存じの方も多いと思います。そのため詳しい説明は省略しますが、公式の説明としては以下のとおりです。 MCP (Model Context Protocol) is an open-source standard for connecting AI applications to external systems. Model Context P

こんにちは、クラウドサインで CRE（Customer Reliability Engineer）をしている藤谷です。 CRE チームでは、お客様からの技術的な問い合わせに回答する際、誤った情報をお伝えしないよう、チーム内で回答案をレビューする仕組みを運用しています。ただ、従来は人力でのレビューだったため、時間がかかったり、レビュアーによって観点に差が出たりする課題がありました。 そこで今回、AI を活用した「CRE HelpDesk Reviewer」というレビュー支援ツールを開発しました。 これは、先日 kunihikot さんが構築したクラウドサインについてなんでも教えてくれる社内ナレッジ検索システム「Deborah」の基盤・仕組みを活用して実装したものです。 Deborah は、Dify × Amazon Bedrock × AI を使った社内ナレッジ検索システムで、esa（社内ナ

はじめに 現代の Web アプリケーションにおいて、パフォーマンスはユーザー体験を左右する重要な要素です。これまで、gzip、Brotli、Zstandard といった優れた圧縮技術が、サーバーからクライアントへのデータ転送量を削減し、Web サイトの高速化に貢献してきました。 しかし、SPA（シングルページアプリケーション）や API 駆動型のアーキテクチャが主流となる中で、新たな課題が浮上しています。それは、数十 KB 程度の JSON データや動的に読み込まれる UI コンポーネントといった、比較的小さな HTTP レスポンスにおいて、圧縮効率が上がりにくいという問題です。既存の圧縮アルゴリズムは、データ内にある程度の繰り返しパターンが存在しなければ、その効果を十分に発揮できないという特性があるためです。 この課題を解決すべく登場したのが、新しい Web 標準仕様「Compressi

こんにちは！　Legal Brain エージェントを開発している下山です。 Legal Brain エージェントはリーガル特化型 AI エージェントで、法律事務所や企業の法務部門での複雑なリサーチ業務を支援するリーガルリサーチ機能を提供しています。 このプラットフォームはマイクロサービス構成で、フロントエンドとバックエンドに TypeScript を採用することで開発サイクルを大幅に向上させました。本記事では、その実践事例をご紹介します。 プロジェクト概要と課題 Legal Brain エージェントではバックエンド（Go）とフロントエンド（TypeScript）で異なる言語を使用していたため、型定義の不整合や開発効率の低下といった課題に直面していました。 開発で直面した課題 バックエンド・フロントエンド間の型定義の不一致 異なる言語で開発することで、バックエンドとフロントエンド間で型定義の

はじめに クラウドサイン Product Engineering 部で主にフロントエンドエンジニアとして活動している山下慧です。 さて、この記事をご覧になっている方は、Claude Code などの AI エージェントを用いて開発していることが多いでしょう。しかし、使っている中で「AI エージェントが自分の意図とは違う仕様で開発し始めた！」「途中で寄り道を始めて収拾がつかなくなった！」といった経験をしたことも多いのではないでしょうか。 本記事ではこういった問題を解決するための手法として、まずは Kiro が提唱する仕様書駆動開発について説明します。そのうえで、この仕様書駆動開発を Claude Code で利用できるようにした claude-code-spec-workflow について紹介します。 以降は以下の環境下を前提に説明していきます：Claude Code、Node.js 18+

こんにちは、クラウドサインで CRE（Customer Reliability Engineer）をしている藤谷です。 CRE は「Customer Reliability Engineering」の略で、お客様やビジネス部門で発生した課題をエンジニアリングで解決する役割を担います。 営業・カスタマーサクセス・エンジニアリングのハブとなり、技術支援からインシデント対応まで幅広く対応しています。 今回は、前回の記事「問い合わせの『なぜ』を AI と解く - クラウドサイン CRE の AI 活用事例」の続編として、問い合わせ対応後の振り返りの取り組みとそのAIの活用について、紹介します。 CREが問い合わせ対応後に必ず行う「振り返り」 CRE チームでは従来から「CRE DONE」という振り返りの仕組みを運用しています。一連の問い合わせ対応を振り返りながら、以下の点を検討します。 なぜこの問

要旨 tsc のパスエイリアスはモジュール解決のために存在するもので、出力結果を書き換えるものではない 対策をしなければ、型定義ファイルにパスエイリアスがそのまま残り、npm パッケージとして公開されてしまう これにより、使用側で型の解決が正しく動作しないなどの問題が発生する 出力結果に含まれるパスエイリアスを書き換えたいなら、tsc 以外のツールを使う必要がある 今回は tsc-alias パッケージを使用して、ビルド後にパスエイリアスを相対パスに書き換える方法を採用した はじめに これはわたしが実際に体験した話なんですけどね。 クラウドサインには Delta Wing UI という、内製の UI コンポーネントライブラリがあるんですよ。 それで、あるプロジェクトで使って画面を作ろうとしたんですけどね。仮に、そのプロジェクトをRプロジェクトとでもしておきましょうか。 で、その R プロジ

前回の記事「新卒エンジニア向けHTML/CSS研修を開催しました」では、弁護士ドットコムが国内新卒エンジニアの採用を始めたこと、HTML/CSSの新卒研修を実施したことについてご紹介しました。新卒採用と研修の全体像については以下の記事をご覧ください。 弁護士ドットコム、初の「入社式」を開催。新入社員に込めた熱い想いと未来への誓い。 弁護士ドットコムエンジニア新卒研修2025の狙いと技術要素 私は体系的に学ぶ 安全なWebアプリケーションの作り方 第2版のレビューに参加したり、IPA 情報セキュリティ10大脅威の投票にも参加したり、セキュリティ方面の活動もそこそこやっています。その関係で、Webアプリケーションセキュリティの研修についても担当することになりました。今回の記事では、そのWebアプリケーションセキュリティの研修資料と、研修の組み立て方について考えたことをご紹介します。 研修資料

こんにちは、CTO の田中（@stanaka）です。 最近は趣味で LLM の内部構造を勉強していて、LLM 自作などに手を出しています。 さて、世の中は AI コーディングツールの話題で持ちきりですが、弁護士ドットコムでも活用を進めており、現在の状況をまとめてみました。 導入ツール 弁護士ドットコムでは、以前から GitHub Copilot を使ってきましたが、今年の初頭からさまざまな AI コーディングツールの導入を進めています。 ざっとあげると、GitHub Copilot, Cursor, Cline, Claude Code, Devin あたりのメジャーどころは一通り使えるようにしています。 Kiro もすこしだけ乗り遅れて waitlist 待ちになっていたところ、先日無事に invitation が届きました。 実際の利用状況を聞いてみると Cursor 勢と Claud

こんにちは、クラウドサインで CRE（Customer Reliability Engineer）をしている藤谷です。 CRE は「Customer Reliability Engineering」の略で、お客様やビジネス部門で発生した課題をエンジニアリングで解決する役割を担います。 営業・カスタマーサクセス・エンジニアリングのハブとなり、技術支援からインシデント対応まで幅広く対応しています。 CRE チームでは、お客様からのお問い合わせやご依頼に迅速かつ的確に対応するため、日々業務プロセスの改善に取り組んでいます。 今回はその一環として、既存の問い合わせ受付の社内フロー（具体的には Slack ワークフローの途中）に AI による問い合わせ内容の課題整理ステップを追加しました。 CRE の責務は、単にお客様からの質問に回答するヘルプデスクのみではありません。課題の真因を特定し、根本的な解

クラウドサイン Product Engineering 部でエンジニアをしている比嘉（@teitei_tk）です。好きな技術革新は活版印刷です。 はじめに: なぜ今「手動コーディング禁止」なのか 普段はエンタープライズ向け機能を作成するチームで、開発チームのリーダーを務めています。 私のチームを含め、弁護士ドットコムでは AI を積極的に活用しています。 creators.bengo4.com creators.bengo4.com creators.bengo4.com GitHub Copilot の利用から始まり、Cursor の導入や ClaudeCode を使ったプロダクト開発も進めています。 つい最近では gemini-cli・Kiro の利用も始まりました。 その他、自社で利用するための MCP サーバーの実装も行っています。 speakerdeck.com 一方で、私のチー

弁護士ドットコム株式会社では、2025年から国内新卒エンジニアの採用を始めました。 弁護士ドットコム、初の「入社式」を開催。新入社員に込めた熱い想いと未来への誓い。 新卒採用といえば、そう、新卒研修ですね。当社でも、新卒入社のエンジニア5名に向けて研修を行いました。 弁護士ドットコムエンジニア新卒研修2025の狙いと技術要素 私はHTML解体新書という本を出していたり、体系的に学ぶ 安全なWebアプリケーションの作り方 第2版のレビューに参加したりしている関係で、HTML/CSSの研修と、Webアプリケーションセキュリティの研修を担当することになりました。この記事では、HTML/CSS研修について資料を公開しつつ、研修を実施した際に考えたことなどをご紹介したいと思います。 研修資料 いかにして研修を組み立てたか 研修の前提 方向性をどうするか? 今回の研修の方針 資料の作成 研修の実施 終

こんにちは。 弁護士ドットコムのこがです。 みなさん、生成 AI はお好きでしょうか。 現在、弁護士ドットコムではさまざまな生成 AI を活用した開発を推進し、開発業務の効率化を図っています。 本記事では、テックブログを生成 AI にすべて書いてもらうことができるのか、というテーマについて深堀りします。 生成AIにブログを書いてもらうまでの道のり 今回、実際に私の個人のブログでプロダクト開発における情報設計の模索という記事をすべて AI に書いてもらいました。 使用した生成 AI は、Gemini 2.5 Flashです。 生成 AI に記事を書いてもらうといっても、さまざまな方法があります。私は生成 AI にインタビューをしてもらうことで、私が書きたい内容について深堀りしてもらいました。 まず、はじめのプロンプトを見てみましょう。 今から私と情報設計についてブログを書くために会話をしまし

はじめに こんにちは。電子契約サービスであるクラウドサインの開発に携わっている神達です。 社内で運用されている DesignDoc の作成・レビューを行えるようになるため、1 年間ほど取り組んだ内容をまとめてみました。 弊社に入社してからはじめて触れた概念だったため、最初はなにを意識すればいいのか非常に戸惑いました。 知識や観点の不足を補い、迷いを減らすための取り組みを行ったので参考にしていただければ幸いです。 はじめに DesignDocとは 課題への直面 克服に向けた計画 社内で質問した 取り組みたいことを整理した 具体的に取り組んだこと 技術系の書籍を読んだ AWSの資格を取得した 業務量を調整した DesignDocのレビューを行った DesignDocの作成を行った ガイドラインを整備した まとめ DesignDocとは DesignDoc は、機能開発のプロジェクトを始める前に

こんにちは、弁護士ドットコムでクラウドサインというサービスのフロントエンドを実装している林 @rinyu_tech です。 最近は、AI コーディングで UI コンポーネントを生成させることも増えてきました。しかし、AI はアクセシビリティに配慮しないコードを生成することもあります。今回は、AI にアクセシブルなコードを生成させることが可能なのか、実験してみました。 実験概要 目的 検証対象 実験結果のまとめ 実験環境 プロジェクトの構成 設定したアクセシビリティのルール インタラクティブ要素（ドロップダウンに必須） ARIA・セマンティックHTML（スクリーンリーダー対応） フォーカス管理（キーボードナビゲーション） 実験過程 Phase 1: 通常のAIコーディング実装 Phase 2: アクセシビリティ配慮指示 Phase 3: リンター活用による完全準拠 機能比較 重要な発見 AI

クラウドサインのエンジニアをしている辻@t0daaayです。 Claude Code の公式ドキュメントにタスク完了時の通知方法が掲載されています。 しかし、VSCode 上のターミナルで Claude Code を使いたい場合は通知音を鳴らすことしかできず、タスク完了に気づけないことが多々ありました。 iterm2 を使えば OS 通知させることは可能なようですが、VSCode の Claude Code の拡張機能の恩恵を受けられる点で VSCode 上で実行したいという気持ちがありました。 そんな中、X で AI エージェントのタスク完了を OS の通知として出力させている人を見かけました。 Claude Codeちゃんと作業報告してくれるようになって最高。通知音も質問と報告でちゃんと使い分けてくれる。 pic.twitter.com/ZOwTTQ0dB3— おきたかめごろう (@o

🐾 はじめに こんにちは、砂川(@misdo_tabeyo)です。 普段は『弁護士ドットコムLIBRARY』と『BUSINESS LAWYERS LIBRARY』というサービスでフロントエンド開発を担当しています。これらのサービスでは、Orval を利用して OpenAPI からAPIクライアントやZodのバリデーションスキーマを生成しています。 そんなOrvalに最近、Model Context Protocol (MCP) サーバーの生成機能が追加された と知り、早速試してみました。 MCP は LLM（大規模言語モデル）アプリケーションと外部ツール・データソースを接続するための標準プロトコルであり、AI エージェントと API のやり取りを仲介します。 本記事では、サンプルの OpenAPI スキーマを使い、Stoplight の Prism でモックサーバーを立ち上げ、Orval

1. はじめに 2. 私たちが直面した Tableau Cloud 運用の壁 本番環境と開発環境の切り分けが難しい ユーザー・権限管理の煩雑化 3. デプロイツール：デプロイ作業の自動化 基本的なアイデア 主要機能 設定ファイルの記述例 4. Tableau Cloud 設定ツール：ユーザー・権限のコード管理 主要機能 5. Tableau Toolsによる効率的で安全な運用フロー ダッシュボード開発する場合 Tableau Cloud のユーザーの追加や権限の変更をする場合 運用フローの特徴 Gitベースの構成管理とレビュープロセス GitHub Actionsを用いたCI/CDパイプライン 6. AI による運用の更なる効率化 ユーザーの追加・変更を Devin に依頼する 7. まとめ 1. はじめに こんにちは！データ本部の冨田です。 私の所属するデータ本部は2025年4月に新設さ

楽天証券のユーザーを狙ったフィッシングメールが話題になっています。楽天証券の公式 X アカウントから注意喚起が行われているほか、NHK ニュースでも報道されました。 【⚠️重要】楽天証券を装う不審な電子メールにご注意ください 【⚠️重要】楽天証券を装う不審な電子メールにご注意ください 直近、楽天証券を装う不審な電子メールを経由した不正取引被害が増加しております。… pic.twitter.com/mg8zvYXgOe— 楽天証券 (@RakutenSec) 2025年3月21日 楽天証券 偽メールで個人情報抜き取り被害相次ぐ 注意呼びかけ www3.nhk.or.jp この注意喚起を見ると、興味深い点があります。送信元のメールアドレスとして、「自治体名を含む」ドメインが利用されているというのです。実際に、sendonly@shiga.jp というメールアドレスが使われているほか、kagos

Devinの衝撃 Devinが私のチームにJOINしたのは、3月頭のことでした。 Devinは自分の名前でPRを出してきます。だからClineと違ってDevinが書いたコードは署名入り。何行書いたかも簡単にトレース出来ます。 3月に彼が編集した行数は、概数で次の通り。 ＋40000 lines ー8000 lines これは全てmainブランチにマージされています。 この中には、ドキュメントもあるし、検証用コードも含まれています。でもそれもプロジェクトに有益だから頼んだこと。無駄な作業は1つもありません。 そういう全部込みでも、JOIN1ヵ月で4万行書いた新人に私は出会ったことがありません。 せいぜい10行や20行の文章で指示を与えるだけで、3分でコードを読み、10分で500行のPRを出してくる新人も初めてです。 オンボーディングは仮想マシンをちょっと触ってあげるだけで終わりました。 そし

こんにちは、CTOの@stanakaです。 年明けから2か月間、社内でさまざまなAIを活用した開発ツールを試してきました。当社ではすでにGitHub Copilotを標準的に導入していますが、他にも良いツールがあるはずだということで、エンジニアの皆さんに新しいツールを積極的に試してもらいました。 今回試した主なツールは以下のとおりです。 Cursor ChatGPT Plus, Pro Claude Pro Claude Code Cline Devin もっといろいろ試せるとよかったですが、リソースは有限なので今回はここまでとしました。取り組みの様子はブログでもいくつか紹介していますので、ぜひご覧ください。 creators.bengo4.com AIによるプログラミングの変化 社内で特にAIツールを使いこなしているエンジニアの傾向を観察すると、単一のツールに限定するのではなく、用途や状

こんにちは、 @h13web です。 LLM (Large Language Model) の登場によって、プログラミングの方法論は大きく変わりつつあります。 私たちも日々 LLM と対話し、さまざまな試行錯誤をしています。 本記事では「制約が創造性を促進する」という逆説を LLM との対話に当てはめることで、効率を高める方法論について考えます。 制約が創造性を加速するという逆説 私たちは往々にして「制約が少ないほど自由に創造性を発揮できる」と考えがちです。 しかし実際には、適度な制約こそが創造性を加速させるという研究結果もあるようです。 hbr.org 選択肢が無限にあると人はかえって迷ってしまいますが、ルールや枠組みが与えられると焦点が絞られ、短時間でより良い解決策に辿り着けるのです。 思えば、私自身、原体験があります。 プールの先生をやっていた頃の話です。 小さなお子さんにとって、一

はじめに MCPとは 今回試したこと ケース1: JIRA との連携 どうして連携しようと思ったのか（目的） 例: 個人のタスクを分析してみる 投入したプロンプト LLM の応答 ケース2: Slack との連携 どうして連携しようと思ったのか（目的） 例1: 個人のtimesチャンネルを分析してみる 投入したプロンプト LLM の応答 例2: 組織のチャンネルを分析する 投入したプロンプト LLM の応答 ケース3: GitHubとの連携 どうして連携しようと思ったのか（目的） 例: プルリクエストをレビューしてもらう 投入したプロンプト LLM の応答 まとめ はじめに こんにちは、弁護士ドットコム SRE 室の原口です。 今回、 Claude Desktop で利用できる MCP (Model Context Protocol) を試してみました。 MCPとは MCP（Model C

クラウドサイン事業本部でエンジニアをしている辻@t0daaayです。 ChatGPT の Pro プランのみで利用可能だった Deep Research 機能が Plus, Team, Edu, Enterprise プランにもリリースされ、大きな話題を集めています。 Deep research is now rolling out to all ChatGPT Plus, Team, Edu, and Enterprise users 🍾— OpenAI (@OpenAI) 2025年2月25日 この機能は o3 モデルを基盤にしており、膨大なテキスト・画像・PDF をインターネット上で検索・解釈・分析し、途中で得られた情報に応じて方針を変えながら包括的なレポートを作成できるというものです。 この記事では、エンジニアである私が約 1 ヶ月間 Deep Research を使ってみて、特

はじめに クラウドサインでフロントエンドエンジニアのツノ(𝕏@2nofa11)です。 私の作業領域は主にクラウドサインのフロントエンドですが、今回の機能開発ではバックエンドが中心となる案件でした。 案件の特性を鑑みてフロントエンドエンジニアもバックエンド開発する方針になり、バックエンドのキャッチアップが必須になりました。 Tour of Go などの基本的な学習は自己学習で補える部分ではありますが、既存プロダクトのコードリーディングを行い、開発できる状態になるまでには課題を感じていました。 この課題に対して、バックエンドメンバーとモブプロを実施し、疑問点を共有しながら解決を図ってきました。しかし、まだ解決できない疑問が残り、十分に習熟できていないと感じています。 そこで、より効率的な学習を実現するため、バックエンドのキャッチアップに Cursor を利用することにしました。 ちょうど社内

はじめに クラウドサインでは、組織内でアクセシビリティ向上に向けた改善を進めています。 今回は、スクリーンリーダーと <footer> 要素にまつわるお話です。 きっかけ 2024 年 9 月に「弁護士ドットコム×SmartHR「出張！俺の電子契約」〜クラウドサインのアクセシビリティチェック〜」というイベントを開催しました。 視覚障害当事者である SmartHR 社の辻さんに、スクリーンリーダーを使ってクラウドサインを操作していただくイベントでした。 詳細は記事 イベント開催レポート：「出張！俺の電子契約」〜クラウドサインをアクセシビリティチェック〜 - 弁護士ドットコム株式会社 Creators’ blog をご覧ください。 このイベントを見ていて気づいたことがあります。 フッターが「フッター」と読まれていないぞ……？ （その場面） クラウドサインのフッター部は、アプリ画面下部にある「ヘ

はじめに npm audit は、インストールされている npm パッケージに脆弱性が報告されているものがないかチェックする機能です。 クラウドサインでは、有志を募って、 npm audit で検出された脆弱性をひとつずつ解消する活動をしています。 npm モジュールの依存性は木構造であるにもかかわらず、npm audit はこれをフラットに表示しているため、読みづらいです。 この記事では、以下の流れで立ち向かっていきます。 npm audit を読めるようにする 各パッケージの対応順序を決める 対象パッケージをアップデートする おことわり この記事は、npm audit fix ですべてが解決するような環境は想定していません。npm audit fix では大量のアップデートが作られてしまい、手に負えなくなるような環境を想定しています。 1. npm audit を読めるようにする: n

この記事は弁護士ドットコム Advent Calendar 2024 の 25 日目、最終日の記事です。最終日は入ったばかりのCTOの@stanakaがお送りします。 弁護士ドットコムには、先月の11月半ばに入社して、およそ1ヶ月半たったところです。まだキャッチアップ期間中ですが、数十人の方々とはじめましての1on1を続けており、徐々に現状の解像度が上がってきているところです。 なぜ弁護士ドットコム? 入社以来、社内外問わず人と会う度になぜ弁護士ドットコムなんですか、と聞かれるので、ここらでちゃんと言語化しておこうと思います。今回、弁護士ドットコムを選んだ理由は、大きく3つあります。 法律という社会的に重要なドメインの最前線を探求できる マルチプロダクト組織として伸び代が大きい グローバル化をまさに始めようとしている それぞれ掘り下げてみます。 法律という社会的に重要なドメインの最前線を探