弁護士ドットコム株式会社 Creators’ blog

弁護士ドットコムがエンジニア・デザイナーのサービス開発事例やデザイン活動を発信する公式ブログです。

フロントエンド

技術カンファレンスのCfPで意識している2つのポイント

本記事は弁護士ドットコム Advent Calendar 2025、21 日目の記事です。 はじめに 弁護士ドットコム株式会社で、クラウドサインというプロダクトのフロントエンドエンジニアをしています、ツノです。 今年はTSKaigi 2025とVue Fes Japan 2025というフロントエ…

【React】ロジックをすべて hook にまとめてしまうのもアリだと思った

この記事は弁護士ドットコム Advent Calendar 2025の 8 日目の記事です。 クラウドサイン事業本部でエンジニアをやっている田邉です。 長い期間フロントエンドコードを運用した結果、Fat Component が増えてしまいコード全体が複雑なものになってしまった経…

VueFes 2025参加記:バックエンド寄りのエンジニアが感じたフロントエンドの今

この記事は、 弁護士ドットコム Advent Calendar 2025・Vue Advent Calendar 2025 の 7 日目の記事です。 クラウドサイン Product Engineering 部でエンジニアをしている比嘉(@teitei_tk)です。好きなアドベントカレンダーは SHIROBAKO アドベントカレンダ…

クラウドサインUIコンポーネントライブラリ delta-wing-ui の9つの設計観点

はじめに こんにちは。 弁護士ドットコム株式会社でクラウドサインという電子契約サービスのフロントエンドを担当しています、神戸と言います。 クラウドサインでは、delta-wing-ui という社内で利用するための UI コンポーネントライブラリを開発しています…

Full-Stack TypeScriptで型安全な開発サイクルを実現! ── Legal Brain 開発事例

こんにちは! Legal Brain エージェントを開発している下山です。 Legal Brain エージェントはリーガル特化型 AI エージェントで、法律事務所や企業の法務部門での複雑なリサーチ業務を支援するリーガルリサーチ機能を提供しています。 このプラットフォーム…

claude-code-spec-workflowで始める仕様書駆動開発

はじめに クラウドサイン Product Engineering 部で主にフロントエンドエンジニアとして活動している山下慧(@kirehashi_3)です。 さて、この記事をご覧になっている方は、Claude Code などの AI エージェントを用いて開発していることが多いでしょう。しか…

恐怖! ビルドされたnpmパッケージ内のd.tsにパスエイリアス(~)!

要旨 tsc のパスエイリアスはモジュール解決のために存在するもので、出力結果を書き換えるものではない 対策をしなければ、型定義ファイルにパスエイリアスがそのまま残り、npm パッケージとして公開されてしまう これにより、使用側で型の解決が正しく動作…

ドロップダウンメニューに対するアクセシビリティリンターを用いたAIコーディング比較

こんにちは、弁護士ドットコムでクラウドサインというサービスのフロントエンドを実装している林 @rinyu_tech です。 最近は、AI コーディングで UI コンポーネントを生成させることも増えてきました。しかし、AI はアクセシビリティに配慮しないコードを生…

TypeScript開発者が試すOrval活用術:OpenAPIからMCPサーバーを自動生成しClaudeでAPIを呼び出すまで

はじめに こんにちは、砂川(@misdo_tabeyo)です。 普段は『弁護士ドットコムLIBRARY』と『BUSINESS LAWYERS LIBRARY』というサービスでフロントエンド開発を担当しています。これらのサービスでは、Orval を利用して OpenAPI からAPIクライアントやZodのバ…

TSKaigi2025 協賛&参加レポート

こんにちは。技術広報のsakutaroです。 2025年5月23日(金)・24日(土)に開催された TSKaigi2025 に、弁護士ドットコムは Silverスポンサー として協賛しました。 本記事では発表した内容と参加したエンジニアによるセッション視聴レポートを振り返りいたしま…

フロントエンドエンジニアがCursorを使ってバックエンド開発にキャッチアップしている話

はじめに クラウドサインでフロントエンドエンジニアのツノ(𝕏@2nofa11)です。 私の作業領域は主にクラウドサインのフロントエンドですが、今回の機能開発ではバックエンドが中心となる案件でした。 案件の特性を鑑みてフロントエンドエンジニアもバックエン…

スクリーンリーダーが <footer> 要素を「フッター」と読みません!

はじめに クラウドサインでは、組織内でアクセシビリティ向上に向けた改善を進めています。 今回は、スクリーンリーダーと <footer> 要素にまつわるお話です。 きっかけ 2024 年 9 月に「弁護士ドットコム×SmartHR「出張!俺の電子契約」〜クラウドサインのアクセシ</footer>…

ユーザーファーストなドロップダウンメニューの実装

2025年1月27日に開催された合同勉強会「ユーザーファーストを実現するフロントエンドの最前線」では、アクセシビリティを中心にしたフロントエンド開発の取り組みが各社から発表されました。 本記事では、クラウドサイン フロントエンジニアの林さんが発表さ…

フロントエンドの技術的負債と向き合っている話

この記事は、弁護士ドットコム Advent Calendar 2024 の 23 日目の記事です。 はじめに こんにちは、クラウドサイン事業本部の篠田(@tttttt_621_s)です。普段はクラウドサインのフロントエンドの改善活動を行なっています。 「負債」という言葉で何をイメ…

UIコンポーネントライブラリ「delta-wing-ui」の開発物語

UIコンポーネントライブラリ「delta-wing-ui」の開発物語 この記事は、弁護士ドットコム Advent Calendar 2024 の 19 日目の記事です。 はじめまして。弁護士ドットコム株式会社で『クラウドサイン』という契約マネジメントプラットフォームのフロントエンド…

AST の基礎を理解:TypeScript でコードを解析し操作する🔰

この記事は、弁護士ドットコム Advent Calendar 2024 の 16 日目の記事です。 クラウドサイン事業本部のフロントエンドエンジニアの辻@t0daaayです。 最近カンファレンスや勉強会で AST 関連の話を見聞きすることが多い中、実際に AST を触ったことがなかっ…

Deno 2.0 の依存管理アップデートとモノレポワークスペースの実践

この記事は、 弁護士ドットコム Advent Calendar 2024 の 15 日目の記事です。 弁護士ドットコムで Web エンジニア業務をしている @koukibuu3 です。 2024/10/09、Deno のメジャーアップデートが行われ 2.0 となりました。 4 years after Deno 1.0, the next…

クラウドサインの開発チームに加わって最初の 1 年を振り返る

この記事は弁護士ドットコム Advent Calendar 2024 12日目の記事です! クラウドサインのフロントエンドエンジニアのツノ(𝕏@2nofa11)です。2024 年 3 月に入社し、12 月で 10 ヶ月が経ちます。 少し早いですが、クラウドサインのエンジニアとしての 1 年を Y…

年末なのでコードの大掃除をしよう

この記事は弁護士ドットコム Advent Calendar 2024の 8 日目の記事です。 クラウドサイン事業本部でエンジニアをやっている田邉です。 みなさんの js、ts プロジェクトには、なぜ export しているのかわからないコードや、なんのためにインストールしている…

MockServiceWorker(MSW) を使った高速開発のための運用事例

クラウドサイン事業本部の田邉(𝕏@s_tanabe_)です。 フロントエンドの開発に携わっているみなさんは、バックエンドや BFF(Backends For Frontends) の開発を待たずにフロントエンドの開発に取りかかりたいと考えたことはありませんか? これが実現できると フ…

ボタンをaタグで作るな高校校歌

まずはこちらをお聞きください。 技術的解説: ボタンを a 要素で作るな a 要素は URL などへのリンクをつくるためのもので、button 要素はなんらかの処理を起動するボタンをつくるためのものです。 配置されるものがリンクなら a 要素で実装し、ボタンなら b…

Vue 3.5 の新機能・改善点まとめ

クラウドサインのフロントエンドエンジニアの辻@t0daaayです。 2024 年 9 月 1 日に Vue 3.5 のリリースが発表されました。 https://blog.vuejs.org/posts/vue-3-5 このブログでは、このリリースノートを読みリリースされた内容を実際に動かしてみたり、さら…

なぜボタンは button 要素で作るべきなのか、div 要素をボタンにすることを通して考える

この記事を読むとわかること なぜボタンを button 要素で作るべきなのか、その理由 どーーーーーしてもボタンを別の要素で作らなければいけないとき、何をすればいいか 答え button 要素を使ったときに得られる標準動作を捨ててまで得られるメリットがないか…

Go HTML Template のエスケープの挙動に気をつけよう

TL; DR Go HTML Template では、渡した文字列がデフォルトでエスケープされますが、Typed Strings を渡すとエスケープされません そこにユーザーが自由に指定できる値を設定すると、XSS 脆弱性につながる恐れがあります Revel の関数の中には、引数に渡した…

Axios における request method の引数の型定義を調査した話

はじめに この記事は 弁護士ドットコム Advent Calendar 2023 の 23 日目の記事です。 前日は @komtaki さんの「型パズルを理解しTypeScript中級者になる8のポイント」でした。 こんにちは、クラウドサイン事業本部の篠田(@tttttt_621_s)です。 普段はクラ…

型パズルを理解しTypeScript中級者になる8のポイント

この記事は、弁護士ドットコム株式会社の Advent Calendar 2023 の 22 日目の記事です。 前日は @et_tei さんの「FireHOL で公開されているブラックリストからの接続 Akamai でブロックする」でした。 こんにちは。税理士ドットコム事業部の @komtaki です。…

Optimistic Update に触れてみる

この記事は弁護士ドットコム Advent Calendar 2023の 19 日目の記事です。 前日は @michimani さんの「Azure App Configuration を使って機能の利用可否を自動で切り替える」でした。 クラウドサインのフロントエンドエンジニアの山田です。 普段の業務では…

Go html/templateで書くHTMLメールのハマりどころと対処法

この記事は弁護士ドットコム Advent Calendar 2023の 8 日目の記事です。 前日は @RA621H さんの「はじめての転職と今後の展望」でした。 クラウドサインのフロントエンドエンジニアの @RINYU_DRVO です。 今回は、Go html/template で書く HTML メールのハ…