رفتن به محتوای اصلی

آموزش Vibe Coding از صفر تا صد؛ ساخت رایگان سایت و اپ با Google AI Studio

2026/09/06 34 بازدید 17 دقیقه مطالعه
آموزش Vibe Coding از صفر تا صد؛ ساخت رایگان سایت و اپ با Google AI Studio
در آموزش Vibe Coding از صفر تا صد یاد می‌گیرید با Google AI Studio و فقط با پرامپت، سایت و اپ بسازید، ظاهر را تغییر دهید، قابلیت اضافه کنید و پروژه را منتشر کنید.

تا چند سال قبل اگر ایده یک سایت یا اپلیکیشن به ذهنتان می‌رسید، مسیر تقریباً مشخص بود:

باید HTML و CSS یاد می‌گرفتید، بعد JavaScript، یک Framework، بک‌اند، دیتابیس، Deployment و احتمالاً چند بار هم وسط پروژه به این نتیجه می‌رسیدید که همان ایده روی کاغذ خیلی قشنگ‌تر بود!

اما با ابزارهای جدید برنامه‌نویسی مبتنی بر هوش مصنوعی، یک روش متفاوت برای ساخت نرم‌افزار شکل گرفته است:

Vibe Coding.

در Vibe Coding به‌جای اینکه تمام کد پروژه را خط‌به‌خط خودتان بنویسید، چیزی را که می‌خواهید بسازید با زبان طبیعی توضیح می‌دهید، هوش مصنوعی کد را تولید می‌کند، نتیجه را تست می‌کنید و بعد با توضیحات بیشتر آن را اصلاح می‌کنید.

مثلاً می‌گویید:

یک سایت مدیریت کارها برای دانشجوها بساز. طراحی مینیمال و تیره داشته باشد، امکان اضافه کردن Task، تعیین Deadline و فیلتر براساس وضعیت داشته باشد.

چند لحظه بعد یک پروژه قابل اجرا دارید.

بعد می‌گویید:

کارت‌های Task زیادی بزرگ هستند؛ جمع‌وجورترشان کن و Deadlineهای گذشته را قرمز نمایش بده.

و پروژه دوباره تغییر می‌کند.

Google حالا دقیقاً همین مفهوم را وارد Google AI Studio کرده و در مستندات رسمی خودش هم Build Mode را محیطی برای «vibe code کردن» اپلیکیشن معرفی می‌کند.

در این آموزش می‌خواهیم ببینیم Vibe Coding دقیقاً چیست، چطور با Google AI Studio از یک ایده به سایت و اپ واقعی برسیم و کجاها هنوز باید حواسمان به کد، امنیت و هزینه باشد.


Vibe Coding چیست؟

Vibe Coding روشی برای توسعه نرم‌افزار با کمک مدل‌های هوش مصنوعی است که در آن به‌جای نوشتن دستی بخش بزرگی از کد، پروژه را با زبان طبیعی برای AI توصیف می‌کنید.

بعد نتیجه را اجرا می‌کنید و با یک فرایند رفت‌وبرگشتی آن را بهتر می‌کنید:

**ایده → پرامپت → تولید کد → تست → اصلاح پرامپت → نسخه بهتر**

اصطلاح Vibe Coding در اوایل سال ۲۰۲۵ توسط Andrej Karpathy رایج شد و به شیوه‌ای اشاره داشت که در آن برنامه‌نویس بیشتر به مدل می‌گوید چه می‌خواهد و خروجی را آزمایش می‌کند، به‌جای اینکه همه کد را خودش بنویسد.

البته امروز مفهوم Vibe Coding کمی گسترده‌تر شده است.

ابزارهایی مثل Google AI Studio دیگر فقط یک فایل کد تولید نمی‌کنند؛ بلکه می‌توانند ساختار کامل پروژه، چندین فایل، رابط کاربری، بک‌اند، Packageها، APIها و حتی Deployment را مدیریت کنند.


Vibe Coding یعنی بدون نیاز به برنامه‌نویسی؟

هم بله، هم نه!

برای ساخت Prototype، MVP، ابزار شخصی یا پروژه ساده، ممکن است بتوانید بدون دانش جدی برنامه‌نویسی نتیجه بسیار خوبی بگیرید.

حتی خود Google می‌گوید هدف AI Studio پایین آوردن فاصله بین یک ایده و یک اپلیکیشن قابل اجراست و کاربران بدون سابقه کدنویسی هم می‌توانند از آن استفاده کنند.

اما این جمله:

«دیگه هیچ نیازی به برنامه‌نویس نداریم»

خیلی با واقعیت فاصله دارد.

هرچه پروژه بزرگ‌تر و حساس‌تر شود، موضوعاتی مثل:

امنیت،
معماری،
دیتابیس،
Performance،
Authentication،
مدیریت خطا،
هزینه API
و نگهداری کد

اهمیت بیشتری پیدا می‌کنند.

Vibe Coding برای شروع فوق‌العاده است؛ ولی اگر قرار است یک محصول واقعی با هزاران کاربر بسازید، بررسی فنی کد همچنان اهمیت دارد.


تفاوت Vibe Coding و برنامه‌نویسی سنتی

برنامه‌نویسی سنتیVibe Coding
نوشتن مستقیم کدتوضیح خواسته با زبان طبیعی
کنترل کامل روی ImplementationAI بخش بزرگی از Implementation را انجام می‌دهد
نیاز به دانش فنی بیشترشروع ساده‌تر برای مبتدی
Debug دستیتوضیح خطا به AI و درخواست اصلاح
تغییر UI با دستکاری CSS/Componentتوضیح تغییر با پرامپت
ساخت Feature با کدنویسیدرخواست Feature با زبان طبیعی
سرعت پایین‌تر Prototypeسرعت بسیار بالا برای Prototype
درک بیشتر از تمام کداحتمال کمتر شدن شناخت کد
مناسب ProductionVibe Coding هم قابل استفاده است ولی نیاز به Review دارد

بهترین حالت معمولاً ترکیب این دو است:

AI سریع می‌سازد؛ انسان بررسی و هدایت می‌کند.


Google AI Studio چیست؟

Google AI Studio محیط توسعه و آزمایش مدل‌های Gemini است.

قبلاً بیشتر آن را برای تست Prompt و گرفتن API Key می‌شناختیم، اما Build Mode آن امروز به یک محیط واقعی ساخت نرم‌افزار تبدیل شده است.

در Google AI Studio می‌توانید فقط با نوشتن چیزی که می‌خواهید، یک پروژه ایجاد کنید و Preview زنده آن را کنار کد ببینید.

Google در نسخه فعلی Build Mode امکان ساخت دو نوع اصلی پروژه را ارائه می‌کند:

نوع پروژهتکنولوژی اصلی
Web AppReact + Node.js
Android AppKotlin + Jetpack Compose

در پروژه‌های وب، React به‌صورت پیش‌فرض برای Front-end استفاده می‌شود و یک Runtime سمت سرور مبتنی بر Node.js هم وجود دارد.

این یعنی با یک سایت Static ساده طرف نیستیم.

AI Studio می‌تواند Full-stack App بسازد.


Antigravity Agent چیست؟

هسته جدید Build Mode به Agentای متکی است که Google آن را Antigravity Agent معرفی می‌کند.

این Agent فقط یک قطعه کد تولید نمی‌کند.

می‌تواند:

  • Context پروژه را حفظ کند
  • چند فایل را هم‌زمان مدیریت کند
  • Dependencyهای پروژه را تغییر دهد
  • کد را اجرا و بررسی کند
  • Feature جدید اضافه کند
  • مشکلات Build را برطرف کند
  • تغییرات مرتبط را در چند فایل اعمال کند

Google می‌گوید بخش‌هایی از Agent Harness پروژه Antigravity حالا تجربه Build Mode داخل AI Studio را قدرت می‌دهند.

به زبان ساده:

اگر بگویید:

سیستم Login اضافه کن.

Agent فقط یک Button نمی‌سازد؛ می‌تواند فایل‌ها و بخش‌های مختلف موردنیاز این Feature را تغییر دهد.


آیا Google AI Studio رایگان است؟

برای شروع، بله.

Google AI Studio Free Tier دارد و می‌توانید بدون خرید اشتراک وارد Build Mode شوید و پروژه بسازید.

البته باید بین سه چیز تفاوت بگذاریم:

ساخت پروژه، استفاده از مدل‌ها و انتشار Production.

استفاده رایگان دارای Quota است و اگر سهمیه رایگان تمام شود، ممکن است برای ادامه استفاده از بعضی مدل‌ها نیاز به API Key یا پلن پولی داشته باشید. کاربران Google AI Pro و Ultra هم Limit بالاتری در AI Studio دریافت می‌کنند.

پس عبارت دقیق‌تر این است:

**می‌توانید Vibe Coding و ساخت پروژه را رایگان شروع کنید، اما پروژه‌های بزرگ یا استفاده Production ممکن است هزینه داشته باشند.**

انتشار رایگان پروژه در Google AI Studio

این قسمت خیلی جذاب است.

Google در سال ۲۰۲۶ Google Cloud Starter Tier را برای AI Studio اضافه کرد.

کاربران واجد شرایط می‌توانند تا دو Full-stack App را بدون ساخت Billing Account منتشر کنند. هر Deployment در پشت صحنه روی Cloud Run اجرا می‌شود.

البته چند شرط وجود دارد.

مثلاً کسانی که قبلاً Billing فعال Google Cloud داشته‌اند ممکن است واجد شرایط Starter Tier نباشند.

بنابراین «دو Deployment رایگان» را باید یک امکان برای کاربران واجد شرایط دانست، نه تضمینی برای هر حساب گوگل.


شروع Vibe Coding در Google AI Studio

وارد Google AI Studio شوید و از منوی اصلی سراغ:

Build

بروید.

Google چند روش برای شروع پروژه ارائه می‌کند.

شروع با Prompt

ساده‌ترین روش همین است.

در کادر توضیح می‌دهید چه چیزی می‌خواهید.

مثلاً:

یک وب‌اپ مدیریت هزینه شخصی بساز. کاربر بتواند هزینه و درآمد اضافه کند، دسته‌بندی داشته باشد، مجموع این ماه را ببیند و نمودار هزینه‌ها نمایش داده شود. طراحی مدرن و Responsive باشد.

AI Studio شروع به ساخت پروژه می‌کند.

بعد از چند لحظه هم:

کد

و هم:

Live Preview

را می‌بینید.


AI Chips چیست؟

هنگام نوشتن Prompt می‌توانید از AI Chips استفاده کنید.

AI Chips برای اضافه کردن قابلیت‌های مشخص به پروژه هستند.

مثلاً قابلیت‌هایی مثل:

  • Image Generation
  • Google Maps
  • قابلیت‌های Gemini

را می‌توانید سریع‌تر وارد درخواست کنید.


I'm Feeling Lucky

اگر ایده ندارید، حتی لازم نیست Prompt اولیه را خودتان بنویسید.

Google AI Studio گزینه:

I'm Feeling Lucky

دارد.

با انتخاب آن، AI Studio یک ایده پروژه و Prompt اولیه برایتان می‌سازد.

برای آشنا شدن با قابلیت‌های Build Mode گزینه جالبی است.


App Gallery

یکی دیگر از راه‌های شروع، App Gallery است.

در Gallery پروژه‌های آماده وجود دارند که می‌توانید:

  • Preview کنید
  • ساختارشان را ببینید
  • Copy کنید
  • Remix کنید

این یعنی لازم نیست همیشه پروژه را از صفحه سفید شروع کنید.

گاهی یک پروژه نزدیک به چیزی که می‌خواهید پیدا می‌کنید و فقط با چند Prompt آن را تبدیل به ایده خودتان می‌کنید.


Import از GitHub

اگر از قبل پروژه دارید، AI Studio فقط برای پروژه‌های تازه نیست.

می‌توانید Repository موجود را از GitHub Import کنید و از Agent بخواهید روی همان پروژه کار کند.

AI Studio همچنین از Two-way Sync با GitHub پشتیبانی می‌کند.

یعنی تغییراتی که داخل AI Studio انجام می‌دهید می‌توانند به Repository Push شوند و تغییراتی که در IDE یا توسط هم‌تیمی انجام شده‌اند دوباره Pull شوند.

این قابلیت باعث می‌شود AI Studio فقط یک Playground نباشد و بتواند وارد Workflow واقعی توسعه شود.


اولین پروژه Vibe Coding خودمان را بسازیم

فرض کنید می‌خواهیم یک سایت برنامه‌ریزی سفر بسازیم.

Prompt اولیه:

یک وب‌اپ برنامه‌ریزی سفر بساز.
کاربر بتواند مقصد، تاریخ سفر و بودجه را وارد کند.
برنامه پیشنهاد مکان‌های دیدنی را نمایش دهد.
رابط کاربری مدرن و مینیمال باشد.
طراحی Responsive باشد و روی موبایل هم خوب نمایش داده شود.
صفحه اصلی Hero، فرم ساخت سفر، لیست سفرها و کارت مقصد داشته باشد.

این Prompt چند چیز مهم را مشخص کرده:

بخشاطلاعات
نوع محصولWeb App
کاربردبرنامه‌ریزی سفر
داده ورودیمقصد، تاریخ، بودجه
Featureپیشنهاد مکان
Styleمدرن و مینیمال
DeviceResponsive
صفحاتHero، فرم، لیست، کارت

هرچه درخواست اولیه واضح‌تر باشد، نسخه اول پروژه به چیزی که می‌خواهید نزدیک‌تر می‌شود.


فرمول پرامپت برای Vibe Coding

برای شروع می‌توانید از این ساختار استفاده کنید:

**چه چیزی می‌سازم + برای چه کسی + قابلیت‌ها + ظاهر + صفحات + رفتار + محدودیت‌ها**

مثلاً:

یک Dashboard برای فریلنسرها بساز که بتوانند پروژه‌ها، درآمد و Deadlineها را مدیریت کنند.
صفحه Dashboard شامل آمار درآمد، پروژه فعال و Taskهای نزدیک Deadline باشد.
امکان ساخت پروژه جدید، تغییر وضعیت پروژه و فیلتر وجود داشته باشد.
طراحی Dark Mode، ساده و حرفه‌ای باشد.
از کارت‌های خیلی بزرگ و Gradientهای شدید استفاده نکن.
رابط کاملاً Responsive باشد.

بزرگ‌ترین اشتباه در Vibe Coding

یکی از بدترین Promptها:

یه سایت خفن بساز.

«خفن» Specification نرم‌افزار نیست!

مدل مجبور می‌شود خودش تصمیم بگیرد:

سایت برای کی است؟

چه Featureهایی دارد؟

چه Styleای؟

چند صفحه؟

چه اطلاعاتی؟

چه هدفی؟

خروجی احتمالاً از نظر فنی کار می‌کند، اما چیزی نیست که واقعاً می‌خواستید.


با پروژه مرحله‌ای جلو بروید

اشتباه بعدی این است که یک Prompt چهارصفحه‌ای بنویسید و انتظار داشته باشید کل استارتاپ شما یکجا ساخته شود.

روش بهتر:

مرحله اول

MVP را بسازید.

فقط صفحه اصلی و ساخت Task را پیاده‌سازی کن.

مرحله دوم

Feature اضافه کنید.

حالا امکان Edit و Delete Task اضافه کن.

مرحله سوم

ظاهر را اصلاح کنید.

Sidebar باریک‌تر شود و کارت‌ها Compactتر شوند.

مرحله چهارم

داده واقعی اضافه کنید.

حالا اطلاعات را داخل Database ذخیره کن.

Vibe Coding بیشتر شبیه یک مکالمه با توسعه‌دهنده است تا سفارش یک پروژه کامل در یک جمله.


تغییر ظاهر سایت با پرامپت

فرض کنید پروژه ساخته شده ولی ظاهرش را دوست ندارید.

لازم نیست فایل CSS را پیدا کنید.

می‌توانید بگویید:

طراحی فعلی زیادی شلوغه.
رنگ‌ها رو خنثی‌تر کن.
فاصله بین بخش‌ها رو کمتر کن.
Border Radius کارت‌ها 12px باشه.
از Shadow خیلی کم استفاده کن.
Header روی Desktop حداکثر 1200px عرض داشته باشه.

Agent تغییرات را روی پروژه اعمال می‌کند.


Annotation Mode؛ روی چیزی که می‌خواهید تغییر کند اشاره کنید

یکی از بهترین قابلیت‌های Build Mode، Annotation Mode است.

به‌جای اینکه بگویید:

اون کارت دوم سمت راست که زیر عنوانه رو کوچیک کن...

می‌توانید همان عنصر را روی Preview انتخاب کنید و بگویید:

این بخش را نصف اندازه فعلی کن.

Google Annotation Mode را دقیقاً برای همین Workflow اضافه کرده است؛ عنصر رابط را مشخص می‌کنید و تغییر موردنظر را با زبان طبیعی می‌گویید.

این قابلیت Vibe Coding را بسیار طبیعی‌تر می‌کند.


می‌توانیم خود کد را هم ببینیم؟

بله.

در کنار Preview، تب Code وجود دارد.

در هر لحظه می‌توانید فایل‌هایی که AI تولید کرده را ببینید و حتی خودتان کد را ویرایش کنید.

این برای برنامه‌نویس‌ها بسیار مهم است.

Vibe Coding قرار نیست شما را مجبور کند فقط به AI اعتماد کنید.

می‌توانید:

Prompt کنید، کد را ببینید، دستی تغییر دهید و دوباره Prompt کنید.


ساخت Full-stack App با Google AI Studio

یکی از تغییرات مهم AI Studio در ۲۰۲۶ اضافه شدن Full-stack Runtime است.

پروژه وب می‌تواند دو بخش داشته باشد:

Client

به‌صورت پیش‌فرض React.

Server

Node.js.

Runtime سرور اجازه می‌دهد:

  • Logic سمت سرور بنویسید
  • APIهای خارجی صدا بزنید
  • Database وصل کنید
  • npm Package نصب کنید
  • Secret نگه دارید

این یعنی پروژه شما فقط چند Component نمایشی نیست.


نصب Package با پرامپت

حتی برای اضافه کردن npm Package لازم نیست الزاماً Terminal باز کنید.

مثلاً:

برای دریافت اطلاعات از API از axios استفاده کن.

Agent می‌تواند Package موردنیاز را نصب و داخل کد استفاده کند.


اتصال Database به پروژه

اگر بگویید:

اطلاعات کاربران و پروژه‌ها باید دائمی ذخیره شوند. یک Database اضافه کن.

AI Studio می‌تواند پروژه را به سرویس‌هایی مثل Firebase متصل کند.

Google در حال حاضر Integration مستقیم با Firestore و Firebase Authentication ارائه می‌دهد.

برای مثال:

به برنامه Firebase اضافه کن. کاربران با Google وارد شوند و Taskهای هر کاربر داخل Firestore ذخیره شوند.

Agent می‌تواند بخش بزرگی از Setup و Code Generation را انجام دهد.


اضافه کردن Login با Google

یکی از درخواست‌های کاربردی:

امکان Sign in with Google اضافه کن و فقط کاربران واردشده بتوانند Dashboard را ببینند.

AI Studio می‌تواند Firebase Authentication را Provision و تنظیم کند و کد Login را هم داخل پروژه اضافه کند.


اتصال Gmail، Drive، Sheets و Calendar

یکی از جذاب‌ترین امکانات جدید AI Studio اتصال به Google Workspace است.

می‌توانید اپ‌هایی بسازید که با:

  • Gmail
  • Google Sheets
  • Docs
  • Drive
  • Calendar

کار کنند.

مثلاً:

یک Dashboard بساز که ایمیل‌های خوانده‌نشده Gmail من را خلاصه کند.

یا:

یک Expense Tracker بساز که هر هزینه را داخل Google Sheets ذخیره کند.

AI Studio بخش زیادی از API و OAuth موردنیاز را خودش تنظیم می‌کند.


Secret و API Key را کجا قرار دهیم؟

اگر سرویس خارجی مثل:

Stripe،
SendGrid،
Supabase
یا API اختصاصی

دارید، کلید آن را داخل کد Front-end ننویسید.

Google AI Studio بخش Secrets دارد.

کلیدها در محیط Server-side قرار می‌گیرند و از Browser کاربر قابل مشاهده نیستند.

برای Gemini API هم در پروژه‌های جدید، AI Studio به‌صورت خودکار GEMINI_API_KEY را به‌عنوان Secret سمت سرور تنظیم می‌کند.


ساخت اپ Android با Vibe Coding

Google AI Studio فقط Web App نمی‌سازد.

در Build Mode می‌توانید Platform را روی:

Android

قرار دهید.

بعد با زبان طبیعی بگویید:

یک اپ مدیریت کارهای روزانه بساز. کاربر بتواند Task اضافه کند، Task را Complete کند و برنامه Dark Mode داشته باشد.

Antigravity Agent یک پروژه Native Android با:

Kotlin + Jetpack Compose

تولید می‌کند.


Preview اپ Android داخل مرورگر

نیازی نیست برای تست اولیه Android Studio نصب کنید.

AI Studio یک Emulator مبتنی بر Browser در اختیار شما قرار می‌دهد.

همچنین می‌توانید از ADB برای نصب اپ روی دستگاه Android واقعی استفاده کنید.


آیا می‌توان اپ را در Google Play منتشر کرد؟

Google امکان اتصال Google Play Developer Account را هم اضافه کرده است.

می‌توانید پروژه را برای تست به Internal Test Track در Google Play ارسال کنید.

البته این را با انتشار کامل و عمومی در Store اشتباه نگیرید.

Internal Testing مرحله‌ای برای آزمایش اپلیکیشن است.


تفاوت Web App و Android App در AI Studio

Web AppAndroid App
ReactKotlin
Node.js ServerClient-side
Full-stackNative Android
Firebase Integrationمحدودتر
Workspace APIبرای وب
SecretsServer-side
Preview مرورگرAndroid Emulator
Deploy روی Cloud Runنصب و تست Android
Responsive WebNative UI

در وضعیت فعلی، قابلیت‌های Server-side مثل Firebase Integration، Workspace API و Multiplayer برای پروژه‌های وب گسترده‌ترند و پروژه Android در AI Studio Client-side است.


ساخت قابلیت AI داخل اپ

چون داخل Google AI Studio هستیم، اضافه کردن قابلیت‌های Gemini بسیار ساده‌تر است.

مثلاً:

داخل اپ یک AI Assistant اضافه کن که اطلاعات واردشده توسط کاربر را تحلیل کند و پیشنهاد بدهد.

یا:

کاربر یک عکس آپلود کند و AI محتویات آن را تحلیل کند.

یا:

قابلیت ساخت تصویر با Nano Banana اضافه کن.

Build Mode حتی AI Chips مخصوص قابلیت‌هایی مثل Image Generation دارد.


GitHub و ادامه توسعه خارج از AI Studio

اگر پروژه جدی‌تر شد، مجبور نیستید تا ابد داخل AI Studio بمانید.

دو مسیر دارید:

GitHub Sync

Repository را متصل کنید و تغییرات را Push/Pull کنید.

Download ZIP

کل پروژه را Download کنید و داخل:

VS Code،
WebStorm
یا IDE موردعلاقه‌تان

ادامه دهید.

این برای برنامه‌نویس‌ها نقطه بسیار مهمی است؛ کدی که AI Studio می‌سازد زندانی پلتفرم نیست.


انتشار سایت با Google AI Studio

وقتی پروژه آماده شد، از Build Mode می‌توانید آن را Publish کنید.

Google AI Studio برای Web App از Cloud Run استفاده می‌کند.

در Starter Tier، کاربران واجد شرایط می‌توانند تا دو Full-stack App را بدون Billing Account منتشر کنند.

بعد از Deployment هم یک URL برای اپ دریافت می‌کنید.

حتی امکان تعیین Subdomain زیر دامنه ai.studio وجود دارد.


آیا سایت ساخته‌شده واقعاً رایگان است؟

برای آموزش و شروع پروژه:

می‌تواند باشد.

ولی باید تفاوت این موارد را بدانید:

بخشوضعیت
ساخت اولیهFree Tier دارد
Previewرایگان برای شروع
استفاده از مدلدارای Quota
دو Deployment اولیهبرای کاربران واجد شرایط رایگان
APIهای پولیممکن است هزینه داشته باشند
Cloud Run بعد از Starterممکن است هزینه داشته باشد
FirebaseFree Tier + پلن‌های پولی
استفاده زیاد کاربرانمی‌تواند هزینه ایجاد کند

پس اگر یک اپ را برای خودتان یا نمونه اولیه می‌سازید، احتمالاً می‌توانید با هزینه صفر شروع کنید.

اگر محصول شما ۱۰۰ هزار کاربر گرفت...

خب، اول تبریک!

بعد احتمالاً وقتش رسیده درباره هزینه Infrastructure هم فکر کنید.


Vibe Coding برای چه پروژه‌هایی عالی است؟

Vibe Coding مخصوصاً برای این نوع پروژه‌ها بسیار مناسب است:

  • MVP
  • Landing Page
  • Dashboard
  • ابزار داخلی شرکت
  • Prototype
  • سایت شخصی
  • Portfolio
  • ابزار AI
  • اپ مدیریت Task
  • فرم و پنل مدیریتی
  • پروژه آموزشی
  • اثبات ایده

برای چیزی که می‌خواهید سریع امتحان کنید، سرعت آن واقعاً چشمگیر است.


کجا باید بیشتر احتیاط کنیم؟

هر چیزی را نباید با «Accept All» منتشر کرد.

برای پروژه‌هایی که شامل:

  • پرداخت
  • اطلاعات پزشکی
  • اطلاعات مالی
  • داده شخصی
  • Authentication حساس
  • دسترسی مدیریتی
  • اطلاعات محرمانه

هستند، Review کد و تست امنیت اهمیت بسیار بیشتری دارد.

Martin Fowler هم درباره تعریف دقیق Vibe Coding هشدار می‌دهد که ساخت نرم‌افزار بدون نگاه کردن به کد می‌تواند مشکلات Maintainability، Correctness و Security ایجاد کند.


۱۰ قانون برای Vibe Coding بهتر

اشتباهروش بهتر
«یه سایت خوب بساز»هدف و Featureها را مشخص کن
درخواست کل پروژه در یک Promptمرحله‌ای جلو برو
تغییر چند چیز هم‌زمانهر بار یک تغییر مشخص
اعتماد کامل به AIنتیجه را تست کن
گذاشتن API Key در کداز Secrets استفاده کن
ساخت مستقیم Productionاول MVP
نخواندن ErrorError را به Agent بده
تغییر بدون Backupاز GitHub استفاده کن
ندانستن وضعیت قبلیتغییرات را دقیق توضیح بده
Deploy فوریAuthentication و Permission را بررسی کن

یک Workflow حرفه‌ای برای Vibe Coding

بهترین فرایند برای پروژه‌ای که می‌خواهید واقعاً ادامه دهید:

**ایده → تعریف MVP → Prompt اولیه → Preview → اصلاح UI → اضافه کردن Feature → Database → Authentication → Test → GitHub → Deployment**

این مسیر خیلی بهتر از این است که Prompt بزنید:

«یه اینستاگرام جدید بساز که بهتر از اینستاگرام باشه.»

و منتظر IPO بمانید!


چند پرامپت آماده برای Google AI Studio

ساخت Landing Page

یک Landing Page فارسی و RTL برای یک سرویس مدیریت پروژه بساز. مخاطب تیم‌های برنامه‌نویسی کوچک هستند. صفحه شامل Hero، مزایا، امکانات، Pricing، FAQ و Footer باشد. طراحی مدرن، Dark Mode و Responsive باشد. از Gradient زیاد استفاده نکن و CTA اصلی کاملاً مشخص باشد.

ساخت Task Manager

یک Full-stack Task Manager بساز. کاربر بتواند ثبت‌نام کند، Project بسازد، Task اضافه کند، Deadline و Priority تعیین کند و Taskها را براساس وضعیت فیلتر کند. اطلاعات در Database ذخیره شوند و Login با Google داشته باشد.

اپ مدیریت هزینه

یک Expense Tracker برای Android بساز. کاربر بتواند درآمد و هزینه اضافه کند، دسته‌بندی انتخاب کند و مجموع ماه را ببیند. صفحه Dashboard نمودار ساده داشته باشد. UI با Material Design و Jetpack Compose ساخته شود.

اضافه کردن قابلیت AI

داخل این پروژه یک AI Assistant اضافه کن که اطلاعات Dashboard را تحلیل کند و سه پیشنهاد عملی به کاربر بدهد. پاسخ‌ها کوتاه و براساس داده واقعی همان کاربر باشند.

آیا Vibe Coding جای برنامه‌نویس را می‌گیرد؟

پرسش دقیق‌تر این است:

Vibe Coding نقش برنامه‌نویس را چطور تغییر می‌دهد؟

بخش بیشتری از زمان توسعه از:

نوشتن Syntax

به سمت:

تعریف مسئله،
طراحی سیستم،
بررسی خروجی،
تست،
تصمیم معماری
و هدایت Agent

می‌رود.

برنامه‌نویسی که هم توسعه نرم‌افزار می‌فهمد و هم بلد است از Agent درست استفاده کند، در بسیاری از پروژه‌ها می‌تواند بسیار سریع‌تر کار کند.

در طرف مقابل، فردی که هیچ شناختی از نرم‌افزار ندارد هم حالا می‌تواند ایده‌هایی را Prototype کند که قبلاً برایش دست‌نیافتنی بودند.


سوالات متداول درباره Vibe Coding

Vibe Coding چیست؟

Vibe Coding روشی برای ساخت نرم‌افزار با کمک مدل‌های هوش مصنوعی است که در آن کاربر خواسته خود را با زبان طبیعی توضیح می‌دهد و AI بخش بزرگی از کد را تولید و اصلاح می‌کند.

آیا Vibe Coding نیاز به برنامه‌نویسی دارد؟

برای ساخت پروژه‌های ساده الزاماً نه. اما برای توسعه پروژه‌های جدی، Debug، امنیت و نگهداری، دانش برنامه‌نویسی همچنان مزیت بسیار بزرگی است.

Google AI Studio برای Vibe Coding رایگان است؟

Google AI Studio Free Tier دارد و می‌توانید ساخت پروژه را رایگان شروع کنید. استفاده از مدل‌ها دارای Quota است و بعضی امکانات یا استفاده Production ممکن است هزینه داشته باشند.

می‌توان با Google AI Studio سایت ساخت؟

بله. Build Mode می‌تواند Full-stack Web App با React در Front-end و Node.js در Server ایجاد کند.

می‌توان با Google AI Studio اپ Android ساخت؟

بله. AI Studio در وضعیت فعلی می‌تواند Native Android App با Kotlin و Jetpack Compose تولید کند.

آیا می‌توان سایت را رایگان منتشر کرد؟

کاربران واجد شرایط Google Cloud Starter Tier می‌توانند تا دو Full-stack App را بدون Billing Account منتشر کنند.

Google AI Studio دیتابیس دارد؟

می‌توانید از Integrationهای Firebase مثل Firestore استفاده کنید یا Databaseهای خارجی را متصل کنید.

می‌توان Login به سایت اضافه کرد؟

بله. Firebase Authentication و Sign in with Google می‌توانند از طریق Agent به پروژه اضافه شوند.

آیا کد پروژه را می‌توان دانلود کرد؟

بله. می‌توانید پروژه را ZIP کنید یا با GitHub همگام‌سازی کنید و توسعه را خارج از AI Studio ادامه دهید.

آیا Vibe Coding برای پروژه واقعی مناسب است؟

بله، ولی هرچه پروژه حساس‌تر و بزرگ‌تر باشد، Code Review، Security، Testing و مدیریت Infrastructure اهمیت بیشتری پیدا می‌کند.


جمع‌بندی؛ از «ایده دارم» تا «اپ ساختم»

چیزی که Vibe Coding را جذاب می‌کند فقط این نیست که AI برایمان کد می‌نویسد.

تغییر اصلی این است که فاصله بین ایده و نسخه قابل اجرا به‌شدت کمتر شده است.

با Google AI Studio می‌توانید:

ایده را توضیح دهید،

پروژه را بسازید،

Preview زنده ببینید،

با Prompt ظاهر را تغییر دهید،

Feature اضافه کنید،

Database و Login بسازید،

API متصل کنید،

کد را ببینید،

GitHub را Sync کنید

و در نهایت پروژه را Deploy کنید.

Google حتی در مستندات رسمی Build Mode، همین فرایند را به‌عنوان مسیری برای vibe code و deploy کردن اپلیکیشن معرفی می‌کند.

برای کسی که برنامه‌نویس نیست، این ابزارها امکان تبدیل ایده به Prototype را فراهم کرده‌اند.

برای برنامه‌نویس هم Vibe Coding می‌تواند تعداد زیادی از کارهای تکراری را سریع‌تر کند.

اما قانون اصلی همچنان همان است:

**هوش مصنوعی مسئول نوشتن بخش زیادی از کد می‌شود؛ مسئولیت اینکه محصول درست، امن و قابل نگهداری باشد هنوز با شماست.**

اگر هنوز پرامپت‌نویسی را بلد نیستید، قبل از جدی شدن پروژه حتماً سراغ آموزش پرامپت‌نویسی بروید؛ چون در Vibe Coding، پرامپت عملاً تبدیل به یکی از ابزارهای اصلی توسعه نرم‌افزار شده است.

مقالات مرتبط

نظرات (0)

ارسال نظر جدید

لینک‌ها به طور خودکار شناسایی می‌شوند.

هنوز نظری ثبت نشده است. اولین نفر باشید!