Loading...
⚡
💻
🤖
⚙️
📱
🔮
أكاديمية Techbridge
1 / 13
مرحبًا بك في المستقبل
أنشئ تطبيقك الأول مع Techbridge
اليوم تصبح صانعًا 🚀
الفصل 1
ما هو التطبيق؟
التطبيقات تحل المشكلات وتساعد الناس على إنجاز المهام بشكل أسرع.
👤
المستخدم لديه حاجة
→
📱
يفتح التطبيق
→
👆
يتخذ إجراءً
→
✨
يحصل على النتيجة ✨
آلة حاسبة • واتساب • يوتيوب • تيك توك
الفصل 2
ما هو Techbridge؟
أداة ذكاء اصطناعي ذكية تساعدنا على بناء التطبيقات بشكل أسرع.
فكرة 💡
أمر (برومبت) ⌨️
الذكاء الاصطناعي ينشئ 🤖
الإنسان يحسّن 👨🎨
الذكاء الاصطناعي يساعد المبدعين — ولا يستبدلهم.
الفصل 3
استخدام Techbridge كبيئة تطوير متكاملة (IDE)
بيئة التطوير المتكاملة (IDE) هي مساحة عمل حيث يبني المطورون التطبيقات.
يسار: منطقة الأوامر (أخبر الذكاء الاصطناعي بما يجب فعله)
Prompt
> Create a calculator app...
يمين: معاينة مباشرة (شاهد تطبيقك فوراً)
Preview
📱 Live App
قسم الكود (ما أنشأه الذكاء الاصطناعي)
<div class="calc">
<button>1</button>
</div>
<button>1</button>
</div>
الفصل 4
مشروعنا الأول: تطبيق الآلة الحاسبة
سنقوم ببناء آلة حاسبة جميلة وعملية.
- الجمع، الطرح
- الضرب، القسمة
- أزرار تفاعلية متوهجة
0
الفصل 5
كيفية كتابة مطالبة جيدة
يعطي الذكاء الاصطناعي نتائج أفضل عندما تكون تعليماتك واضحة.
❌ مطالبة سيئة:
"إنشاء آلة حاسبة"
✅ مطالبة جيدة:
"Create a modern glassmorphism calculator app with smooth animations, glowing buttons, responsive design, dark mode, and interactive hover effects."
الفصل 6
بناء المطالبة خطوة بخطوة
دعنا نقسم مطالبتنا إلى خطوات بسيطة.
1. ماذا سننشئ؟
→ تطبيق آلة حاسبة
2. ما هو النمط؟
→ تصميم زجاجي عصري
3. ما هي الميزات؟
→ الجمع، الطرح، القسمة، الضرب
4. ما هي الرسوم المتحركة؟
→ توهج، تمرير، ارتداد
5. ما هي الألوان؟
→ أرجواني، أزرق، نيون
الفصل 7
إنشاء التطبيق المباشر
شاهد Techbridge وهو يحول مطالبتك إلى تطبيق حقيقي!
function init() {
const btn = document.createElement('button');
btn.style.color = '#fff';
btn.onclick = calculate;
}
function calculate() {
let x = 10; let y = 20;
return x + y;
}
// generating UI...
0
الفصل 8
فهم ما أنشأه الذكاء الاصطناعي
لا تخف من الكود! دعنا نرى كيف يعمل.
<button onclick="add()">+</button>
<div id="screen">0</div>
if (btn == '+') { add(); }
زر ← ينفذ إجراء
شاشة العرض ← تعرض الإجابة
المنطق ← يتخذ القرارات
Hover or click the code lines to see what they do!
الفصل 9
تخصيص التطبيق
الآن اجعله خاصًا بك! غيّر الألوان والأنماط.
0
جرب الضغط على الأزرار!
الفصل 10
أخطاء المطالبات الشائعة
لماذا تفشل المطالبات الغامضة.
❌ "اجعله رائعًا" ← (ماذا يعني رائع بالنسبة للذكاء الاصطناعي؟)
✅ "اجعله مستقبليًا مع توهجات سماوية"
❌ "أنشئ تطبيقًا" ← (أي نوع من التطبيقات؟)
✅ "أنشئ تطبيق حاسبة بقشيش"
التفاصيل مهمة! الإبداع مهم!
الفصل 11
تحدي الفصل الدراسي 🏆
اكتب مطالبتك، وأنشئ تطبيقك، وقم بتخصيصه!
📝 1. اكتب مطالبة
🤖 2. إنشاء التطبيق
🎨 3. تخصيص النمط
الوقت المتبقي:
05:00
🎉 تهانينا!
لقد بنيت تطبيقك الأول!
كل مطور عظيم بدأ بمشروع واحد.
🏆
شهادة إنجاز
مبتكر تطبيقات بالذكاء الاصطناعي
نجحوا في هندسة تطبيقهم الأول باستخدام الذكاء الاصطناعي!