{"id":15684057,"url":"https://github.com/andraxdev/speak-gpt-web","last_synced_at":"2026-03-12T21:03:47.117Z","repository":{"id":231939839,"uuid":"783052136","full_name":"AndraxDev/speak-gpt-web","owner":"AndraxDev","description":"Web version of SpeakGPT created using ReactJS and Google Material Design 3.","archived":false,"fork":false,"pushed_at":"2025-04-17T15:15:20.000Z","size":7833,"stargazers_count":28,"open_issues_count":1,"forks_count":12,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-05-07T15:06:11.713Z","etag":null,"topics":["api","chatbot","chatgpt","chatgpt-client","claude","gemini","gpt","gpt-4","gpt-4o","gpt-vision","jsx","llama","material-design","openai","openai-api","perplexity","react","reactjs"],"latest_commit_sha":null,"homepage":"https://assistant.teslasoft.org","language":"JavaScript","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/AndraxDev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","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,"zenodo":null},"funding":{"buy_me_a_coffee":"andrax_dev","ko_fi":"andrax_dev"}},"created_at":"2024-04-06T20:04:59.000Z","updated_at":"2025-05-07T14:50:21.000Z","dependencies_parsed_at":"2025-04-19T04:40:48.202Z","dependency_job_id":"48749903-5120-4572-9ea1-704c37d3a195","html_url":"https://github.com/AndraxDev/speak-gpt-web","commit_stats":null,"previous_names":["andraxdev/speak-gpt-web"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndraxDev%2Fspeak-gpt-web","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndraxDev%2Fspeak-gpt-web/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndraxDev%2Fspeak-gpt-web/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AndraxDev%2Fspeak-gpt-web/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AndraxDev","download_url":"https://codeload.github.com/AndraxDev/speak-gpt-web/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252902614,"owners_count":21822261,"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":["api","chatbot","chatgpt","chatgpt-client","claude","gemini","gpt","gpt-4","gpt-4o","gpt-vision","jsx","llama","material-design","openai","openai-api","perplexity","react","reactjs"],"created_at":"2024-10-03T17:10:22.642Z","updated_at":"2026-03-12T21:03:47.086Z","avatar_url":"https://github.com/AndraxDev.png","language":"JavaScript","funding_links":["https://buymeacoffee.com/andrax_dev","https://ko-fi.com/andrax_dev","https://ko-fi.com/S6S6X3NCE"],"categories":[],"sub_categories":[],"readme":"# SpeakGPT Web\n\n\u003cimg src=\"https://assistant.teslasoft.org/SPEAKGPT_BANNER_WEB.png\" style=\"width: 100%;\"/\u003e\n\nSpeakGPT is an advanced and highly intuitive open-source AI assistant that utilizes the powerful OpenAI technologies to provide you with unparalleled performance and functionality.\n\nThis is a desktop version of SpeakGPT created using ReactJS and Google Material Design 3.\n\n\u003e [!NOTE]\n\u003e\n\u003e This project is a part of my Bachelor Thesis. Attribution is required to use this work. Copyright (c) 2023-2024 Dmytro Ostapenko. All rights reserved.\n\u003e \n\u003e Cite as: Dmytro Ostapenko (2024), \"Review Program Automation Using Copilot Services\" Bachelor Thesis, Technical University of Košice, 2024.\n\n## Try it out\n\nLaunch SpeakGPT web: [https://assistant.teslasoft.org/](https://assistant.teslasoft.org/)\n\nView SpeakGPT for Android: [https://github.com/AndraxDev/speak-gpt](https://github.com/AndraxDev/speak-gpt).\n\n## Screenshots\n\n\u003cimg src=\"https://gpt.teslasoft.org/d/1.png\" style=\"max-height: 300px\"/\u003e\n\u003cimg src=\"https://gpt.teslasoft.org/d/2.png\" style=\"max-height: 300px\"/\u003e\n\u003cimg src=\"https://gpt.teslasoft.org/d/3.png\" style=\"max-height: 300px\"/\u003e\n\u003cimg src=\"https://gpt.teslasoft.org/d/4.png\" style=\"max-height: 300px\"/\u003e\n\u003cimg src=\"https://gpt.teslasoft.org/d/5.png\" style=\"max-height: 300px\"/\u003e\n\u003cimg src=\"https://gpt.teslasoft.org/d/6.png\" style=\"max-height: 300px\"/\u003e\n\u003cimg src=\"https://gpt.teslasoft.org/d/7.png\" style=\"max-height: 300px\"/\u003e\n\u003cbr/\u003e\n\u003cimg src=\"https://gpt.teslasoft.org/d/8.png\" style=\"max-height: 300px\"/\u003e\n\n## Features\n\n- [x] Chat\n- [x] Images generation (DALL-e)\n- [x] GPT 4 Vision (use your images and photos with ChatGPT)\n- [x] System message\n- [x] Prompts store\n- [x] Quick assistant\n- [x] A lot of different models\n- [x] No captcha\n- [x] Pay as you go system\n- [x] Tips for newbies\n- [x] Custom fine-tuned models are supported\n- [x] Embedded assistant\n- [x] Custom API endpoint\n- [x] Supported models from OpenRouter like LLama, Gemini, Mistral, Perplexity, Claude and more\n- [x] Playground\n- [x] AI Photo editor\n- [x] GPT 4o\n\n## Embedded assistant\n\nYou can embed SpeakGPT into your website or app. Just use the following code:\n\n```html\n\u003cstyle\u003e\n    /* Can be customized depending on your needs */\n    .assistant-embedded {\n        width: 500px;\n        height: calc(100vh - 128px);\n        background-color: rgba(50, 50, 50, 0.4);\n        position: fixed;\n        right: 24px;\n        top: 100px;\n        z-index: 100000;\n        border-radius: 48px;\n    }\n\n    .assistant-iframe {\n        width: 100%;\n        height: 100%;\n        border: none;\n        background-color: transparent;\n    }\n\u003c/style\u003e\n\n...\n\n\u003cdiv class=\"assistant-embedded\" id=\"speakgpt\" style=\"display: none;\"\u003e\n    \u003ciframe src=\"https://assistant.teslasoft.org/embedded\" class=\"assistant-iframe\"\u003e\u003c/iframe\u003e\n\u003c/div\u003e\n\n...\n\n\u003cscript\u003e\n    function switchAssistant() {\n        if (localStorage.getItem(\"assistantOpened\") === \"true\") {\n            document.getElementById(\"speakgpt\").style.display = \"none\";\n            localStorage.setItem(\"assistantOpened\", \"false\")\n        } else {\n            document.getElementById(\"speakgpt\").style.display = \"block\";\n            localStorage.setItem(\"assistantOpened\", \"true\")\n        }\n    }\n\n    function loadAssistant() {\n        if (localStorage.getItem(\"assistantOpened\") === \"true\") {\n            document.getElementById(\"speakgpt\").style.display = \"block\";\n        } else {\n            document.getElementById(\"speakgpt\").style.display = \"none\";\n        }\n    }\n\n    loadAssistant();\n\u003c/script\u003e\n```\n\nReact implementation:\n\n```jsx\nimport React, {useState} from \"react\";\n\nfunction MyComponent() {\n    const [assistantIsOpened, setAssistantIsOpened] = useState(false);\n    \n    return (\n        \u003cdiv\u003e\n            \u003cbutton className={\"btn\"} onClick={() =\u003e {\n                        if (assistantIsOpened) {\n                            setAssistantIsOpened(false);\n                        } else {\n                            setAssistantIsOpened(true);\n                        }\n                    }}\u003e{assistantIsOpened ? \"Close Assistant\" : \"Open Assistant\"}\n                    \u003c/button\u003e\n            \n            {\n                assistantIsOpened ? \u003cdiv className={\"assistant-embedded\"}\u003e\n                    \u003ciframe src={\"https://assistant.teslasoft.org/embedded\"} className={\"assistant-iframe\"} title={\"SpeakGPT\"}/\u003e\n                \u003c/div\u003e : null\n            }\n        \u003c/div\u003e\n    );\n}\n\nexport default MyComponent;\n```\n\n## Customize assistant:\n\nAssistant can be customized with a payload. Payload is a base64-encoded JSON string that contains params.\nPayload goes after /embedded/ in the URL. Example: \n\n```html\n\u003ciframe src=\"https://assistant.teslasoft.org/embedded?payload=eyJuYW1lIjoiRXhhbXBsZSBDaGF0IiwiaW5pdGlhbE1lc3NhZ2UiOiJIZWxsbywgaG93IGFyZSB5b3U%2FIiwiaW5pdGlhbFJlc3BvbnNlIjoiSSdtIGZpbmUsIHRoYW5rIHlvdS4iLCJzeXN0ZW1NZXNzYWdlIjoiVGhpcyBpcyBhbiBleGFtcGxlIGNoYXQuIFBsZWFzZSBiZSBwb2xpdGUuIiwiY2hhdExvY2F0aW9uIjoiZXhhbXBsZUNoYXQifQ%3D%3D\"\u003e\u003c/iframe\u003e\n```\n\nTo make assistant working properly you must URL encode your payload.\n\n```javascript\nlet encodedPayload = encodeURIComponent(btoa(json));\n```\n\nExample of payload:\n\n```json\n{\n  \"name\": \"Example Chat\",\n  \"icon\": \"https://example.com/icon.png\",\n  \"description\": \"This assistant can provide you with relevant responses based on ...\",\n  \"initialMessage\": \"Hello, how are you?\",\n  \"initialResponse\": \"I'm fine, thank you.\",\n  \"systemMessage\": \"This is an example chat. Please be polite.\",\n  \"chatLocation\": \"exampleLocation\"\n}\n```\n- `name` - name that will be displayed on the top of the assistant window\n- `icon` - URL to the icon that will be displayed on the top of the assistant window when conversation is empty\n- `description` - description that will be displayed on the top of the assistant window when conversation is empty. Supports HTML\n- `initialMessage` - a message that will be sent to the assistant when it's loaded\n- `initialResponse` - response of assistant to make conversation work properly\n- `systemMessage` - a message with additional content that are not shown in the chat and appended to the end of the chat history.\n- `chatLocation` - location of the chat in the indexed database, don't use whitespaces or special characters\n\nMore params will be added in the future.\n\n## API key safety:\n\nSpeakGPT uses OpenAI API to provide you with the best experience. Using API-keys is more secure than using your username/password. Your personal info can't be obtained using API key. OpenAI provides cheap API access to their services. Your API key is stored locally on your device and is not shared with anyone. SpeakGPT does not collect any personal data. SpeakGPT is open-source and you can check the code yourself. Each release of SpeakGPT is checked on VirusTotal.\nIf you have any concerns you can secure either [revoke your API key](https://platform.openai.com/account/api-keys) or use a separate API key for SpeakGPT.\n\nTo secure your API key perform the following steps:\n\n1. Make sure you have separate API key for SpeakGPT\n2. Set up billing limit\n3. Enable usage monitoring, so you can see how much resources SpeakGPT uses and how much it costs\n4. If you have any concerns you can revoke your API key\n\n\u003e Why we obfuscate our code in production releases?\n\u003e\n\u003e Obfuscation and resources shrinking allows us to optimize app size, it performance and secure it against reverse engineering or tamper and make sure your credentials like API keys in a safe place. You can request an unobfuscated build or compile it by self to make sure our app is safe.\n\n\n\u003e Developer identity\n\u003e\n\u003e Developer name: Dmytro Ostapenko (AndraxDev)\\\n\u003e Contact: dostapenko82@gmail.com, +421951829517\\\n\u003e Legal address: Južná trieda 4B, 04001 Košice, Slovakia 04001\\\n\u003e Legal entity ID: 55545386\n\n## You are appreciated to:\n\n- Report any bugs\n- Support me :)\n- Request new features. Don't forget to mark issue with a tag\n\n\n## Buy me a coffee:\n\n\u003ca href=\"https://buymeacoffee.com/andrax_dev\"\u003e\u003cimg src=\"https://andrax.dev/bmc_qr.png\" width=\"200\"/\u003e\u003c/a\u003e\n\n[![ko-fi](https://ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/S6S6X3NCE)\n\n## License\n\n```\nCopyright (c) 2023-2024 Dmytro Ostapenko. All rights reserved.\n\nLicensed under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n  http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandraxdev%2Fspeak-gpt-web","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fandraxdev%2Fspeak-gpt-web","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandraxdev%2Fspeak-gpt-web/lists"}