المشروع الأول: كيف تبني أول تطبيق يعتمد على الذكاء الاصطناعي؟

سلسلة: مشاريع الذكاء الاصطناعي التطبيقية • من الفكرة إلى التطبيق



📘 المشروع الأول: كيف تبني أول تطبيق يعتمد على الذكاء الاصطناعي؟

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

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

أنت الآن في: المشروع 1 من سلسلة مشاريع الذكاء الاصطناعي التطبيقية

🎯 ماذا سنبني في هذا المشروع؟

سنقوم ببناء تطبيق بسيط باسم:

AI Text Summarizer

وظيفته سهلة وواضحة:

  • يكتب المستخدم نصًا طويلًا.
  • يضغط على زر التلخيص.
  • يرسل التطبيق النص إلى نموذج ذكاء اصطناعي.
  • يعيد النموذج ملخصًا قصيرًا.
  • يعرض التطبيق النتيجة للمستخدم.

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

🧠 كيف يعمل التطبيق؟

يمكن تبسيط الفكرة إلى أربع مراحل:

المستخدم ← التطبيق ← نموذج الذكاء الاصطناعي ← النتيجة

المستخدم لا يتصل مباشرة بالنموذج. التطبيق هو الوسيط الذي يستقبل البيانات، يرسلها إلى النموذج، ثم يعرض النتيجة.

🔧 الأدوات التي نحتاجها

  • Python لكتابة البرنامج.
  • Streamlit لبناء واجهة التطبيق.
  • OpenAI API للوصول إلى نموذج الذكاء الاصطناعي.
  • VS Code أو أي محرر أكواد.
إذا كنت قد تابعت دروس Python السابقة في المدونة، فأنت تملك أساسًا جيدًا للبدء بهذا المشروع.

📁 الخطوة الأولى: إنشاء مجلد المشروع

أنشئ مجلدًا جديدًا باسم:

ai_text_summarizer

ثم افتحه باستخدام VS Code، وأنشئ داخله ملفًا جديدًا باسم:

app.py

هذا الملف سيكون الملف الرئيسي للتطبيق.

📦 الخطوة الثانية: تثبيت المكتبات

افتح Terminal داخل VS Code واكتب:

pip install streamlit openai

نحن نستخدم:

  • streamlit لإنشاء واجهة المستخدم.
  • openai لإرسال الطلبات إلى نموذج الذكاء الاصطناعي.

🖥️ الخطوة الثالثة: إنشاء واجهة التطبيق

لنبدأ بواجهة بسيطة قبل ربط الذكاء الاصطناعي.

import streamlit as st

st.title("AI Text Summarizer")

text = st.text_area("Enter your text")

if st.button("Summarize"):
    st.write("Your summary will appear here")

هذا الكود ينشئ:

  • عنوانًا للتطبيق.
  • مربعًا لإدخال النص.
  • زرًا للتلخيص.

▶️ تشغيل التطبيق لأول مرة

لتشغيل التطبيق اكتب:

streamlit run app.py

سيفتح التطبيق في المتصفح تلقائيًا.

إذا ظهر عنوان التطبيق ومربع النص والزر، فهذا يعني أن الواجهة تعمل بنجاح.

🔑 الخطوة الرابعة: مفتاح API

حتى يستطيع التطبيق التواصل مع نموذج الذكاء الاصطناعي، نحتاج إلى مفتاح API.

مهم: لا تضع مفتاح API داخل مقال منشور، ولا ترفعه في مشروع عام على GitHub. احفظه في متغير بيئي أو نظام أسرار مخصص.

🤖 الخطوة الخامسة: ربط التطبيق بالذكاء الاصطناعي

الآن نصل إلى أهم جزء في المشروع.

import streamlit as st
from openai import OpenAI

client = OpenAI()

st.title("AI Text Summarizer")

text = st.text_area(
    "Enter the text you want to summarize",
    height=250
)

if st.button("Summarize"):

    if text.strip():

        response = client.responses.create(
            model="gpt-5.6-luna",
            input=f"""
            Summarize the following text clearly and concisely:

            {text}
            """
        )

        st.subheader("Summary")
        st.write(response.output_text)

    else:
        st.warning("Please enter some text first.")

🔍 شرح الكود خطوة بخطوة

1️⃣ استيراد المكتبات

import streamlit as st
from openai import OpenAI

السطر الأول يستدعي Streamlit، بينما السطر الثاني يستدعي مكتبة OpenAI.

2️⃣ إنشاء عميل OpenAI

client = OpenAI()

هذا السطر ينشئ الاتصال الذي سنستخدمه لإرسال الطلبات إلى النموذج.

3️⃣ إنشاء مربع النص

text = st.text_area(
    "Enter the text you want to summarize",
    height=250
)

يتيح هذا للمستخدم كتابة أو لصق نص طويل داخل التطبيق.

4️⃣ إنشاء زر التلخيص

if st.button("Summarize"):

لن يتم إرسال الطلب إلى النموذج إلا بعد ضغط المستخدم على الزر.

5️⃣ التحقق من النص

if text.strip():

بهذا نمنع التطبيق من إرسال طلب فارغ.

6️⃣ إرسال الطلب إلى نموذج الذكاء الاصطناعي

response = client.responses.create(
    model="gpt-5.6-luna",
    input=f"""
    Summarize the following text clearly and concisely:

    {text}
    """
)

هنا يرسل التطبيق النص إلى النموذج مع تعليمات واضحة للتلخيص.

7️⃣ عرض النتيجة

st.write(response.output_text)

بعد وصول الإجابة، يتم عرض الملخص داخل واجهة التطبيق.

🧪 تجربة التطبيق

جرّب لصق فقرة طويلة واضغط على:

Summarize

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

✨ تحسين التطبيق: اختيار طول الملخص

summary_length = st.selectbox(
    "Choose summary length",
    ["Short", "Medium", "Detailed"]
)

ثم نضيف الاختيار إلى التعليمات:

prompt = f"""
Summarize the following text.

Summary length: {summary_length}

{text}
"""

🌍 تحسين آخر: اختيار لغة الملخص

language = st.selectbox(
    "Choose summary language",
    ["Arabic", "English", "French", "Spanish"]
)

ثم نستخدمها داخل الطلب:

prompt = f"""
Summarize the following text clearly.

Write the summary in: {language}

{text}
"""

🚀 النسخة المحسنة من التطبيق

import streamlit as st
from openai import OpenAI

client = OpenAI()

st.set_page_config(
    page_title="AI Text Summarizer",
    page_icon="🤖"
)

st.title("🤖 AI Text Summarizer")

st.write(
    "Paste your text below and let AI create a clear summary."
)

text = st.text_area(
    "Your text",
    height=250
)

summary_length = st.selectbox(
    "Summary length",
    ["Short", "Medium", "Detailed"]
)

language = st.selectbox(
    "Summary language",
    ["Arabic", "English", "French", "Spanish"]
)

if st.button("Summarize"):

    if text.strip():

        with st.spinner("Generating summary..."):

            prompt = f"""
            Summarize the following text clearly.

            Summary length: {summary_length}
            Output language: {language}

            Text:
            {text}
            """

            response = client.responses.create(
                model="gpt-5.6-luna",
                input=prompt
            )

            st.subheader("Summary")
            st.write(response.output_text)

    else:
        st.warning("Please enter some text first.")

⚠️ أخطاء شائعة

1. مفتاح API غير صحيح:
إذا كان المفتاح غير صالح، فلن يستطيع التطبيق الاتصال بالخدمة.
2. كتابة المفتاح داخل الكود:
لا تفعل ذلك إذا كان المشروع عامًا أو منشورًا على GitHub.
3. الثقة الكاملة في النتيجة:
الذكاء الاصطناعي قد يعطي أحيانًا إجابة غير دقيقة، لذلك يجب مراجعة النتائج في التطبيقات المهمة.
4. تجاهل تكلفة API:
راقب الاستهلاك إذا أصبح التطبيق يستخدم عددًا كبيرًا من الطلبات.

💡 أفكار لمشاريع أخرى

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

❓ هل يجب أن أتعلم Machine Learning أولًا؟

لا. إذا كان هدفك هو استخدام نموذج جاهز داخل تطبيق، يمكنك البدء باستخدام API.

أما إذا أردت تدريب نموذج خاص بك من الصفر، فستحتاج لاحقًا إلى تعلم:

  • Machine Learning
  • Deep Learning
  • Neural Networks
  • Data Processing
  • Model Training

✅ ماذا تعلمنا؟

  • إنشاء واجهة باستخدام Streamlit.
  • استقبال نص من المستخدم.
  • ربط Python بخدمة ذكاء اصطناعي.
  • إرسال Prompt إلى النموذج.
  • استقبال النتيجة وعرضها.
  • إضافة خيارات مثل اللغة وطول الملخص.
الفكرة الأساسية التي تعلمناها اليوم هي: واجهة + Python + API + نموذج ذكاء اصطناعي

📝 تمرين لك

حاول تعديل التطبيق بحيث يختار المستخدم نوع النتيجة:

  • ملخص عادي.
  • ملخص في نقاط.
  • ملخص مبسط للمبتدئين.

إذا استطعت تنفيذ ذلك، فأنت بدأت فعليًا في فهم طريقة بناء تطبيقات الذكاء الاصطناعي.

📌 الخلاصة

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

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

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

المشروع القادم:

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

← المشروع السابق | العودة للأعلى ↑ | المشروع الثاني →

تعليقات

المشاركات الشائعة من هذه المدونة

مخاطر تحميل التطبيقات الخبيثة وكيف تحمي بياناتك؟

الدرس 17: التعلم الموجّه (Supervised Learning) – كيف تتعلم النماذج باستخدام بيانات مُعلّمة؟

الدرس السادس : شرح Functions في Python بأسلوب مبسط مع أمثلة عملية