{"id":27156669,"url":"https://github.com/aryamnsls/chatgptclone","last_synced_at":"2026-04-11T10:33:50.813Z","repository":{"id":286798781,"uuid":"962600659","full_name":"Aryamnsls/ChatGptClone","owner":"Aryamnsls","description":"A ChatGPT Clone using GPT-4 Turbo is an AI-powered chatbot application that mimics ChatGPT's conversational abilities. It leverages OpenAI’s GPT-4 Turbo API for generating human-like responses, enabling real-time interaction. The clone includes features like chat history, user authentication, and responsive UI","archived":false,"fork":false,"pushed_at":"2025-04-08T12:06:09.000Z","size":0,"stargazers_count":0,"open_issues_count":4,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-08T12:35:16.752Z","etag":null,"topics":["expressjs","flask","html-css-javascript","mongodb","nodejs","openai","python"],"latest_commit_sha":null,"homepage":"https://react-chatgpt-clone-eight.vercel.app/","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Aryamnsls.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-04-08T11:55:45.000Z","updated_at":"2025-04-08T12:09:28.000Z","dependencies_parsed_at":"2025-04-08T12:47:49.962Z","dependency_job_id":null,"html_url":"https://github.com/Aryamnsls/ChatGptClone","commit_stats":null,"previous_names":["aryamnsls/chatgptclone"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aryamnsls%2FChatGptClone","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aryamnsls%2FChatGptClone/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aryamnsls%2FChatGptClone/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aryamnsls%2FChatGptClone/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Aryamnsls","download_url":"https://codeload.github.com/Aryamnsls/ChatGptClone/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247924105,"owners_count":21019122,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["expressjs","flask","html-css-javascript","mongodb","nodejs","openai","python"],"created_at":"2025-04-08T20:32:02.716Z","updated_at":"2025-12-30T20:21:48.903Z","avatar_url":"https://github.com/Aryamnsls.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"Sure! Here's a **step-by-step guide** to build a **ChatGPT Clone** using 🐍 **Python**, ⚗️ **Flask**, 🌐 **OpenAI**, 🍃 **MongoDB**, and 🧱 **HTML** for the frontend — complete with some beautiful emojis to keep it fun and clear! 🚀\n\n---\n\n### 💡 Step-by-Step Procedure to Build a ChatGPT Clone\n\n---\n\n#### 1️⃣ **Setup Your Project Environment**\n- 📁 Create a folder for your project  \n- ⚙️ Create a virtual environment and activate it:\n```bash\npython -m venv venv\nsource venv/bin/activate  # macOS/Linux\nvenv\\Scripts\\activate     # Windows\n```\n\n---\n\n#### 2️⃣ **Install Required Libraries**\n```bash\npip install flask pymongo dnspython openai python-dotenv\n```\n\n---\n\n#### 3️⃣ **Create Your Project Structure**\n```\nchatgpt_clone/\n│\n├── app.py                  🧠 Main Flask app\n├── templates/\n│   └── index.html          🖼️ Frontend HTML\n├── static/\n│   └── style.css           🎨 CSS Styling\n├── .env                    🔐 Store API Keys\n└── db.py                   🍃 MongoDB Functions\n```\n\n---\n\n#### 4️⃣ **Configure .env File for Security** 🔐\n```dotenv\nOPENAI_API_KEY=your_openai_api_key\nMONGO_URI=your_mongodb_connection_string\n```\n\n---\n\n#### 5️⃣ **Connect to MongoDB (db.py)** 🍃\n```python\nfrom pymongo import MongoClient\nimport os\nfrom dotenv import load_dotenv\n\nload_dotenv()\n\nclient = MongoClient(os.getenv(\"MONGO_URI\"))\ndb = client.chatgpt_clone\nchat_collection = db.chats\n```\n\n---\n\n#### 6️⃣ **Create Flask App (app.py)** ⚗️\n```python\nfrom flask import Flask, render_template, request, jsonify\nfrom dotenv import load_dotenv\nimport openai\nimport os\nfrom db import chat_collection\n\nload_dotenv()\nopenai.api_key = os.getenv(\"OPENAI_API_KEY\")\n\napp = Flask(__name__)\n\n@app.route('/')\ndef index():\n    return render_template('index.html')\n\n@app.route('/ask', methods=['POST'])\ndef ask():\n    user_input = request.json['message']\n\n    response = openai.ChatCompletion.create(\n        model=\"gpt-4-turbo\",\n        messages=[{\"role\": \"user\", \"content\": user_input}]\n    )\n\n    reply = response['choices'][0]['message']['content']\n\n    # Save to MongoDB\n    chat_collection.insert_one({\"user\": user_input, \"bot\": reply})\n\n    return jsonify({'reply': reply})\n\nif __name__ == '__main__':\n    app.run(debug=True)\n```\n\n---\n\n#### 7️⃣ **Design the HTML (templates/index.html)** 🧱\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n\u003chead\u003e\n    \u003ctitle\u003e💬 ChatGPT Clone\u003c/title\u003e\n    \u003clink rel=\"stylesheet\" href=\"/static/style.css\"\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n    \u003ch1\u003e🤖 ChatGPT Clone\u003c/h1\u003e\n    \u003cdiv id=\"chat-box\"\u003e\u003c/div\u003e\n    \u003cinput type=\"text\" id=\"user-input\" placeholder=\"Type your message...\" /\u003e\n    \u003cbutton onclick=\"sendMessage()\"\u003e🚀 Send\u003c/button\u003e\n\n    \u003cscript\u003e\n        async function sendMessage() {\n            const input = document.getElementById(\"user-input\").value;\n            const res = await fetch('/ask', {\n                method: 'POST',\n                headers: {'Content-Type': 'application/json'},\n                body: JSON.stringify({message: input})\n            });\n            const data = await res.json();\n            const chatBox = document.getElementById(\"chat-box\");\n            chatBox.innerHTML += `\u003cp\u003e🧑‍💻 You: ${input}\u003c/p\u003e`;\n            chatBox.innerHTML += `\u003cp\u003e🤖 Bot: ${data.reply}\u003c/p\u003e`;\n        }\n    \u003c/script\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\n---\n\n#### 8️⃣ **Add Styling (static/style.css)** 🎨\n```css\nbody {\n    font-family: 'Segoe UI', sans-serif;\n    background-color: #f4f4f9;\n    text-align: center;\n    padding: 2em;\n}\n\n#chat-box {\n    border: 1px solid #ccc;\n    padding: 1em;\n    margin: 1em auto;\n    width: 60%;\n    height: 300px;\n    overflow-y: scroll;\n    background-color: #fff;\n    border-radius: 10px;\n}\n\ninput {\n    width: 40%;\n    padding: 10px;\n    margin-top: 10px;\n    border-radius: 5px;\n}\n\nbutton {\n    padding: 10px 20px;\n    margin-left: 10px;\n    border-radius: 5px;\n    background-color: #007bff;\n    color: white;\n    cursor: pointer;\n}\n```\n\n---\n\n#### 9️⃣ **Run Your Application** 🏃‍♂️\n```bash\npython app.py\n```\n\nVisit: [http://localhost:5000](http://localhost:5000) 🌐\n\n---\n\n#### 🔟 **(Optional) Enhance Features**\n✨ Add features like:\n- Chat history display from MongoDB\n- User authentication (Login/Signup)\n- Multiple users\n- Admin analytics dashboard 📊\n\n---\n\n### ✅ Done! You’ve built a mini ChatGPT clone!  \nLet me know if you'd like to deploy it on **Render**, **Vercel**, or **Heroku** 🌍 or if you want to add advanced features!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faryamnsls%2Fchatgptclone","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faryamnsls%2Fchatgptclone","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faryamnsls%2Fchatgptclone/lists"}