Nuxt 3 + Bootstrap 5 + OpenAI API

Visit online

Here

Setup

Make sure to install the dependencies:

# npm
npm install

In your .env file, add your OpenAI API key:

OPENAI_API_KEY=sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

And in your nuxt.config.ts file, access the environment variable for the key:

runtimeConfig: {
    // The private keys which are only available server-side
    OPENAI_API_KEY: process.env.OPENAI_API_KEY,
    // Keys within public are also exposed client-side
    public: { }
},

Development Server

Start the development server on http://localhost:3000

npm run dev

Production

Build the application for production:

npm run build

Locally preview production build:

npm run preview

Disclaimer

This is a demo application and is not intended for production use. All instructions are provided by OpenAI.