Upstash এবং Node.js দিয়ে রিয়েল-টাইম আর্টিকেল রিকমেন্ডেশন ইঞ্জিন তৈরি করুন

Upstash Vector Index তৈরি করা

Upstash-এ লগ ইন করে Vector ট্যাবে Create Index ক্লিক করুন। ইন্ডেক্সের নাম দিন (যেমন article) এবং ভেক্টর ডাইমেনশন ১৫৩৬ সেট করুন। Connect সেকশনে .env বাটনে ক্লিক করে কন্টেন্ট কপি করে রাখুন।

প্রজেক্ট সেটআপ

রিপো ক্লোন করুন এবং ডিপেন্ডেন্সি ইনস্টল করুন:

git clone https://github.com/rishi-raj-jain/article-recommendation-system cd article-recommendation-system pnpm install

.env ফাইল তৈরি করুন:

# .env # OpenAI API Key OPENAI_API_KEY="sk-..." # Upstash Vector Keys UPSTASH_VECTOR_REST_URL="https://...-us1-vector.upstash.io" UPSTASH_VECTOR_REST_TOKEN="...="

বিল্ড এবং স্টার্ট করুন:

pnpm run build && pnpm run start

লোকালহোস্ট:৩০০০-এ অ্যাপ দেখুন। নিচে কোডের প্রাসঙ্গিক অংশগুলো ব্যাখ্যা করা হয়েছে।

OpenAI API ক্লায়েন্ট ইনস্ট্যানসিয়েট করা

openai প্যাকেজ দিয়ে OpenAI REST API সহজে কল করা যায়। app/lib/openai/completion.server.ts:

import OpenAI from 'openai' export default new OpenAI({ apiKey: process.env.OPENAI_API_KEY, })

নোট: Remix-এ .server.ts এক্সটেনশন ফাইলকে ক্লায়েন্ট সাইড বান্ডেল থেকে বাদ রাখে।

OpenAI API এমবেডিংস ক্লায়েন্ট তৈরি করা

@langchain/openai প্যাকেজের OpenAIEmbeddings ক্লাস ব্যবহার করে টেক্সটের ভেক্টর এমবেডিং জেনারেট করা যায়। app/lib/openai/embedding.server.ts:

import { OpenAIEmbeddings } from '@langchain/openai' export default new OpenAIEmbeddings({ modelName: 'text-embedding-3-small', openAIApiKey: process.env.OPENAI_API_KEY, })

Upstash Vector ক্লায়েন্ট তৈরি করা

@upstash/vector এবং @langchain/community/vectorstores/upstash ব্যবহার করে Upstash Vector Index-এ কানেকশনলেস ক্লায়েন্ট তৈরি করুন। app/lib/upstash/vectorStore.server.ts:

import embeddings from '~/lib/openai/embedding.server' import { Index as UpstashIndex } from '@upstash/vector' import { UpstashVectorStore } from '@langchain/community/vectorstores/upstash' const index = new UpstashIndex({ url: process.env.UPSTASH_VECTOR_REST_URL as string, token: process.env.UPSTASH_VECTOR_REST_TOKEN as string, }) export default new UpstashVectorStore(embeddings, { index })

Context API এন্ডপয়েন্ট তৈরি করা

Remix অ্যাপ চালালে একাধিক আর্টিকেল URL ইনপুট নেওয়ার টেক্সট বক্স দেখায়। সেগুলো চ্যাটবটের নলেজ বেসে যোগ করা হয়। app/routes/api_.context.tsx এন্ডপয়েন্ট এই URL গুলো গ্রহণ করে কন্টেন্ট ফেচ করে, ভেক্টর এমবেডিং জেনারেট করে Upstash Vector Index-এ সংরক্ষণ করে।

import { Document } from 'langchain/document' import { ActionFunctionArgs } from '@remix-run/node' import vectorServer from '~/lib/vector/vectorStore.server' import { CheerioWebBaseLoader } from 'langchain/document_loaders/web/cheerio' export const action = async ({ request }: ActionFunctionArgs) => { const formData = await request.formData() const articlesToEmbed = formData.get('articles') as string if (articlesToEmbed) { const documents: any[] = [] await Promise.all( articlesToEmbed.split(',').map(async (link) => { const loader = new CheerioWebBaseLoader(link.trim()) const scraper = await loader.scrape() const name = scraper('title').html() const pageContent = scraper.text() const metadata = { link, name } documents.push(new Document({ pageContent, metadata })) }), ) await vectorServer.addDocuments(documents.filter(Boolean)) } }

Remix Action-এ ফর্ম ডেটা পার্স করা হয়। কমা-সেপারেটেড আর্টিকেল লিংকগুলো লুপ করে:

• Cheerio দিয়ে ওয়েবপেজ স্ক্রেপ করে pageContent (টেক্সট কন্টেন্ট) এবং name (টাইটেল) বের করা হয়।
• LangChain Document তৈরি করে মেটাডেটা সহ গ্লোবাল documents অ্যারে-তে পুশ করা হয়।
• শেষে সব ডকুমেন্ট vectorServer.addDocuments দিয়ে Upstash Vector Index-এ ইনসার্ট করা হয় (অন্ডার দ্য হুড এমবেডিং জেনারেট হয়)।

Chat API এন্ডপয়েন্ট তৈরি করা

app/routes/api_.chat.tsx সার্চ ইঞ্জিনের মত রিকমেন্ডেশন সহ রেসপন্স তৈরি করে। ইউজার সার্চের সাথে প্রাসঙ্গিক আর্টিকেল খুঁজে বের করতে টপ-K ভেক্টর সিমিলারিটি সার্চ করা হয়, মেটাডেটা থেকে টাইটেল এবং লিংক OpenAI API-তে কনটেক্সট হিসেবে পাস করা হয়।

সিমিলারিটি সার্চ দিয়ে প্রাসঙ্গিক ভেক্টর এমবেডিং খুঁজে বের করা

import vectorServer from '~/lib/upstash/vectorStore.server' import type { ActionFunctionArgs } from '@remix-run/node' export const action = async ({ request }: ActionFunctionArgs) => { const { messages = [] } = await request.json() const searchQuery = messages[messages.length - 1].content const queryResult = await vectorServer.similaritySearchWithScore(searchQuery, 3) const results = queryResult.filter((i) => i[1] >= 0.7).map((i) => i[0].metadata) // রেসপন্স তৈরি করায় যান }

চ্যাটবটের জন্য সিস্টেম কনটেক্সট এবং ইনস্ট্রাকশন তৈরি করা

প্রাসঙ্গিক ভেক্টর পাওয়ার পর চ্যাটবটকে সেসব আর্টিকেল রেফারেন্স দিয়ে রেসপন্স দিতে বলা হয়। OpenAI-এর gpt-3.5-turbo মডেলে সিস্টেম মেসেজ হিসেবে ইনস্ট্রাকশন দেওয়া হয়:

• Google-এর মত রেসপন্স দাও।
• রেসপন্স ১০০% মার্কডাউন ফরম্যাটে হোক।
• আর্টিকেলের হাইপারলিংক থাকুক।
• শুধু রেফারেন্স না, সাধারণ টেক্সটও যোগ করো।

import { OpenAIStream, StreamingTextResponse } from 'ai' import completionServer from '~/lib/openai/completion.server' export const action = async ({ request }: ActionFunctionArgs) => { // ... const completionResponse = await completionServer.chat.completions.create({ stream: true, model: 'gpt-3.5-turbo', messages: [ { role: 'system', content: `Behave like a Google. You have the knowledge of the following articles: ${JSON.stringify(results)}. Each response should be in 100% markdown compatible format and should have hyperlinks in it. Be precise. Do add some general text in the response related to the query.`, }, ...messages, ], }) const stream = OpenAIStream(completionResponse) return new StreamingTextResponse(stream) }

এভাবে OpenAI থেকে কনটেক্সট-অवेয়ার স্ট্রিমিং রেজাল্ট পাওয়া যায়।

Fly.io-এ ডিপ্লয় করা

রিপোজিটরিতে Fly.io-এর জন্য বিল্ট-ইন কনফিগারেশন আছে: Dockerfile, fly.toml, .dockerignore। Fly.io অ্যাকাউন্ট থাকলে:

fly launch fly deploy

রেফারেন্স

• GitHub Repository
• Upstash Vector Store Integration with LangChain
• System Instructions in OpenAI's Chat Completions API
• Load data from webpages using Cheerio in LangChain
• Creating AI Chat UI in React apps

উপসংহার

এই গাইডে আপনি শিখেছেন কিভাবে ভেক্টর এমবেডিং এবং OpenAI Completion API ব্যবহার করে ডাইনামিক সিস্টেম কনটেক্সটের সাথে আর্টিকেল রিকমেন্ডেশন সিস্টেম তৈরি করা যায়। Upstash Vector এবং LangChain দিয়ে ভেক্টর সংরক্ষণ, টপ-K সার্চ এবং প্রতিটি ইউজার সার্চের জন্য প্রাসঙ্গিক কনটেক্সট তৈরি করা কিছু লাইনের কোডেই সম্ভব।