Lovableの使い方｜日本語で始めるAIアプリ開発の完全ガイド

Lovable（ラバブル）は、日本語でチャットするだけでWebアプリを構築できるAI開発プラットフォームです。本記事では、アカウント作成から本番デプロイまでの一連の流れを、日本語ユーザー向けに分かりやすくまとめました。

Lovableとは#

Lovableはスウェーデン発のAIコーディングサービスで、自然言語の指示からReact + TypeScriptのコードを生成します。生成されたアプリはVercel/Cloudflareなどに自動デプロイされ、URLですぐに共有可能。コードはGitHubに同期できるため、後から手動編集する道も残されています。

ステップ1：アカウント作成#

1. lovable.dev にアクセスし、Googleアカウントかメールアドレスでサインアップ
2. ワークスペース名を日本語で入力してOK（後から変更可）
3. 初回は無料プランで開始できます（月5メッセージまで無料）

ステップ2：最初のアプリを作る#

ダッシュボードの入力欄に、作りたいものを日本語で書くだけです。最初は短く、シンプルに伝えるのがコツ。

シンプルなTODOアプリを作って。
・追加 / 削除 / 完了チェックができる
・デザインはダークモード基調
・Tailwindのshadcn/ui Cardを使う

送信後、30秒〜1分でプレビューが表示されます。右側のプレビュー画面で動作確認しながら、追加で指示を出していけます。

ステップ3：日本語で効果的に指示するコツ#

• 1メッセージ=1目的（複数依頼すると失敗率が上がる）
• 対象画面・対象ファイルを明示する（例：「トップページのヘッダー」）
• やってほしくないことも書く（例：「既存のルーティングは触らないで」）
• 失敗したらUndoしてプロンプトを書き直す（同じ依頼の繰り返しは逆効果）

ステップ4：バックエンドを追加（Lovable Cloud）#

認証・データベース・ファイル保存が必要になったら、チャットで「Lovable Cloudを有効化して」と依頼するだけ。裏側でSupabaseが自動セットアップされ、テーブル作成・RLS（行レベルセキュリティ）まで一気通貫で生成されます。

ステップ5：公開（デプロイ）#

右上の「Publish」ボタンを押すと、`xxx.lovable.app` のURLで世界に公開されます。独自ドメインも有料プランで接続可能（ムームードメイン・お名前.comなど日本のレジストラもOK）。

日本語ユーザーがつまずきやすいポイント#

• UI文言が勝手に英語化される → 「UI文言は日本語のまま」と毎回明記
• 全角スペースがコードに混入する → プロンプトは半角推奨。エラーが出たら「全角を半角に直して」と一言
• 日付フォーマットが米国式（MM/DD/YYYY）になる → 「日付はYYYY-MM-DD形式で」と指定
• 決済はStripe前提（PayPay・楽天Payは未対応） → 日本国内決済が必要ならStripeの日本円決済を使う

次に読むべき記事#

本記事は入門編です。実務で使いこなすには、プロンプトの書き方とCloud（DB・認証）の理解が必須。以下の関連記事で深掘りしてください。

FAQ#

Q. プログラミング未経験でも使えますか？

はい、画面イメージとやりたいことを日本語で書ければ動くアプリが作れます。ただし本番運用するならHTML/CSS/JavaScriptの基本概念は知っておくと、トラブル対応が格段に楽になります。

Q. 無料プランでどこまでできますか？

月5メッセージまでアプリ生成・編集が可能。プロトタイプ作成や試用には十分ですが、本格的に作り込むなら有料プラン（月$25〜）が現実的です。

Q. 生成されたコードは自分のもの？

はい、商用利用も可能。GitHubに同期して自社リポジトリで管理することもできます。

関連記事#