fbpx

Bolt.new + Cursor をPoCフェーズに導入してみた

本投稿はクリエーションラインアドベントカレンダー2024 15日目の記事です。

背景

システム開発では、要件定義を進めるためにPoC(Proof of Concept)開発を行うことが一般的です。
PoCでプロトタイプを作成することには以下のようなメリットがあります:

  • 実現可能性の確認
  • ユーザーのニーズへの適合性の評価
  • 課題や改善点の早期発見

しかし、トライ&エラーを繰り返す中でコストや工期が予想以上にかかり、本開発に影響が出ることも少なくありません。
こうしたデメリットを軽減するためには、プロトタイプ開発を高速化する必要があります。

そこで今回は、AIを活用して開発効率を向上させるため、Bolt.newCursor を組み合わせて使用する方法を試しました。

前提条件

使用したツール

  • Bolt.new
  • Cursor(Claude 3.5 Sonnet)

開発フロー


導入して分かったこと

効果

  1. PoCの作成スピードが劇的に向上
    通常3日以上かかるような画面が、わずか1~2時間で実装可能。
  2. UI部分の迅速なフィードバック
    ユーザーが特に注目するUI変更を、場合によってはミーティング中に即座に反映できる。

BoltとCursorの特性比較

特性Bolt.newCursor
コード生成のアプローチ要件に基づき全体をリファクタリングしながら生成部分的なコード修正を支援
メリット読みやすいコードを生成。ファイル構成も整える手作業のコーディングと共存可能。差分表示で確認できる
デメリット想定外の箇所も書き換えることがある。GitHubのリポジトリ取り込み不可。コードが複雑化しやすい

適切な使い分け

  • Bolt.new: 全体設計や大まかな実装を担当。エラーが少ない部分を効率よく作成。
  • Cursor: エラーが頻発する箇所や微調整を担当。手作業と組み合わせて作り込む。

注意点と学び

  • ライブラリの対応: BoltやCursorは、ニッチなライブラリや商用ライブラリでは品質が低下する場合あり。
  • エラー対応: エラー解消に時間をかけるより、プロンプトを工夫する方が効率的。
  • ユーザーレビュー: AIを活用する場合に限らないが、プロトタイプを見せる際に、レビューの焦点(確認ポイント)を明確にすることが重要。

まとめ

今回、Bolt.new + Cursor を導入したことで、プロトタイプ開発のスピードが飛躍的に向上しました。これにより、単なるコーディング効率の向上を超え、システム開発プロセス全体の革新が進むと感じました。

今後、Bolt.new の SupaBase連携機能を活用することで、バックエンド開発にも応用が広がる可能性があります。次回はバックエンド領域での実践についても報告したいと思います。

新規CTA