كيفية استخدام Bolt.new لبناء التطبيقات

Bolt.new هي منصة تطوير تعتمد على الذكاء الاصطناعي تتيح بناء تطبيقات الويب الكاملة باستخدام الأوامر النصية فقط. تدعم المنصة أطر العمل الحديثة مثل React و Vue و Next.js مع إمكانية التحرير المباشر والمعاينة الفورية.

  1. إنشاء حساب والدخول إلى المنصة. انتقل إلى bolt.new وأنشئ حسابًا جديدًا باستخدام بريدك الإلكتروني أو GitHub. بعد تسجيل الدخول، ستظهر لك واجهة التطوير الرئيسية التي تحتوي على محرر الكود ومنطقة الدردشة مع الذكاء الاصطناعي. تأكد من تفعيل حسابك عبر الرسالة المرسلة إلى بريدك الإلكتروني.
  2. وصف التطبيق المطلوب بناؤه. في صندوق الدردشة، اكتب وصفًا مفصلًا للتطبيق الذي تريد بناءه بالعربية أو الإنجليزية. حدد نوع التطبيق والميزات المطلوبة وأسلوب التصميم المفضل. مثال: "أريد بناء تطبيق مدونة شخصية بواجهة حديثة تدعم كتابة المقالات وعرضها مع نظام تعليقات". سيبدأ Bolt.new في إنشاء كود التطبيق تلقائيًا.
  3. مراجعة الكود المُنشأ وتعديله. سيظهر الكود المُنشأ في المحرر على اليسار مع معاينة مباشرة على اليمين. راجع هيكل الملفات والمكونات المُنشأة. إذا كنت تريد تغيير أي شيء، اكتب طلبك في صندوق الدردشة مثل "غير لون الخلفية إلى الأزرق" أو "أضف زر تسجيل دخول في الشريط العلوي". سيقوم النظام بتحديث الكود فوريًا.
  4. إضافة المكتبات والحزم الإضافية. لإضافة مكتبات جديدة، اطلب من Bolt.new إضافتها مباشرة عبر الدردشة. مثلًا: "أضف مكتبة React Router للتنقل بين الصفحات" أو "أضف Tailwind CSS للتصميم". سيقوم النظام بتحديث ملف package.json وتثبيت المكتبات المطلوبة تلقائيًا. يمكنك أيضًا طلب إضافة APIs خارجية أو قواعد بيانات.
  5. اختبار الوظائف والتفاعلات. استخدم المعاينة المباشرة لاختبار جميع وظائف التطبيق. اختبر النقر على الأزرار، ملء النماذج، والتنقل بين الصفحات. إذا واجهت أخطاء أو مشاكل، صفها للذكاء الاصطناعي ليقوم بإصلاحها. افتح أدوات المطور في المتصفح (F12) لمراجعة رسائل الخطأ إن وجدت.
  6. تخصيص التصميم والواجهة. اطلب تعديلات التصميم المحددة مثل تغيير الألوان والخطوط وتخطيط العناصر. يمكنك القول "اجعل التصميم أكثر عصرية" أو "استخدم نظام ألوان داكن". كما يمكنك طلب إضافة أيقونات أو صور أو تحسين تجربة المستخدم. سيقوم Bolt.new بتطبيق التغييرات على CSS والمكونات.
  7. تصدير ونشر التطبيق. انقر على زر "Download" لتحميل ملفات المشروع كاملة بصيغة ZIP. يمكنك أيضًا استخدام خيار "Deploy" للنشر مباشرة على منصات مثل Netlify أو Vercel. إذا كان لديك حساب GitHub متصل، يمكنك دفع الكود إلى مستودع جديد للحفظ والمشاركة. تأكد من اختبار التطبيق بعد النشر للتأكد من عمل جميع الوظائف.

Related

  • كيفية استخدام الذكاء الاصطناعي في تفريغ الاجتماعات صوتياً
  • كيفية استخدام الذكاء الاصطناعي لترجمة الصوت في الوقت الفعلي
  • كيفية إنتاج الصوت بالذكاء الاصطناعي للكتب المسموعة
  • كيفية إنشاء تعليق صوتي بالذكاء الاصطناعي لفيديوهات يوتيوب
  • كيفية استخدام Adobe Podcast AI لتنظيف الصوت
  • كيفية تحرير الملفات الصوتية باستخدام الذكاء الاصطناعي في Descript