Storybook の parametersStorybook の parameters は、Story や Component に静的なメタデータやパラメタを追加するための機能です。これらのパラメータは addon の設定や Story の表示方法のカスタマイズなどに利用されます。// グローバルな parameters の設定export const parameters = { backgrounds: { default: 'light', values: [ { name: 'light', value: '#f8f8f8' }, ...

バクラク事業CTO 中川佳希です。この記事では、Dead Code（実行されないコード）を削除するツールについて紹介します。 『Tidy First?』第2章で、Dead Code について次のように述べられています。「消そう。以上。実行されないコードは消すだけだ。」https://www.oreilly.co.jp/books/9784814400911/ Dead Code の背景大規模なプロジェクトでは、長い年月のリファクタリングや仕様変更の結果、実行されなくなったまま残るコードが増えてしまいます。個人的にこの Dead Code の問題は、保守性の低下や ...

LayerX バクラク事業部 Enabling チームでスタッフエンジニアをしている izumin5210 です。Ubie さんの「社内デザインシステムをMCPサーバー化したらUI実装が爆速になった」を拝見し、悔しかった感動したので、自分でも試してみました。https://zenn.dev/ubie_dev/articles/f927aaff02d618 MCP ツール設計以下に引用する Ubie さんのスライドで解説されているとおりですが、現行モデルでは全コンポーネントのコードやルールを一気に渡してもノイズが多くなりすぎるためか、満足のいく性能は出ませんでした。これは MC...

構成2部構成です。Playwright AIRA SnapshotsPlaywright MCP Playwright ARIA SnapshotsPlaywright v1.49.0 で追加されました。一言でいうと「ページ内のアクセシビリティツリーのスナップショットを取る。（テストにも利用できる）」機能です。 アクセシビリティツリー （AOM: アクセシビリティオブジェクトモデル）WebページをARIA ロール構造として表現し、Playwright ではツリーの構造は YAML になります。例HTMLアクセシビリティツリーをYAMLで表現...

バクラク事業CTO 中川佳希です。バクラク事業部 Platform Engineering 部では定期的な発信を行っています。前回は、Microsoft Entra ID PIM for Groupsの運用と工夫 by itkq でした。（とても便利です！）この記事では、Model Context Protocol（MCP）について触れていきます。※ 2025年2月時点での情報です。 Model Context Protocol2024年11月に、Anthropicが発表したクライアント-サーバー間通信のプロトコルです。https://www.anthropic.com/new...

3行まとめpnpm の --filter オプションにはパッケージ名だけでなく git の commit や branch も渡すことができるpnpm ls --filter をうまく使えば「main branch からの diff の影響を受けるパッケージ」の一覧を取り出せるドキュメントや help をちゃんと見ると、意外と知らないことが書いてある モチベーションLayerX のバクラク事業部では Webapp（Web Frontend アプリケーション）のモノレポ化を進めており、1つのリポジトリに複数の Next.js アプリケーションが存在します。そこで悩...

この記事はLayerXテックアドカレ2024の24日目の記事です。でも ISUCON の自慢がしたいので今回は LayerX の話はしません。ISUCON14に「都営三田線東急目黒線直通急行日吉行」で参加し、4位になりました。ISUCON7 から 0gajun, agatan と参加し続けていますが、久々に結果が出たぞ！！！近年は上位争いしつつの失格が多かったのでホッとしています。ISUCON11 予選2位 / 本戦失格（スコア3位相当）ISUCON12 予選落ちISUCON13 本戦失格（スコア3位相当）とはいえここまでくると入賞・優勝も狙えそうなのでやっぱ悔しい...

すべての状態をできるだけ減らしたいypresto (プレスト) です。12月頭に予約してたアドベントカレンダーですが12/23になってしまいました。 LayerXのバクラク事業部では、Webフロントエンド領域もがんばっています！！ ということで一筆。バクラク事業部のエンジニアは、バックエンド・フロントエンドの垣根なくプロダクト開発を手掛けています。各々に得意領域があり、わたしはフロントエンドの改善やコードレビューなども行っています。そのコードレビューで、「Vueの watch() を使用せずに computed() でリアクティブに書きたいです」 (Reactで言えば useEff...

Catalogs とは何か依存関係のバージョン範囲を再利用可能な定数として定義でき、それを package.json から参照できる機能です。https://pnpm.io/catalogsドキュメントの例をそのまま引用すると、以下のように pnpm-workspace.yaml に catalog: もしくは catalogs: で依存ごとのバージョン範囲を定義できます。pnpm-workspace.yamlpackages: - packages/*# Define a catalog of version ranges.catalog: react:...

この記事は LayerX のエンジニアブログがたくさん出る #ベッテク月間 の8記事目になります。こちらのカレンダーに、これまでの記事と今後出る予定がまとまっています。https://www.notion.so/layerx/253bee10186e4010b2ab37eff7252e09?v=00bf49a9c456450498e4d67dd5a76ef7LayerX のバクラク事業部には GraphQL Gateway というバクラク全プロダクトから参照される GraphQL スキーマが存在します[1]。今回の記事は、その GraphQL Gateway のスキーマをより良い状態...

この記事はVisual Studio Code Advent Calendar 2023 19日目の記事です。もうすぐクリスマスですね。我が家は3歳の息子がいるのですが、今更「ツリー買い忘れたけどなんか飾り付けほしいなぁ」と思ってダイソーでツリーが印刷された布を買い、布を壁に貼ってシールや工作物をペタペタ貼ることでそれっぽいものができました。ツリーのゴミも散らからないので、もし悩んでいる方がいればぜひお試しくださいDALL-Eで出力してもらったイメージはこちらになります（こんなにちゃんとしていませんが）はじめまして、LayerX 機械学習チームの @yakipudding です。...

この記事は LayerXテックアドカレ2023 の39日目の記事です。昨日の記事は、suguru さんのバクラク Enabling Team の課題とのびしろでした！今日はバクラク事業部 Enabling Team エンジニアの @yyoshiki41（中川佳希）が担当します。 のびしろウィーク 👐のびしろウィークは、LayerXの各チームメンバーがチームの伸びしろについて発信する期間です！プロダクトや組織の成長過程で常に状況が変わるため、社内には解決されていない問題や整備されていない環境、いわば「のびしろ」がたくさんあります。のびしろを読んでみて、「その課題、詳しく聞きた...

7月は、LayerX エンジニアブログを活発にする期間でした！8月も発信を続けていきます、今日の記事はバクラク事業部 Enabling Team エンジニアの @yyoshiki41（中川佳希）が担当します。 Elasticsearch から OpenSearch へこれまでバクラク事業部内では検索サービスに、AWSマネージドの Elasticsearch 7.10 を利用していました。2023年1月 Amazon OpenSearch Serverless がGAとなったため、開発者での運用改善を含め移行先にあがりました。今回の記事では、移行へのステップや実装を刷新した点を紹...

LayerX で機械学習エンジニアとして働いている松村 @yu-ya4 です。現在はMLチームにて、バクラクシリーズのAI-OCR機能の開発をはじめとした機械学習技術の活用を推進しています。7月はLayerXエンジニアブログを活発にしよう月間 とのことですのでブログを執筆しております。今日は誰がなんと言おうと7/26です。今回は、2023年5月にプレビューとなり先月から今月にかけてGAとなったVertex AI PaLM APIを触ってみたので紹介します。なお、このブログを執筆している2023年7月26日時点では英語やスペイン語など５つの言語への対応のみがGAであり、日本語は対応してお...

はじめまして、4月に入社したばかりのバクラク事業部 電子帳簿保存のエンジニアリングマネージャーをしている菊池 (@kichion)です。7月はLayerX エンジニアブログを活発にする期間なので、気になる記事をチェックしてもらえると良いと思います！ 7/11は@makoga (小賀昌法) さんの「入社してから事業部執行役員(VPoE)になるまでの3ヶ月間に考え、実施したこと」でした。本記事では、私がここ数ヶ月GitHub Copilotを使って得た知見を共有したいと思います。 GitHub Copilotをうまく使うための基本的なガイドGitHub Copilotは、プログラミン...

7月はLayerX エンジニアブログを活発にする期間です。今日は誰がなんと言おうと 7/6 です。昨日 7/5 は「Datadog のコスト最適化で月額費用を 30% 削減した」でした。2022年10月3日に、GraphQL Code Generator（以下、graphql-codegen）のおすすめ設定に関する記事を公開しました。https://zenn.dev/izumin/articles/ffc84c1b4310beしかし、その後、graphql-codegen v3のリリースに伴い、ReactやVueではclient-presetが推奨されるようになりました。cl...