Build Your First AI Chatbot with JavaScript

Why Use JavaScript for AI Chatbots

JavaScript is a core language for web development and works well with server-side tools like Node.js. Using JavaScript, you can build an AI chatbot that runs on your computer or on a server without needing to learn complex frameworks. The official OpenAI JavaScript SDK lets you quickly send text prompts to AI models like GPT‑3.5 or GPT‑4 and receive smart replies, making it a great choice for beginners.

Prerequisites You Need

• Node.js (LTS version) installed on your computer
• Basic knowledge of using terminal or command line
• An OpenAI account and valid API key
• A code editor (for example, Visual Studio Code)

If you need help with any of these steps, first complete our guide on installing Python and environment basics. (Although the guide uses Python, the concepts of command line and API key handling apply to JavaScript too.)

Install the OpenAI JavaScript SDK and dotenv

Open your terminal in your project folder and run:

npm install openai dotenv

This installs:

• openai: the official SDK to interact with OpenAI models
• dotenv: a tool to keep your API key safe using environment files

Securely Store Your API Key

Create a file called .env in your project folder and add:

OPENAI_API_KEY=your-secret-key-here

In your JavaScript file (e.g., `index.js`), load it like this:

require('dotenv').config();
const OpenAI = require('openai');

const client = new OpenAI({
  apiKey: process.env.OPENAI_API_KEY,
});

This ensures your API key never appears directly in your source code.

How Tokens Work and Affect Cost

Each prompt you send and the AI’s reply uses tokens, small units of text. Generally, one token is about four English characters. For example, “Hello world!” ≈ 3 tokens. Both prompt and response tokens are billed at model-specific rates. Models like GPT‑3.5 are more cost-efficient for beginners, while GPT‑4 offers higher quality but costs more.

Send Your First Prompt and Get a Response

In `index.js`, use this function:

async function chatOnce(userMessage) {
  try {
    const response = await client.chat.completions.create({
      model: 'gpt-3.5-turbo',
      messages: [
        { role: 'system', content: 'You are a helpful assistant.' },
        { role: 'user', content: userMessage },
      ],
    });
    return response.choices[0].message.content;
  } catch (error) {
    return `Error: ${error.message}`;
  }
}

This sends a prompt and returns the assistant’s text. Errors are caught and returned as readable messages instead of crashing the script.

Interactive Chatbot Loop for Terminal

Extend the above into a loop so you can chat continuously:

const readline = require('readline');

async function runChat() {
  const rl = readline.createInterface({
    input: process.stdin,
    output: process.stdout,
  });

  console.log("Type 'exit' to quit.");
  rl.prompt();

  for await (const line of rl) {
    const userInput = line.trim();
    if (userInput.toLowerCase() === 'exit') {
      console.log('Goodbye!');
      break;
    }
    const reply = await chatOnce(userInput);
    console.log('Bot:', reply);
    rl.prompt();
  }

  rl.close();
}

runChat();

Now you can chat with your AI assistant directly in the terminal until you type “exit”.

Expecting What the Response Structure Looks Like

The SDK returns a structured JSON object similar to:

{
  choices: [
    {
      message: {
        role: 'assistant',
        content: 'Hello! How can I help you today?'
      }
    }
  ]
}

You access the text via `response.choices[0].message.content`. This is the message the assistant generated.

Troubleshoot Common Errors

• Module not found: Run npm install openai dotenv again if missing.
• AuthenticationError: Make sure your `.env` file exists and the API key is correct.
• InvalidRequestError: The model name might be wrong—use `gpt-3.5-turbo` to start.
• RateLimitError: You are sending requests too quickly—pause or increase capacity.
• NetworkError: Your internet connection may have dropped—check connectivity.

Next Steps After Your First Chatbot

After verifying the chatbot works, consider adding new features:

• Store message history in an array to give your chatbot context
• Explore prompt engineering to improve AI responses
• Build a web interface to run your chatbot from a browser
• Try fine‑tuning or document-based RAG to create more customized assistants

Key Takeaways

• JavaScript and Node.js make building an AI chatbot accessible for beginners without much setup.
• Use the official SDK and dotenv to keep your API key secure and manage requests easily.
• Understand basic token billing and error handling to build reliable AI-powered tools.

FAQs

Can I use this chatbot in a browser instead of the terminal?

Yes. You can connect this code to a web server (e.g. Express) and expose an API endpoint. Then use HTML and JavaScript on the frontend to send prompts and display responses.

Are GPT‑4 models available via JavaScript too?

Yes. You can change the model field to a version like `gpt-4` if your API account has access. Expect higher model performance but also higher cost.

How do I inspect the full API response?

Use `console.log(response)` or `console.dir(response, { depth: null })` to see all fields returned by the API—useful for debugging and learning.

Keep Reading

• Prompt Engineering for Beginners – Learn how to write better prompts for clearer answers.
• Deploy Your AI Chatbot on the Web – Host your JavaScript chatbot so others can use it online.
• Fine‑Tune an OpenAI Model with Your Data – Teach your chatbot your style using example prompts.
• How to Build a RAG‑Powered Chatbot – Let your assistant search through your documents for answers.
• Python vs JavaScript for OpenAI API – Compare both languages to choose what’s best for you.