دمج نماذج اللغة الكبيرة (LLM) في تطبيقات الويب

دمج نماذج اللغة الكبيرة (LLM) في تطبيقات الويب

مقدمة

سيرشدك هذا الدرس خطوة بخطوة إلى إنشاء تطبيق ويب متكامل يدمج نماذج اللغة الكبيرة (LLM). سنستخدم React للواجهة الأمامية وNode.js للواجهة الخلفية، مع واجهة OpenAI البرمجية (API) كخدمة لنماذج اللغة.

بنية التطبيق

هيكل المشروع

llm-web-app/
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   ├── services/
│   │   ├── styles/
│   │   └── App.jsx
│   ├── package.json
│   └── vite.config.js
├── backend/
│   ├── src/
│   │   ├── controllers/
│   │   ├── services/
│   │   ├── routes/
│   │   └── server.js
│   ├── package.json
│   └── .env
└── README.md

الواجهة الخلفية (Node.js/Express)

1. إعداد الخادم

// backend/src/server.js
import express from 'express';
import cors from 'cors';
import dotenv from 'dotenv';
import chatRoutes from './routes/chat.routes.js';

dotenv.config();

const app = express();
const PORT = process.env.PORT || 3000;

app.use(cors());
app.use(express.json());
app.use('/api/chat', chatRoutes);

app.listen(PORT, () => {
  console.log(`Serveur démarré sur le port ${PORT}`);
});