X SpacesXスペース

← Back to the X Space archive

バイブコーディングでなんか作ろう!

#397 / Fri, Apr 10, 2026

The content of this page is in Japanese.

バイブコーディングでジャーナルアプリを作る対決に挑戦し、生成AIを使った開発の進め方やUI・UXの考え方、短時間で形にする難しさについて話しました。

今回のテーマは「バイブコーディングでなんか作ろう!」です。参加者が制限時間を設けて、日記を記録するジャーナルアプリの制作に取り組みました。技術スタックは自由とし、短時間で完成させるため、機能やデザインをどこまで盛り込むかもAIと相談しながら進めました。制作の前には、アプリの要件や設計をAIと壁打ちしてから開発環境を整える方法についても紹介されました。

開発中には、Supabaseでデータベースを用意し、Next.jsのプロジェクトをGitHubに登録してVercelで公開する手順や、生成AIの返答を待つ時間の使い方が話題になりました。また、AIがコマンドを実行する場合でも、実行先のディレクトリや削除対象などを確認する必要があると共有されました。誰でもコードを作りやすくなる一方で、利用者の状況や目的を捉えて、使いやすい体験に落とし込む力が重要だという意見も交わされました。

完成したアプリの一つは、記録を残すシンプルなジャーナルを目指したもの、もう一つはX風のタイムラインを取り入れたものでした。ログイン機能を省いたため、記録を複数人で使う場合の課題も確認されました。審査では、タイムライン型のアプリの機能やジャーナルとしてのまとまりが評価され、こちらが選ばれました。一方で、もう一方のアプリのレトロで書きたくなるUIも好評でした。次回は、仮想通貨が金融商品として扱われる話題を取り上げる予定です。

Topics

  1. 01

    ジャーナルアプリ制作

    制限時間を設け、参加者がジャーナルアプリの制作に挑戦しました。技術スタックは自由とし、AIとの相談や実装を進めながら、限られた時間でアプリを形にしました。

  2. 02

    開発の進め方と安全

    Supabase、Next.js、GitHub、Vercelを使った開発の流れや、AIの応答待ちの時間の使い方を共有しました。AIが実行するコマンドも内容を確認する必要があると話しました。

  3. 03

    UI・UXと審査

    完成したアプリの機能やUIを比べ、X風のタイムライン型とレトロな記録画面の特徴を評価しました。使いやすい体験をつくるには、利用者の目的を捉えることも重要だと話しました。

Host
@Web3studenttalk
Speakers
Keywords
バイブコーディングジャーナルアプリ生成AISupabaseNext.jsVercelUX

This summary was drafted by AI from the Space's transcript and reviewed by the team.

Join the next X Space

Upcoming sessions are announced on our official X account. Keep the conversation going on Discord.

Talk on Discord

Join Discord

Get updates on X

Follow on X (Twitter)
Join the communityJoin DiscordGet the latest newsFollow on X