# च्याट प्रोजेक्ट यो च्याट प्रोजेक्टले GitHub Models प्रयोग गरेर च्याट सहायक कसरी निर्माण गर्ने भनेर देखाउँछ। तपाईंको अन्तिम प्रोजेक्ट यस्तो देखिन्छ:  थप सन्दर्भको लागि, जेनेरेटिभ AI प्रयोग गरेर च्याट सहायक निर्माण गर्नु AI सिक्न सुरु गर्नको लागि उत्कृष्ट तरिका हो। यस पाठको क्रममा तपाईंले जेनेरेटिभ AI लाई वेब एपमा कसरी एकीकृत गर्ने भनेर सिक्नुहुनेछ। सुरु गरौं। ## जेनेरेटिभ AIसँग जडान गर्नुहोस् ब्याकएन्डको लागि, हामी GitHub Models प्रयोग गर्दैछौं। यो एक उत्कृष्ट सेवा हो जसले तपाईंलाई निःशुल्क AI प्रयोग गर्न सक्षम बनाउँछ। यसको प्लेग्राउन्डमा जानुहोस् र तपाईंको छनोट गरिएको ब्याकएन्ड भाषासँग मेल खाने कोड प्राप्त गर्नुहोस्। यो [GitHub Models Playground](https://github.com/marketplace/models/azure-openai/gpt-4o-mini/playground) मा यस्तो देखिन्छ।  जसरी भनिएको थियो, "Code" ट्याब र तपाईंको छनोट गरिएको रनटाइम चयन गर्नुहोस्।  ### Python प्रयोग गर्दै यस अवस्थामा हामी Python चयन गर्छौं, जसको अर्थ हामी यो कोड लिन्छौं: ```python """Run this model in Python > pip install openai """ import os from openai import OpenAI # To authenticate with the model you will need to generate a personal access token (PAT) in your GitHub settings. # Create your PAT token by following instructions here: https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/managing-your-personal-access-tokens client = OpenAI( base_url="https://models.github.ai/inference", api_key=os.environ["GITHUB_TOKEN"], ) response = client.chat.completions.create( messages=[ { "role": "system", "content": "", }, { "role": "user", "content": "What is the capital of France?", } ], model="openai/gpt-4o-mini", temperature=1, max_tokens=4096, top_p=1 ) print(response.choices[0].message.content) ``` यो कोडलाई थोरै सफा गरौं ताकि यो पुन: प्रयोग गर्न सकियोस्: ```python def call_llm(prompt: str, system_message: str): response = client.chat.completions.create( messages=[ { "role": "system", "content": system_message, }, { "role": "user", "content": prompt, } ], model="openai/gpt-4o-mini", temperature=1, max_tokens=4096, top_p=1 ) return response.choices[0].message.content ``` यो `call_llm` फङ्क्सनको साथमा हामी अब एक प्रम्प्ट र सिस्टम प्रम्प्ट लिन सक्छौं र फङ्क्सनले नतिजा फर्काउँछ। ### AI सहायकलाई अनुकूलित गर्नुहोस् यदि तपाईं AI सहायकलाई अनुकूलित गर्न चाहनुहुन्छ भने तपाईंले सिस्टम प्रम्प्टलाई यसरी भरिदिन सक्नुहुन्छ: ```python call_llm("Tell me about you", "You're Albert Einstein, you only know of things in the time you were alive") ``` ## यसलाई वेब API मार्फत सार्वजनिक गर्नुहोस् उत्कृष्ट, हामीले AI भाग पूरा गर्यौं, अब हामी यसलाई वेब API मा कसरी एकीकृत गर्न सकिन्छ हेर्नुहोस्। वेब API को लागि, हामी Flask प्रयोग गर्दैछौं, तर कुनै पनि वेब फ्रेमवर्क राम्रो हुनुपर्छ। यसको कोड हेर्नुहोस्: ### Python प्रयोग गर्दै ```python # api.py from flask import Flask, request, jsonify from llm import call_llm from flask_cors import CORS app = Flask(__name__) CORS(app) # * example.com @app.route("/", methods=["GET"]) def index(): return "Welcome to this API. Call POST /hello with 'message': 'my message' as JSON payload" @app.route("/hello", methods=["POST"]) def hello(): # get message from request body { "message": "do this taks for me" } data = request.get_json() message = data.get("message", "") response = call_llm(message, "You are a helpful assistant.") return jsonify({ "response": response }) if __name__ == "__main__": app.run(host="0.0.0.0", port=5000) ``` यहाँ, हामी एक फ्लास्क API सिर्जना गर्छौं र "/" र "/chat" नामक डिफल्ट रुट परिभाषित गर्छौं। पछिल्लो हाम्रो फ्रन्टएन्डले प्रश्नहरू पठाउन प्रयोग गर्नको लागि हो। *llm.py* लाई एकीकृत गर्नको लागि हामीले निम्न गर्नुपर्छ: - `call_llm` फङ्क्सन आयात गर्नुहोस्: ```python from llm import call_llm from flask import Flask, request ``` - "/chat" रुटबाट यसलाई कल गर्नुहोस्: ```python @app.route("/hello", methods=["POST"]) def hello(): # get message from request body { "message": "do this taks for me" } data = request.get_json() message = data.get("message", "") response = call_llm(message, "You are a helpful assistant.") return jsonify({ "response": response }) ``` यहाँ हामी आउने अनुरोधलाई JSON बडीबाट `message` प्रोपर्टी पुन: प्राप्त गर्नको लागि पार्स गर्छौं। त्यसपछि हामी यस कलको साथ LLM कल गर्छौं: ```python response = call_llm(message, "You are a helpful assistant") # return the response as JSON return jsonify({ "response": response }) ``` उत्कृष्ट, अब हामीले आवश्यक काम गर्यौं। ## Cors कन्फिगर गर्नुहोस् हामीले Cors, क्रस-ओरिजिन रिसोर्स सेयरिङ जस्तो केही सेटअप गरेको कुरा उल्लेख गर्नुपर्छ। यसको मतलब हाम्रो ब्याकएन्ड र फ्रन्टएन्ड फरक पोर्टमा चल्ने भएकाले, हामीले फ्रन्टएन्डलाई ब्याकएन्डमा कल गर्न अनुमति दिनुपर्छ। ### Python प्रयोग गर्दै *api.py* मा एउटा कोडको टुक्रा छ जसले यसलाई सेटअप गर्छ: ```python from flask_cors import CORS app = Flask(__name__) CORS(app) # * example.com ``` अहिले यो "*" लाई अनुमति दिन सेटअप गरिएको छ जुन सबै ओरिजिन हो र यो अलि असुरक्षित छ, हामीले यसलाई उत्पादनमा जाँदा सीमित गर्नुपर्छ। ## आफ्नो प्रोजेक्ट चलाउनुहोस् आफ्नो प्रोजेक्ट चलाउनको लागि, तपाईंले पहिले आफ्नो ब्याकएन्ड सुरु गर्नुपर्छ र त्यसपछि आफ्नो फ्रन्टएन्ड। ### Python प्रयोग गर्दै ठिक छ, हामीसँग *llm.py* र *api.py* छ, हामी यसलाई ब्याकएन्डसँग कसरी काम गर्न सक्दछौं? खैर, दुई कुरा गर्नुपर्छ: - निर्भरता स्थापना गर्नुहोस्: ```sh cd backend python -m venv venv source ./venv/bin/activate pip install openai flask flask-cors openai ``` - API सुरु गर्नुहोस् ```sh python api.py ``` यदि तपाईं Codespaces मा हुनुहुन्छ भने तपाईंले सम्पादकको तलको भागमा पोर्टमा जानुहोस्, त्यसमा राइट-क्लिक गर्नुहोस् र "Port Visibility" क्लिक गर्नुहोस् र "Public" चयन गर्नुहोस्। ### फ्रन्टएन्डमा काम गर्नुहोस् अब हामीसँग API चलिरहेको छ, हामी यसको लागि फ्रन्टएन्ड सिर्जना गरौं। एक न्यूनतम फ्रन्टएन्ड जसलाई हामी चरणबद्ध रूपमा सुधार गर्नेछौं। *frontend* फोल्डरमा निम्न सिर्जना गर्नुहोस्: ```text backend/ frontend/ index.html app.js styles.css ``` सुरु गरौं **index.html** बाट: ```html

Send