۱. مقدمه
نمای کلی
ساخت و ساز با هوش مصنوعی امروزه از کجا شروع میشود؟ برای اکثر ما، با یک پرس و جو یا نمونه اولیه شروع میشود. Google AI Studio یک حالت ساخت قدرتمند (که اغلب به عنوان "کدنویسی vibe" شناخته میشود) ارائه میدهد که به شما امکان میدهد برنامههای وب را با استفاده از تولید کد هدایت شده توسط مدلهای Gemini طراحی، آزمایش و بسازید.
در این آزمایشگاه کد، شما یک وبسایت نمونه کار شخصی خواهید ساخت. کارشناس AI Studio کد frontend را خواهد نوشت. پس از اتمام کار، میتوانید آن را مستقیماً با یک کلیک در Cloud Run مستقر کنید.
کاری که انجام خواهید داد
- از استودیوی هوش مصنوعی گوگل بخواهید که یک نمونه اولیه از وبسایت نمونه کارهای شخصی شما ایجاد کند.
- برنامه را در محیط پیشنمایش تعاملی (interactive preview sandbox) آزمایش کنید.
- برنامه را مستقیماً از رابط کاربری Google AI Studio روی Cloud Run مستقر کنید.
آنچه یاد خواهید گرفت
- نحوه استفاده از حالت ساخت (Build mode) در Google AI Studio برای نمونهسازی سریع یک سرویس frontend با استفاده از زبان طبیعی.
- چگونه برنامه AI Studio خود را به عنوان یک کانتینر بدون سرور در Cloud Run مستقر کنید.
۲. راهاندازی پروژه
قبل از راهاندازی AI Studio، وضعیت حساب کاربری و پیشنیازهای آن را بررسی کنید.
اطلاعات حساب و سطح گوگل
- اگر از قبل حساب گوگل ندارید، یک حساب گوگل ایجاد کنید .
- نکته : در صورت امکان از یک حساب گوگل شخصی برای این آزمایشگاه استفاده کنید. حسابهای کاربری گروهی، شرکتی یا مدرسه ممکن است سیاستهای Workspace را اعمال کنند که ویژگیهای آزمایشی یا ادغامهای ابری را غیرفعال میکند.
- جزئیات صورتحساب برای استقرار را بررسی کنید:
- سطح شروع گوگل کلود : امکان انتشار حداکثر دو برنامه کامل در یک منطقه منتخب را بدون هیچ هزینهای و بدون ایجاد یک حساب پرداخت کامل گوگل کلود فراهم میکند.
- استقرار استاندارد : به یک پروژه پولی موجود در گوگل کلود متصل میشود و محدودیتهای ذخیرهسازی، منابع CPU و APIها را افزایش میدهد.
۳. یک وبسایت نمونهکار در حالت ساخت استودیوی هوش مصنوعی ایجاد کنید
پوسته برنامه را ایجاد کنید و از دستیار کد هوش مصنوعی بخواهید طرحبندی ظاهری (frontend) را بسازد.
- به پنل برنامههای Google AI Studio بروید و روی New App کلیک کنید.
- در کادر گفتگوی سریع، توضیحات مربوط به درخواست نمونهکار خود را وارد کنید:
Build a professional personal portfolio website. The site should have a modern, responsive design and sections for my biography, projects showcase, skills, and links to my professional profiles (e.g., GitHub, LinkedIn). - برای شروع فرآیند تولید برنامه، روی ساخت (Build) کلیک کنید.
۴. آزمایش و تکرار
قبل از راهاندازی سرویس به صورت زنده، بررسیهای اعتبارسنجی را در پیشنمایش تعاملی اجرا کنید.
- پنجره پیشنمایش را در داخل Google AI Studio باز کنید.
- برای تأیید تجربه بصری، با هر دکمه ناوبری، پیوند یا طرحبندی در پنجره پیشنمایش تعامل کنید.
- نکتهای در مورد رفع خطاها : در طول تولید یا آزمایش، ممکن است گاهی اوقات با مشکلات زمان اجرا یا خطاهای کامپایل مواجه شوید. در این صورت، AI Studio یک دکمه رفع مشکل را در چت نمایش میدهد و به شما این امکان را میدهد که از اپراتور بخواهید به طور خودکار مشکل را تشخیص داده و برطرف کند.
- اگر میخواهید ظاهر یا رفتار را تغییر دهید، از طریق پنجره چت به اپراتور دستور دهید. برای مثال:
-
"Could you style the interface using Tailwind CSS, and add a dark mode toggle button?" -
"Include a new section to showcase my recent presentations and talks."
-
- منتظر بمانید تا عامل، کدبیس را بهروزرسانی کند و مرورگر پیشنمایش را برای مشاهده بهروزرسانیها بررسی کنید.
۵. استقرار در Cloud Run
وقتی نمونه اولیه شما کاملاً کاربردی شد، آن را به عنوان یک سرویس عمومی در Cloud Run مستقر کنید.
- در گوشه سمت راست بالای Google AI Studio، روی دکمه Publish کلیک کنید تا ویزارد استقرار (deployment wizard) آغاز شود.
- برای پیکربندی پروژه Google Cloud خود، روی «شروع به کار» کلیک کنید.
- تأیید کنید که منوی کشویی target Google Cloud Project با پروژهای که به فضای کاری خود مرتبط کردهاید، مطابقت دارد.
- AI Studio به طور خودکار یک شناسه سرویس منحصر به فرد برای نمونه Cloud Run ایجاد میکند.
- اگر این اولین بار است که از پارامترهای استاندارد Google Cloud استفاده میکنید، ممکن است از شما خواسته شود نوع سازمان را مشخص کنید و جزئیات صورتحساب را ارائه دهید.
- روی انتشار برنامه کلیک کنید.
- مراحل ساخت کانتینر، ثبت کانتینر و استقرار سرویس در پسزمینه اتفاق میافتد. این فرآیند معمولاً در عرض ۲ تا ۴ دقیقه تکمیل میشود.
- پس از اتمام استقرار، آدرس اینترنتی برنامه تولید شده را کپی کرده و لینک برنامه زنده را در یک برگه مرورگر مشاهده کنید.
- برنامه وب زنده را در مرورگر خود آزمایش کنید!
۶. (اختیاری) یک دامنه سفارشی اضافه کنید
به طور پیشفرض، Cloud Run سرویس شما را در یک زیردامنه run.app توسط گوگل مدیریت میشود، میزبانی میکند. اگر میخواهید از یک دامنه شخصی (مانند yourname.com یا portfolio.yourname.com ) استفاده کنید، میتوانید یک دامنه سفارشی را به سرویس خود نگاشت کنید.
مرحله 1: اضافه کردن نگاشت دامنه در Cloud Run
- به صفحه Cloud Run Domain Mappings در کنسول Google Cloud بروید.
- روی افزودن نقشهبرداری کلیک کنید.
- سرویس Cloud Run مورد نظر برای نقشه برداری را از منوی کشویی انتخاب کنید.
- نام دامنه دلخواه خود را وارد کنید (برای مثال،
yourname.comیاportfolio.yourname.com). - روی «بعدی» یا «ادامه» کلیک کنید. Cloud Run رکوردهای DNS (مانند رکوردهای
A/AAAAیاCNAME) را که باید با ثبتکننده دامنه خود ایجاد کنید، نمایش میدهد.
مرحله 2: ثبت کننده DNS خود را پیکربندی کنید
- وارد پنل مدیریت ثبتکننده دامنه خود شوید (برای مثال، Squarespace، GoDaddy یا Namecheap).
- صفحه پیکربندی مدیریت DNS یا تنظیمات DNS را برای دامنه خود باز کنید.
- رکوردهای DNS مطابق با مقادیر نشان داده شده در ویزارد نگاشت Cloud Run ایجاد کنید:
- برای نگاشت دامنههای رأس (مثلاً
yourname.com)، رکوردهایAوAAAAذکر شده را اضافه کنید. - برای نگاشتهای زیردامنه (مثلاً
portfolio.yourname.com)، رکوردCNAMEذکر شده را اضافه کنید.
- برای نگاشت دامنههای رأس (مثلاً
- تغییرات پیکربندی DNS را ذخیره کنید.
مرحله 3: منتظر بمانید تا گواهی SSL ارائه شود
پس از انتشار تغییرات DNS:
- گوگل کلود به طور خودکار یک گواهی SSL/TLS مدیریتشده برای اتصال امن شما ارائه میدهد.
- این فرآیند معمولاً در حدود ۱۵ دقیقه تکمیل میشود، اما بسته به انتشار DNS میتواند تا ۲۴ ساعت طول بکشد.
- پس از تکمیل، دامنه سفارشی شما با خیال راحت به وبسایت نمونه کارهایتان هدایت میشود.
۷. تمیز کردن
برای جلوگیری از هرگونه هزینه پیشبینی نشده یا پاکسازی منابع فضای کاری خود:
- در Google AI Studio، به صفحه برنامهها بروید.
- برنامه خود را در شبکه یا لیست پیدا کنید.
- برای حذف وضعیت برنامه و لغو انتشار سرویس از Cloud Run، روی نماد سطل زباله کلیک کنید.
- اگر با استفاده از یک پروژه استاندارد مستقر شدهاید و میخواهید تمام منابع را به طور کامل خاموش کنید، به تنظیمات پروژه کنسول گوگل کلود بروید و پروژه اصلی را حذف کنید.
۸. نتیجهگیری
تبریک! شما یک وبسایت نمونهکار را مستقیماً از Google AI Studio طراحی، توسعه و مستقر کردهاید.
اطلاعات بیشتر
برای دریافت نشان Completed Builder Journey به این لینک مراجعه کنید!
برای ادامه سفرتان، برای آزمایشگاه بعدی به goo.gle/builders بروید.