![]() To do that, we need to bring in JavaScript. The chat area is empty for now because we haven't submitted any messages yet. ![]() If you save the file and check the browser, you should find your page like this: Screenshot of the page To style the page, add the following stylesheet between the opening and closing tags in your /public/index.html file: ![]() Open the file with a text editor and add the following markup in the file: Īs you can see above, the page comprises of the chat area (where the messages are displayed) and the submit area (comprising the text area and the submit button). Then inside the /public directory, create a file named index.html. Start by creating a folder named public inside the root of your project. Next, we'll create the HTML file that renders the chat interface on the web page, as well as the stylesheet file and the JavaScript file. With this code, you've created a web server that serves static files (i.e. Next, open the file with a code editor and add the following code: const express = require('express') Start by creating a file named server.js inside the root folder of your project. We'll implement the chat API towards the end of this article. How to Create an Express Serverįor now, this server will only serve the static files. Next, run the following command to install express and openai libraries from npm: npm i express openai ![]() Once pointed to the directory, run the following command to create a Node project: npm init -y This will generate a package.json file inside the folder Next, launch the command prompt and cd into the folder you just created: cd path/to/project Replace this with the path to your directory Start by creating an empty directory in your computer. The latest version of Node.js comes with npm, and it's available on the official Node.js website. To follow along with this project, you need to have Node.js and npm installed on your local machine. Let's start with the installation and basic setup. With the key safely stored, the next step is to create a Node.js project and spin up an Express server on top of it. On the sidebar, click API Keys and then click the create new secret key button to generate a secret key: Screenshot of secret keyĬopy the secret key and paste it somewhere safe and accessible because you'll need it later to connect your application with the OpenAI API. Once you're in, you'll be redirected back to the homepage.Īt the top right corner of the page, click on your profile image, then click on Manage Account. The first thing you need to do is sign up for an OpenAI account if you don't already have one. Let's dive right in! How to Sign Up for a ChatGPT Account In this article, you'll learn how to create an OpenAI account, retrieve your API keys and query OpenAI's GPT-3 model from your Node.js application. This means that you can send a question to the API, get the response, and use the data in your application, all within seconds. Recently, the OpenAI team expanded their API by giving developers access to their pretrained AI models (DALL-E, Codex, and GPT-3). Even better, you can now integrate the artificial intelligence-powered chat capability of OpenAI's models directly into your application. OpenAI's ChatGPT is a great tool for getting information as quickly as possible for your coding projects.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |