AIコーディングで超えられた技術的な壁
Claude CodeやCodexなど、AIエージェント/AIコーディングツールの隆盛により、プログラミングができない方による「バイブコーディング」や「AI駆動開発」が注目を集めています。
昨今、様々な角度から語られることが多い、このAIを使った開発ですが、今回の弊社のケースでは、これまで技術的に難しかった課題をAIで乗り越えた話をご紹介します。
生成AIが普及する以前から使っていた社内ツール
弊社では生成AIが普及する以前から、社内向けに「ブックマークレット」として開発し、使用していたツールがあります。それが、ページの一部分だけをリロードできるツールです（仮称：Fast Reload）。
コーディング中やブログ記事執筆中、ページの特定箇所の見た目をこまめに確認したい場面は多くあると思いますが、その都度ページ全体をリロードすると、JavaScriptや画像などの読み込みに時間がかかってしまいます。
（とくに、長いLP等のページで、差分の自動更新が行われない環境の場合）
そこで変更した箇所のみを部分的にリロードすることで、確認のための時間を短縮できるツールでした。
AIコーディングツールで乗り越えた課題
ブックマークレットの状態でも便利ではあったのですが、要素名（CSSセレクタ）を手入力して対象を選択するという操作が必要で、これが少しだけ使い勝手が悪く、ネックになっていました。
セレクタ名を入力するためには覚えておくか、検証ツール等で都度確認する必要があります。
加えて、普段HTMLやCSSをあまり触らないライターさんにとっては、使うのが少し難しいものとなっていました。
しかし、今回Claude Codeを活用することで、これまで技術的に難易度が高かった「GUIによるセレクタの選択」機能を盛り込むことができ、この課題を解消することができました。
AIとの対話を通じてロジック/コードを実装し、以前から思い描いていた理想の使い勝手に近づけることができました。そして、AIコーディングの恩恵を、自分たちの実務の中で実感した瞬間でもありました。
Chrome拡張「Fast Reload」としてリリース予定
このツールは現在、Google Chrome拡張機能「Fast Reload」として整備中で、一般公開できる品質調整が完了したら、ツール専用サイトとともに正式リリースを予定しています。
無料で公開する予定ですので、同じ課題を持っていた方には、ぜひ使っていただきたいと思いますので、よろしくお願いします。（自分でも意外と気付かなかった「痒いところに手が届く」ツールのひとつかと思います）
※コーポレートブログでは、今後も定期的にWeb技術やマーケティング等、様々な内容をお届けしていきます。
