はじめてのVibe Coding体験 3時間でWeb Appを作ってみよう！

​Japanese Version

​🚀 3時間でWeb Appを作ってみよう！

​はじめてのVibe Coding体験 🍕

​AI Builders × Qoder が贈る、実践型ワークショップ。

​AIで何か作ってみたい。 でも、プログラミングは未経験…。

​大丈夫です。このワークショップでは、AIにコードを書いてもらいながら開発する「Vibe Coding」を体験します 🧑‍💻

​講義中心ではなく、実装中心。 3時間で、あなただけの「東京シティガイド」Web Appを完成させます。

​未経験でも歓迎。AI時代における内製化の手法を、手を動かしながら学べます。

​※ご自身のノートパソコンをご持参ください 💻

​🛠 当日やること

• ​QoderWorkを使ってリサーチ ── 実在するスポットの情報を収集・構造化

• ​Qoderを使ってVibe Coding ── Reactでインタラクティブなシティガイドを構築

• ​QoderWorkでプレゼン資料を作成 ── スライドデッキを自動生成

​自分が好きなテーマ（ラーメン、隠れ家カフェ、古着、夜の東京…）を選んで、 世界にひとつだけのガイドを作ります。

​🗺 作るもの：東京シティガイド

• ​カード型UIで実在のスポットを一覧表示

• ​タグフィルターで絞り込み

• ​おすすめ散歩ルートの表示

• ​住所コピー機能（タクシーやマップですぐ使える）

• ​レスポンシブ対応（スマホでも見られる）

​参加者それぞれのテーマが違うから、デモタイムは「みんなの東京おすすめ交換会」になります。

​💡 学べること

• ​QoderWork を使ったAIリサーチ＆データ構造化

• ​Qoder を使ったVibe Coding（自然言語 → 動くコード）

• ​QoderWork によるスライドデッキ自動生成

• ​AI時代の内製化 ── 自分たちで作る力を身につける方法

• ​リサーチ → 実装 → プレゼンの一気通貫フロー

​「AIすごい」で終わらず、 リサーチから実装、発表まで一人で完結させる体験をします。

​👤 対象

• ​AIに興味がある方

• ​Vibe Codingを体験してみたい方

• ​プログラミング未経験の方

• ​ノーコードから一歩進みたい方

• ​AI時代の内製化に関心がある方

​事前知識は不要です。 やってみたい気持ちがあればどなたでも大歓迎です 👍

​🎁 参加特典（参加無料）

• ​Qoder Credits

• ​ドリンク＆軽食 🍕🥤

​作るだけで終わらず、 終了後は参加者同士でゆるく交流する時間もあります。

​🗓 イベントスケジュール

• ​18:30 – 19:00 チェックイン & ネットワーキング

• ​19:00 – 19:15 オープニング

• ​19:15 – 19:45 セットアップ & テーマ選び

• ​19:45 – 21:00 ハンズオン開発セッション（リサーチ → ビルド → プレゼン作成）

• ​21:00 – 21:30 デモ・Q&A・交流

​✨ なぜ参加する？

​このワークショップは、AI開発と内製化の"実践的な入口"です。

​AIでリサーチし、AIでコードを書き、AIでプレゼンを作る。 この一連の流れを体験すれば、 「自分たちで作れる」という感覚を持ち帰れます。

​3時間後、あなたのPCには 自分で作った東京シティガイドが動いています。

​🤝 共催

​Qoder ── AIが自律的に計画・実行するエージェント型コーディングプラットフォーム。

​AI Builders ── 野心的なアイデアをプロダクションシステムに変える、ビルダー・開発者・イノベーターのプレミアコミュニティ。

​English Version

​🚀 Build a Web App in 3 Hours

​Your First Vibe Coding Experience 🍕

​An AI Builders × Qoder hands-on workshop.

​Want to build something with AI — but not sure where to start?

​No worries. In this workshop, you'll experience "Vibe Coding" — building a real app by letting AI write the code with you 💻

​This is not lecture-heavy. It's implementation-focused. In just 3 hours, you'll ship your own "Best of Tokyo" city guide web app.

​No prior experience needed. You'll learn hands-on in-house development methods for the AI era.

​※ Please bring your own laptop 💻

​🛠 What You'll Do

• ​Research with QoderWork — find real spots, gather reviews, collect local tips

• ​Vibe Code with Qoder — build an interactive city guide in React

• ​Present with QoderWork — auto-generate a slide deck showcasing your guide

​Pick your own theme (ramen, hidden cafes, vintage shops, nightlife…) and build a guide that's uniquely yours.

​🗺 What You'll Build: A Tokyo City Guide

• ​Card-based UI displaying real spots with Japanese + English names

• ​Tag filters for browsing by category

• ​A suggested walking route connecting your top picks

• ​Copy-address button (paste straight into a taxi app or maps)

• ​Fully responsive — shareable on mobile

​Everyone picks a different theme, so demo time becomes a "Tokyo recommendations exchange."

​💡 What You'll Learn

• ​AI-powered research & data structuring with QoderWork

• ​Vibe Coding (natural language → working code) with Qoder

• ​Auto-generating presentations with QoderWork

• ​In-house development in the AI era — building the capability to ship your own tools

• ​The full research → build → present workflow, end to end

​You won't just say "AI is amazing." You'll take a project from research to production to presentation — all by yourself.

​👤 Who Is This For?

• ​Anyone curious about AI

• ​Those who want to experience Vibe Coding

• ​Complete programming beginners

• ​No-code users ready to level up

• ​Anyone interested in building AI-powered tools in-house

​No prior knowledge of APIs or web development required. If you're motivated, you're ready 👍

​🎁 What's Included (Free Event)

• ​Qoder Credits

• ​Drinks & light snacks 🍕🥤

​After the build session, we'll have a relaxed networking time to connect with other participants.

​🗓 Schedule

• ​18:30 – 19:00 Check-in & Networking

• ​19:00 – 19:15 Opening

• ​19:15 – 19:45 Setup & Theme Selection

• ​19:15 – 21:00 Hands-on Session (Research → Build → Present)

• ​21:00 – 21:30 Demo, Q&A & Networking

​✨ Why Join?

​This workshop is your practical gateway to AI development and in-house tool building.

​Research with AI. Code with AI. Present with AI. Experience the full loop, and walk away knowing you can ship on your own.

​Three hours later, you'll have your own Tokyo city guide running on your laptop — ready to share with friends.

​🤝 Co-hosts

​Qoder — An agentic AI-powered coding platform that autonomously plans and executes complex software development tasks.

​AI Builders — A premier community of builders, developers, and innovators turning ambitious ideas into production systems.