Last active
March 1, 2023 20:14
-
-
Save jefftriplett/0cd568dd904cbf83083bed209a917a3a to your computer and use it in GitHub Desktop.
ChatGPT API using their OpenAI Python library to generate a TailwindCSS template
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| # https://platform.openai.com/docs/guides/chat/chat-vs-completions | |
| # | |
| # python -m pip install openai | |
| # | |
| import openai | |
| completion = openai.ChatCompletion.create( | |
| model="gpt-3.5-turbo", | |
| messages=[ | |
| { | |
| "role": "user", | |
| "content": "Create a starter HTML template using TailwindCSS that has a header, a footer, a nav, and main body.", | |
| } | |
| ], | |
| ) | |
| print(completion) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "choices": [ | |
| { | |
| "finish_reason": "stop", | |
| "index": 0, | |
| "message": { | |
| "content": "\n\n<!DOCTYPE html>\n<html lang=\"en\">\n\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">\n <title>My Template</title>\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/tailwindcss/dist/tailwind.min.css\">\n</head>\n\n<body class=\"flex flex-col h-screen\">\n <header class=\"bg-gray-800 text-white py-4\">\n <div class=\"container mx-auto flex justify-between items-center px-4\">\n <a href=\"#\" class=\"text-xl font-bold\">Logo</a>\n <nav class=\"space-x-4\">\n <a href=\"#\" class=\"hover:text-gray-600\">Home</a>\n <a href=\"#\" class=\"hover:text-gray-600\">About</a>\n <a href=\"#\" class=\"hover:text-gray-600\">Contact</a>\n </nav>\n </div>\n </header>\n <main class=\"flex-1 container mx-auto px-4 py-8\">\n <h1 class=\"text-4xl font-bold mb-4\">Welcome to my website!</h1>\n <p class=\"text-lg leading-relaxed mb-4\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer egestas, nisl id vestibulum tristique, sapien turpis euismod lacus, ac consequat velit augue eu felis.</p>\n <p class=\"text-lg leading-relaxed mb-4\">Morbi iaculis gravida ipsum id placerat. Sed massa magna, tincidunt non arcu eu, convallis ornare dolor.</p>\n <p class=\"text-lg leading-relaxed mb-8\">Aliquam non lacinia nisl. Nullam venenatis orci ac ante scelerisque, ac ultricies lacus ullamcorper. Vivamus at fringilla risus, vel scelerisque orci. </p>\n </main>\n <footer class=\"bg-gray-800 text-white py-4\">\n <div class=\"container mx-auto px-4\">\n <p class=\"text-center\">© 2021 My Template. All rights reserved.</p>\n </div>\n </footer>\n</body>\n\n</html>", | |
| "role": "assistant" | |
| } | |
| } | |
| ], | |
| "created": 1677696714, | |
| "id": "chatcmpl-**PULLED**", | |
| "model": "gpt-3.5-turbo-0301", | |
| "object": "chat.completion", | |
| "usage": { | |
| "completion_tokens": 502, | |
| "prompt_tokens": 31, | |
| "total_tokens": 533 | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment