Bolt.new مراجعة: كيف أنقذني ساعات على إعداد التطوير

لا يزال إعداد بيئات التطوير مصدر إزعاج كبير للعديد من المطورين. يمكنك بسهولة فقدان ساعات عديدة في معالجة الإعتماديات وتصحيح مطابقة الإصدارات ومحاولة تشغيل الخوادم قبل كتابة حتى سطر واحد من الكود.

هنا يأتي دور Bolt.new، حيث يمكنك بدلاً من تبديد الوقت في الإعداد، كتابة نص بسيط ومراقبة إنشاء تطبيق كامل (بما في ذلك الحزم المثبتة والخادم قيد التشغيل والمعاينة حية) كل ذلك داخل متصفحك.

في هذا الاستعراض لشركة Bolt.new، سأناقش Points الإيجابية والسلبيات، ما هي Bolt.new، من هو المستهدف، والميزات الرئيسية. ثم سأريك كيف استخدمتها لإنشاء صفحة هبوط لماركة زجاجات ماء صديقة للبيئة.

سأنهي المقال بمقارنة Bolt مع ثلاثة بديلات رئيسية لي (Replit و Windsurf و Cursor). في النهاية، ستعرف إذا كان Bolt هو الأداة المناسبة لسير عملك!

الخلاصة

Bolt.new يسمح لك بتحويل نصوص بسيطة إلى تطبيقات كاملة في دقائق، مع التحرير والمعاينة ودمج GitHub وتنفيذ النقر الواحد في المتصفح. إنه قوي ومتعاون، لكن المشاريع الأكبر يمكن أن تكون مكلفة وتعمل ببطء.

النقاط الإيجابية والسلبيات

• تحويل نصوص بسيطة إلى تطبيقات كاملة في دقائق
• تحرير الكود، استخدام طرفية، تصفح الملفات، ومعاينة مباشرة
• دفع المشاريع مباشرة إلى مزودي الاستضافة مثل Netlify
• التحليل الاصطناعي يكتشف المشاكل ويقترح إصلاحات على الفور
• دعم React و Vue و Next.js و Astro وغيرها
• دمج GitHub و معاينات في الوقت الفعلي للفرق
• بناء التطبيق بالكامل في المتصفح

• تسعير قائم على الرموز قد يصبح مكلفًا للمشاريع الأكبر
• يتطلب تعلم كيفية كتابة نصوص واضحة
• قد يبطئ مع التطبيقات الكبيرة أو المعقدة
• محدود للتعديل المتقدم ل واجهة المستخدم أو الخلفية
• يمكن أن تفقد السياق في عمليات البناء الطويلة
• يتطلب الإنترنت

ما هي Bolt.new؟

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

تم بناء المنصة بواسطة فريق StackBlitz. لقد أخذوا بيئة التطوير القائمة في المتصفح و شحنوها بالذكاء الاصطناعي. وبالتالي، تهدف Bolt.new إلى إعادة تعريف كيفية 접근 المطورين إلى بناء التطبيقات من خلال جعل العملية سريعة وسهلة.

عندما استخدمت Bolt لأول مرة، أدركت أن الذكاء الاصطناعي لم يكن مجرد مولد للكود. كان يقوم بتثبيت الحزم وبدء الخوادم وتصحيح الأخطاء وتنفيذ المنتج النهائي.

Bolt.new vs. منصات التطوير التقليدية

تتطلب معظم منصات التطوير التقليدية منك القيام بكل العمل الشاق. تقوم بتهيئة بيئتك، وتثبيت الإعتماديات، وتكوين أدوات البناء، وتهيئة خطوط التنفيذ. هذا مرهق.

Bolt.new يدمج نماذج الذكاء الاصطناعي مدعومة bởi WebContainers من StackBlitz. جزء WebContainers هو أمر بالغ الأهمية. هذا يعني أنك تحصل على بيئة Node.js كاملة تعمل في متصفحك.

لكن ما يميز Bolt.new حقًا هو أنه يعطي نماذج الذكاء الاصطناعي التحكم الكامل في البيئة بأكملها. هذا يشمل نظام الملفات، وخادم Node، ومدير الحزم، وطرفية المتصفح، وطرفية المتصفح.

في حين أن أدوات الترميز الأخرى المدعومة بالذكاء الاصطناعي مثل Claude أو ChatGPT يمكنها كتابة الكود، إلا أنها لا يمكنها تشغيله أو تصحيحه أو تنفيذه. Bolt يمكنه القيام بكل ذلك.

المجموعة التقنية التي تعمل بشكل فعّال

Bolt.new يعمل مع الإطارات وأدوات JavaScript الأكثر شيوعًا. أي شيء يعمل على StackBlitz سيعمل بشكل سلس على Bolt.new.

يمكنك بناء مشاريع باستخدام React و Vue و Next.js و Svelte و JavaScript. يتعامل مع إطارات CSS مثل Tailwind و Bootstrap و styled-components بسهولة.

إذا كنت تحتاج إلى خلفية، يمكنه تشغيل خادم Express و العمل مع قواعد البيانات من خلال Supabase ودمج معالجة الدفع من خلال Stripe.

تستخدم المنصة نموذج Claude 3.7 Sonnet من Anthropic لأداء البرمجة. هذا يعني أن الكود الذي يتم توليده صلب معظم الوقت.

اللعب اللطيف مع سير عملك الحالي

Bolt لا يعزل. يدمج مع المنصات التالية:

• Figma لتصميم
• Supabase لقواعد البيانات والتحقق من الهوية وتخزين الملفات
• GitHub لمراقبة الإصدار والنسخ الاحتياطي والتعاون
• Expo لتنمية التطبيقات المحمولة
• Stripe لمعالجة الدفع

الدمج مع GitHub هو مغير اللعبة. يمكنك بدء مشروع في Bolt، وصوله إلى حالة جيدة، ثم دفعها إلى GitHub ووضعها في التطوير المحلي للحصول على مزيد من التحكم. أو الحفاظ على المشروع كله في Bolt واستخدام GitHub للنسخ الاحتياطي والتعاون.

ثم هناك استضافة Bolt. يسمح لك بنشر مشروعك إلى عنوان URL مباشر في ثوان، مع مجال .bolt.host مجاني شامل. لكن إذا كنت تريد استخدام نطاقك الخاص أو نشره في مكان آخر، يمكنك بسهولة تصدير مشروعك.

من هو Bolt.new الأفضل له؟

هنا أنواع الأشخاص الذين يحصلون على أكبر استفادة من Bolt.new:

• المطورون يمكنهم استخدام Bolt.new لإنشاء تطبيقات بشكل أسرع مع توليد الكود وتصحيح الأخطاء وتنفيذ النقر الواحد مع القدرة على تخصيص الكود.
• مديرو المنتج والتصميم يمكنهم استخدام Bolt.new لإنشاء نماذج وتطبيقات بدون معرفة الترميز العميقة.
• رواد الأعمال والمسوقون يمكنهم استخدام Bolt.new لإنشاء واختبار أفكار ومواد أولية بقليل من الجهد التقني.
• الفرق والشركات يمكنهم استخدام Bolt.new للتعاون ودمج GitHub وتبسيط التطوير بدون إعداد.
• أي شخص يقوم بإنشاء نماذج يمكنه استخدام Bolt.new لاختبار مفاهيم وتكرار أفكار التطبيق في دقائق بدلاً من أسابيع.

الميزات الرئيسية لشركة Bolt.new

هنا ميزات Bolt.new التي يجب أن تدركها:

• التطوير الكامل في المتصفح: بناء الكود الأمامي والخلفي مباشرة في متصفحك بدون إعداد.
• توليد الكود بواسطة الذكاء الاصطناعي: اكتب ما تريد باللغة الإنجليزية البسيطة، وسيقوم Bolt بإنشاء الكود والهيكل والواجهة لاختبار سريع.
• دعم الإطارات: يعمل مع إطارات شائعة مثل React و Vue و Angular و Nuxt.js و Svelte و Astro.
• الحزم والخلفية: تثبيت حزم npm، وتهيئة منطق الخلفية، و اتصال قواعد البيانات مثل Supabase.
• تحرير الكود: تحرير مشروعك يدويًا مع محرر مدمج وطرفية ومستكشف ملفات.
• تنفيذ النقر الواحد: نشر على الفور مع مزودي الاستضافة مثل Netlify.
• معاينة مباشرة والتعاون: مشاهدة التحديثات في الوقت الفعلي والتعاون بسهولة.
• معالجة الأخطاء: كشف الأخطاء في الكود واقتراح إصلاحات.
• تسعير مرن: مجاني للأفراد، مع خطط مدفوعة للفرق والشركات.

كيفية استخدام Bolt.new

هنا كيف استخدمت Bolt.new لإنشاء صفحة هبوط لماركة زجاجات ماء صديقة للبيئة:

1. إنشاء حساب
2. إضافة نص
3. تحسين النص بواسطة الذكاء الاصطناعي
4. استيراد الملفات من Figma و GitHub
5. إنشاء موقع ويب
6. مشاهدة الكود
7. معاينة مشروعك
8. وصول إلى مكتبة النصوص
9. تحرير بواسطة الذكاء الاصطناعي
10. مشاهدة إعدادات المشروع
11. اتصال التكاملات
12. نشر

الخطوة 1: إنشاء حساب

بدأت bằng الذهاب إلى bolt.new وضغط على “Get Started” في أعلى اليمين. بعد إنشاء حساب، تمكنت من بدء إنشاء تطبيقات ومواقع عن طريق التحدث مع الذكاء الاصطناعي.

الخطوة 2: إضافة نص

أضفت النص التالي إلى الحقل الفارغ:

“إنشاء صفحة هبوط ملونة لماركة زجاجات ماء صديقة للبيئة مع الكثير من الألوان الخضراء والصور الطبيعية وزر إعداد مسبق للطلب.”

الخطوة 3: تحسين النص بواسطة الذكاء الاصطناعي

تحت نصي كان هناك خياران: يمكنني تحميل الملفات أو تحسين النص.

تحميل الملفات يسمح لك بإضافته إلى مشروعك أو استخدامه كمواد مرجعية. عند تحميل ملف، يمكنك وصف كيفية استخدام Bolt له في نصك، أو السماح لشركة Bolt بالتعامل معه تلقائيًا.

لم أكن لدي ملف لتحميله، لكنني أردت تجربة تحسين النص. لقد اخترت هذا الخيار، وتم تحسين نصي على الفور بواسطة Bolt مع الوصف التالي:

“أنت مصمم ويب مكلف بإنشاء صفحة هبوط ملونة ومتوافقة مع البيئة لماركة “AquaVerde” الجديدة لزجاجات الماء المستدامة التي ستُطرح الشهر المقبل.

معلومات عن العلامة التجارية:
AquaVerde تنتج زجاجات ماء معاد تدويرها بنسبة 100%، تستهدف المستهلكين المتعلمين الذين يقدرون الاستدامة والجودة.

متطلبات التصميم:
– لوحة الألوان:
– الأولية: درجات خضراء مختلفة (#2E7D32، #4CAF50، #81C784)
– الثانوية: أرضية (بني، بيز) وأبيض نقي
– التأكيد: أزرق المحيط (#1976D2) للتناقض

العناصر المرئية:
– قسم الهيرو مع صور عالية الجودة للمناظر الطبيعية (الغابات، الجبال، أو مصادر المياه النقية)
– صور للمنتج تظهر الزجاجات في بيئات خارجية طبيعية
– الرموز التي تمثل الاستدامة (رموز إعادة التدوير، أوراق، قطرات ماء)
– خطوط أنيقة ومتوافقة مع الثقة

هيكل المحتوى:
1. الرأس مع الشعار والتنقل
2. قسم الهيرو مع عنوان جذاب عن الاستدامة
3. ميزات المنتج التي تسلط الضوء على المواد الصديقة للبيئة
4. إحصائيات عن الأثر البيئي
5. شهادات العملاء (إن كانت متاحة)
6. قسم الإعداد المسبق مع سعر

دعوة للعمل:
أنشئ زرًا واضحًا “إعداد مسبق – احفظ 25%” في قسم الهيرو وكرره بشكل استراتيجي في جميع أنحاء الصفحة. يجب أن يبرز الزر مع الحفاظ على جمال التصميم الصديق للبيئة.

المواصفات الفنية:
– تصميم متجاوب
– أوقات تحميل سريعة
– متوافق مع إمكانية الوصول
– يشمل تأثيرات Hover و التمرير السلس

قدم وصفًا مفصلًا لترتيب صفحة الهبوط، بما في ذلك وضع عناصر محددة، ونص مقترح للمقاطع الرئيسية، وكيف يعكس التصميم رسالة العلامة التجارية الصديقة للبيئة.

هذا الوصف كان أكثر تفصيلاً من نصي الأصلي.

أوصي بشدة بتحسين نصك في Bolt للحصول على أفضل النتائج. كن محددًا حول الألوان والترتيب والميزات وحتى نبرة النص الوضعي.

هنا قالب يمكنك استخدامه لبدء نصوص Bolt.new:

“ابني [نوع التطبيق] باستخدام [تفضيل الإطار] مع [قائمة الميزات المحددة]. اصنعه مع [تفضيل التصميم]. شمل [أي تكاملات ضرورية]. اجعله [متجاوب / متوافق مع إمكانية الوصول / أخرى].”

يمكنك ثم تحسين هذا النص بواسطة محسن النص.

لا تحاول بناء كل شيء في المرة الأولى. ابدأ ببساطة وكرر. بناء الوظيفة الأساسية أولاً، ثم اطلب تحسينات واحدة تلو الأخرى.

الخطوة 4: استيراد الملفات من Figma و GitHub

من الجدير بالذكر أيضًا أن Bolt يسمح لك بتحميل ملفات Figma و GitHub. هذا يعني أنك يمكنك تحويل إطارات التصميم في Figma إلى تطبيق ويب متفاعل أو صفحة HTML تقريبية تقريبًا.

الخطوة 5: إنشاء موقع ويب

على الفور، بدأ Bolt في إنشاء صفحتي الهبوط._bot على اليسار أظهر عملية Bolt بالكامل. على اليمين كانت معاينة.

بشكل عام، كنت مندهشًا من مدى احترافية مظهر صفحة الهبوط. كانت متوافقة تمامًا مع النص الذي قدمته لها. قامت بتهيئة كل شيء من التصميم إلى الأسلوب تلقائيًا، مما ساعدني على توفير ساعات من الترميز والتصميم اليدوي.

الخطوة 6: مشاهدة الكود

واحدة من أشياءي المفضلة في Bolt.new هي مدى سهولة التنقل بين المعاينة والكود.

الخطوة 7: معاينة مشروعك

يمكنك أيضًا مشاهدة المعاينة بطرق مختلفة (نافذة جديدة، هاتف، وشاشة كاملة) bằngการเลือก الأيقونات المختلفة على اليمين.

الخطوة 8: الوصول إلى مكتبة النصوص

الجزء السفلي من طرفية المتصفح قدم الخيارات التالية:

• تحميل الملفات
• تحسين النص
• تبديل بين وضع المناقشة ووضع البناء
• فتح مكتبة النصوص (أو استخدام “/”)
• بحث مركز المساعدة

مكتبة النصوص لم تكن شيئًا رأيته من قبل في أي من مولدات الكود المدعومة بالذكاء الاصطناعي التي جربتها. سمح لي بحفظ وتنظيم وإعادة استخدام نصوصي المفضلة عبر مشاريع متعددة.

الخطوة 9: تحرير بواسطة الذكاء الاصطناعي

أردت أن يعدل Bolt بالذكاء الاصطناعي، لذلك قدمت طرفية المتصفح النص التالي:

“قم بتحديث تصميم صفحة الهبوط من خلال تعديل لوحة الألوان لاستخدام درجات لطيفة من الأزرق والأخضر لشعور هادئ وصديق للبيئة. تأكد من أن جميع الأزرار والتأكيدات تعكس هذا النظام الجديد للألوان مع الحفاظ على التباين الجيد لسهولة الوصول.”

بعد بضع دقائق، قام Bolt بتطبيق طلبي على صفحة الهبوط. لم يكن يبدو مختلفًا كثيرًا، لكن الألوان كانت لطيفة ومORE ملونة كما طلبت.

الخطوة 10: مشاهدة إعدادات المشروع

في أعلى اليمين كانت إعدادات مشروعي، حيث يمكنني تعديل رؤية المشروع. كان هذا أيضًا المكان الذي يمكنني فيه الاتصال بنطاق، مشاهدة التحليلات، والمزيد.

الخطوة 11: الاتصال بالتكاملات

يمكنني أيضًا إضافة التكاملات، مثل Stripe و Supabase و GitHub.

الخطوة 12: نشر

عندما كنت راضيًا عن كل شيء، قمت بالنقر على “نشر” في أعلى اليمين.

بشكل عام، جعل Bolt.new من بناء صفحة الهبوط عملية سهلة. لقد أخذني من نص بسيط إلى تصميم احترافي في دقائق يمكنني تعديله بواسطة الذكاء الاصطناعي.

أفضل ثلاثة بديلات لشركة Bolt.new

هنا أفضل بديلات Bolt.new التي أوصي بها.

Replit

البديل الأول لشركة Bolt.new الذي أوصي به هو Replit AI. إنه بيئة تطوير سحابية تدعم أكثر من 50 لغة.

يتميز Replit بدعمه الواسع للغات، وتنفيذ المدمج، والتعاون في الوقت الفعلي. يُساعد Ghostwriter AI في الكود وتصحيح الأخطاء، على الرغم من أن لديه سياقًا أقل من Bolt.new.

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

اختر Replit AI للعمل الجماعي، ودعم اللغة المتعددة، ووصول إلى بيئة التطوير السحابية. خلاف ذلك، اختر Bolt.new لإنشاء تطبيقات بسرعة بواسطة الذكاء الاصطناعي.

اقرأ استعراضي لشركة Replit AI أو زور Replit!

Windsurf

البديل الثاني لشركة Bolt.new الذي أوصي به هو Windsurf. إنه مساعد ترميز بالذكاء الاصطناعي يساعد المطورين على كتابة الكود بسهولة، خاصة لتصميم الواجهة.

تسرع كلا المنصتين التطوير، لكن Windsurf يبرز بميزات تمنحه فهمًا أعمق لقاعدة الكود.

في غضون ذلك، Bolt.new رائع لتحويل الأفكار إلى تطبيقات ويب تعمل بسرعة. يعمل في المتصفح، يدعم React و Next.js، ويتعامل مع الإعداد وتصحيح الأخطاء وتنفيذ التطبيق تلقائيًا.

إذا كنت تريد المزيد من التحكم وأدوات الترميز المتقدمة، اختر Windsurf. لبدء مشروع بسرعة بواسطة الذكاء الاصطناعي، اختر Bolt.new.

اقرأ استعراضي لشركة Windsurf أو زور Windsurf!

Cursor

البديل الثالث والأخير لشركة Bolt.new الذي أوصي به هو Cursor AI. إنه محرر كود يسهل الترميز بتمام المعاني، وترميز متعدد الملفات، وفهم واضح للمشروع كله. إنه رائع للمطورين الذين يعملون على مشاريع كبيرة ويتطلبون مساعدة دقيقة وذكية وادوات تصحيح الأخطاء.

في المقابل، يركز Bolt.new على توليد تطبيقات الويب الكاملة بسرعة. يمكنك بناء وتشغيل تطبيقات بسرعة بدون كتابة الكود يدويًا. يتعامل الذكاء الاصطناعي مع الحزم وتصحيح الأخطاء وتنفيذ التطبيق.

لإنشاء تطبيقات سريعة وتنفيذها، اختر Bolt.new. لمشاريع أكبر تحتاج إلى فهم sâuوق للكود وادوات تصحيح الأخطاء، اختر Cursor AI.

اقرأ استعراضي لشركة Cursor AI أو زور Cursor!

استعراض Bolt.new: الأداة المناسبة لك؟

بعد استخدام Bolt.new، يمكنني القول بصدق إنها تشعر أقل بمثابة أداة ترميز وأكثر بمثابة شريك إبداعي. مشاهدة إنشاء موقع مباشر من مجرد نص كان مثل السحر.

لكن مع ذلك، Bolt لا يحاول استبدال كل أداة ترميز. إنه أفضل عندما تريد اختبار أفكار وترك الذكاء الاصطناعي يتعامل مع الأجزاء الصعبة من التطوير. بالنسبة لي، هذا هو بالضبط ما كنت أحتاجه.

لكن إذا كنت تتساءل عن كيفية مقارنة Bolt بالمنصات الأخرى، ها هي تحليلتي:

• Replit هو الأفضل لأولئك الذين يريدون بيئة تطوير سحابية بدعم لغات متعددة والتعاون.
• Windsurf هو الأفضل لأولئك الذين يريدون المزيد من التحكم بأدوات الترميز المتقدمة.
• Cursor هو الأفضل لأولئك الذين يعملون على مشاريع أكبر وأكثر تعقيدًا ويتطلبون فهمًا عميقًا للكود والسياق.

شكرًا لقراءة استعراضي لشركة Bolt.new! آمل أن يكون مفيدًا.
Bolt.new يقدم خطة مجانية مع حد 150 ألف رمز يومي. جربها بنفسك وشاهد كيف تحبها!

الأسئلة الشائعة

هل Bolt New مجاني؟

نعم، Bolt New يقدم خطة مجانية مع حد 150 ألف رمز يومي و 1 مليون رمز شهري. Bolt.new يساعد المطورين على اختبار أفكار بسرعة من خلال السماح للذكاء الاصطناعي بالتعامل مع الأجزاء الأكثر تعقيدًا من التطوير.

من هو الرئيس التنفيذي لشركة Bolt New؟

الرئيس التنفيذي لشركة Bolt.new هو Eric Simons.

هل اشتراك Bolt New يستحق العناء؟

اشتراك Bolt.new يستحق العناء إذا كنت تبني نماذج أو تطبيقات كاملة بانتظام. ومع ذلك، قد لا يكون الخيار الأفضل إذا كنت تريد فقط اقتراحات كودية أساسية أو تفضل العمل محليًا. هذا لأن تسعيره القائم على الرموز يمكن أن يصبح مكلفًا للمشاريع الأكبر.

هل Bolt New أفضل من Cursor؟

Bolt.new هو أفضل لاختبار الأفكار بسرعة واختبارها، حيث يسمح للذكاء الاصطناعي بالتعامل مع الأجزاء الأكثر تعقيدًا من التطوير. ومع ذلك، Cursor AI هو أفضل للمطورين الخبراء الذين يعملون على مشاريع كبيرة ويتطلبون فهمًا أعمق للكود وادوات تصحيح الأخطاء.

ما هي حدود Bolt New؟

Bolt.new’s حدود تشمل توسيع المشاريع الكبيرة، حيث قد يصبح بطيئًا. إنه أفضل لاختبار النماذج بدلاً من التطوير الكامل.