Чатбот Төслийн Тайлан
Мэдээллийн технологи
Мандах Амарболд, 21b1num0606
1. Оршил
Энэхүү тайлангаар төслийн хүрээнд өөрийн хийж гүйцэтгэсэн ажлуудыг нэгтгэн
дүгнэсэн болно. Төслийн хүрээнд React ашиглан чатбот веб aпп бүтээсэн бөгөөд
MongoDB -д суурилсан өгөгдлийн сангийн интеграцчилал, туршилтыг
гүйцэтгэсэн. Төслийн явцад frontend, backend, мөн өгөгдлийн сангийн шийдлийг
амжилттай хэрэгжүүлсэн.
2. Төслийн Зорилго
1. React болон стандарт CSS ашиглан динамик, хариу үйлдэлтэй хэрэглэгчийн
интерфейс (UI) хөгжүүлэх;
2. Node.js, Express ашиглан RESTful API үүсгэх.
3. MongoDB өгөгдлийн санг ашиглан chat history (conversation history)
хадгалах; локаль болон cloud (MongoDB Atlas) орчин дээр хоёр өөр
хэлбэрээр туршиж хэрэгжүүлэх.
4. Дата дамжуулал болон интеграцчилалын найдвартай байдлыг хангах.
3. Технологийн Суурь
● Frontend: React, JavaScript, HTML5, CSS3
● Backend: Node.js, Express
● Өгөгдлийн Сан: MongoDB (local), MongoDB Atlas (cloud)
● Лайбрери: Axios (HTTP хүсэлт), Mongoose (ODM)
● Бусад: CORS, dotenv
4. Архитектурын Тойм
[Browser] <--> [React UI (ChatBox, Navbar, Hero, ...)]
<--> [Express API]
<--> [MongoDB: locally & Atlas]
● Хэрэглэгчийн үйлдэл React компонентээр дамжин API руу POST/GET хүсэлт
илгээж, өгөгдлийг хадгалж, сэргээж үзүүлнэ.
5. Хэрэгжүүлэлт
5.1. Frontend
● ChatBox.js компонент: Хэрэглэгчийн мессеж унших, серверт илгээх, хариуг
харуулах.
● Axios ашиглалт: GET /api/conversations болон POST /api/conversations
дуудлагаар өгөгдлийг авч, илгээнэ.
● CSS загвар: Стандарт .css файлуудыг ашиглан загварчилсан; (responsive)
5.2. Backend
● server.js: Express сервер, JSON parsing, CORS тохиргоо, орчны хувьсагчийг
(.env) унших.
● Conversation модель: Mongoose schema, талбарууд: userMessage,
botResponse, timestamp.
● Routes:
○ POST /api/conversations: Хэрэглэгч болон ботын мессежийг MongoDB
-д хадгална.
○ GET /api/conversations: Бүх орж ирсэн мессежүүдийг буцаана.
5.3. Өгөгдлийн Сангийн Интеграцчилал
● Local MongoDB: mongod daemon ажиллуулж,
mongodb://localhost:27017/chatbot_db холболтоор туршсан.
● MongoDB Atlas: Cloud орчинд cluster үүсгэж, connection string–г .env
файлд дамжуулсан. Хоёр орчинд ижил схемийн дагуу өгөгдөл амжилттай
солигдон хадгалах боломжийг баталгаажуулсан.
6. Туршилт ба үр дүн
● Интеграцын туршилт: Хэрэглэгчийн мессеж бичиж "Илгээх" товч дарахад
өгөгдөл database -д (local, Atlas) хадгалагдаж, мөн өгөгдлийг авсан.
Backend (server.js):
8. Ирээдүйн Ажлууд
1. AI интеграцчилал: OpenAI эсвэл өөр AI модель ашиглан бодит хариу
үүсгэх.
2. UI сайжруулалт: Мессежийн урсгал дүрслэх, анимейшн нэмэх.
9. Дүгнэлт
Энэхүү төсөл React UI, Express API, MongoDB өгөгдлийн сангийн архитектурыг
амжилттай нэгтгэн, locally болон MongoDB Atlas (cloud) орчинд туршиж,
тогтвортой ажиллах боломжийг баталлаа. Цаашид AI api холбох, хэрэглэгчийн
менежмент, мөн бусад шийдлүүдийг хэрэгжүүлэхэд бэлэн болсон.
Тайлан бэлтгэсэн: Мандах Амарболд
Огноо: 2025-05-07