قصه یک شب کدنویسی: ساخت INJA.ONLINE Builder
🚀 تا حالا ایده‌ای داشتی که انقدر هیجان‌انگیز باشه که تا صبح مجبورت کنه کد بزنی؟ این داستان INJA.ONLINE Builder هست! 🚀
آغاز داستان: شب ۲۴ مه ۲۰۲۵
همه چیز از شب ۲۴ مه ۲۰۲۵ شروع شد. من (محمد) و همکارم علیرضا از تیم INJA.ONLINE برای هکاتونی که توسط Cerebras Systems و OpenRouter برگزار می‌شد ثبت‌نام کرده بودیم. راستش دیر وقت بود و فکر شروع یک پروژه جدید ترسناک به نظر می‌رسید. نزدیک بود اصلاً شروع نکنیم.
اما بعد اون "چرا که نه؟" کلاسیک اومد تو کار. تصمیم گرفتیم یه شانس بدیم، با یه ایده ساده شروع کردیم: چی میشه اگه بتونیم ساخت وب‌سایت رو به راحتی صحبت کردن درآوریم؟
با این انگیزه و یه موج ناگهانی الهام (و احتمالاً مقدار زیادی قهوه!)، ساعت ۹ شب شنبه شروع به کدنویسی کردیم. اون که دنبالش اومد یه اسپرینت فشرده و متمرکز تا ۳ صبح بود، و تا اون موقع نسخه اول INJA.ONLINE Builder زنده بود!
چیزی بیشتر از یک هکاتون
هکاتون تموم شد، اما جرقه نه. نتونستم در مقابل میل ادامه دادن و بهتر کردن چیزی که شروع کرده بودیم مقاومت کنم. این پروژه شاهدی بر اشتیاق، کار تیمی و چیزیه که تحت فشار هم میشه ساخت.
🎥 داستان ما و ابزار در حال کار رو اینجا ببینید: https://youtu.be/XMm-aPl9zYQ
INJA.ONLINE Builder چیه؟
INJA.ONLINE (https://builder.inja.online) یک اثبات مفهوم (proof-of-concept) هست که پتانسیل فوق‌العاده هوش مصنوعی تولیدی رو در توسعه وب نشون میده. بله، ابزارهای شگفت‌انگیزی مثل bolt.sh و غیره وجود داره. اما ما می‌خواستیم چند تفاوت کلیدی رو بررسی کنیم:
- رایگان برای استفاده!
- فوق‌العاده سریع، به لطف تکنولوژی زیرساخت
- هدف‌مون مدل "کلید خودتون رو بیارید" (BYOK) برای حداکثر انعطاف‌پذیری
- و چشم‌اندازمون برای چیزهای بیشتر، مثل یه Q&A تعاملی که هوش مصنوعی از شما سوال‌های روشن‌کننده بپرسه تا سایت بهتری بسازه
قابلیت‌های کلیدی
✨ کلمات تبدیل به وب‌سایت: چشم‌اندازتون رو توصیف کنید، HTML رو می‌سازه
💻 زنده و فعال: وب‌سایتتون رو در زمان واقعی ببینید
💬 چت و بهبود: از طریق گفتگو روی طراحیتون کار کنید
🎨 مدرن و شیک: خروجی‌ها از Alpine.js، Tailwind CSS و Lucide Icons استفاده می‌کنه
جادوی پشت صحنه
رابط کاربری:
- ساخته شده با SvelteKit 5 و TypeScript برای تجربه‌ای سریع و پاسخگو
قدرت هوش مصنوعی:
- از Cerebras API از طریق OpenRouter استفاده می‌کنه
- تغییر واقعی بازی پردازنده‌های تخصصی هوش مصنوعی Cerebras Systems هست که مدل‌های متن‌باز مثل Qwen رو تقویت می‌کنه و قادرشون می‌کنه به سرعت‌های حیرت‌انگیز تا ۲۰۰۰ توکن در ثانیه برسن! این همون چیزیه که تولید زمان واقعی رو ممکن می‌کنه
طراحی:
- استایل داده شده با Tailwind CSS 4.0 برای ظاهری مدرن
چطور کار می‌کنه؟
- چشم‌اندازتون رو شرح بدید: توضیح زبان طبیعی از وب‌سایتی که می‌خواید بسازید وارد کنید
- تولید هوش مصنوعی: AI قدرت‌گرفته از Cerebras درخواستتون رو تجزیه می‌کنه و کد HTML تمیز تولید می‌کنه
- پیش‌نمایش زنده: وب‌سایتتون رو در زمان واقعی با پنل پیش‌نمایش واکنش‌گرا ببینید
- تکرار و بهبود: با AI چت کنید تا تغییرات و بهبودها رو اعمال کنید
- صادرات: فایل HTML کامل آماده استقرار رو دریافت کنید
معماری فنی
بک‌اند:
- مسیرهای API SvelteKit
- یکپارچه‌سازی Cerebras API از طریق OpenRouter
- رندر سمت سرور
وب‌سایت‌های تولید شده از چی استفاده می‌کنن:
- فقط HTML، CSS و JS
- Alpine.js برای تعامل
- Tailwind CSS برای استایل (CDN)
- Lucide Icons برای آیکون‌ها
- اصول طراحی واکنش‌گرا
ویژگی‌های منحصر به فرد
مدل "کلید خودتون رو بیارید" (BYOK)
یکی از ویژگی‌هایی که واقعاً بهش افتخار می‌کنیم سیستم BYOK هست. می‌تونید کلید OpenRouter API خودتون رو وارد کنید. این کنترل کامل، شفافیت و استفاده از مدل‌هایی که ترجیح میدید رو بهتون میده.
سرعت فوق‌العاده
سرعت از استفاده Cerebras API از طریق OpenRouter میاد. پردازنده‌های فوق‌العاده هوش مصنوعی Cerebras Systems که می‌تونن مدل‌های متن‌باز مثل Qwen رو با سرعت‌های ذهن‌فرسای تا ۲۰۰۰ توکن در ثانیه اجرا کنن! این همون چیزیه که تولید و تکرار زمان واقعی رو ممکن می‌کنه.
رابط چت تعاملی
قلب INJA.ONLINE Builder رابط چت تعاملی‌شه. می‌تونید از AI بخوایید سایت کاملاً جدیدی از صفر بسازه، یا - و اینجاست که واقعاً جالب میشه - می‌تونید روی طراحی فعلی کار کنید. شاید بخوایید رنگ‌بندی رو عوض کنید، یا بخش جدیدی اضافه کنید. فقط تایپ می‌کنید، و AI وب‌سایتی که در سمت چپ می‌بینید رو بهبود میده.
نتیجه‌گیری: از ایده تا واقعیت
INJA.ONLINE Builder نشون میده که با ترکیب صحیح فناوری، اشتیاق و کار تیمی چه معجزاتی ممکنه. در عرض چند ساعت از یه ایده ساده به ابزاری کاربردی تبدیل شد که پتانسیل آینده وب‌سازی رو نشون میده.
تشکر ویژه از همکار فوق‌العاده‌م علیرضا که اون شب تا صبح با من کد زد. و تشکر بزرگ از Cerebras و OpenRouter برای برگزاری هکاتونی که ما رو به چالش کشید و الهام این خلاقیت شد!
لینک‌های مفید
- دمو زنده: builder.inja.online
- مخزن گیت‌هاب: inja-online/cerebras-hacketon-web-builder
- ویدیو نمایش: یوتیوب
حالا نوبت شماست: چه ایده شگفت‌انگیز و جسورانه‌ای رو با این نوع قدرت هوش مصنوعی تولیدی به زندگی می‌آورید؟ نظراتتون رو در کامنت‌ها بگذارید!
این پروژه اثبات می‌کنه که با انگیزه درست، تیم مناسب و فناوری قدرتمند، حتی در محدودیت زمانی شدید هم میشه چیزهای شگفت‌انگیز ساخت. آینده وب‌سازی اینجاست!