- Node.js 14+ and npm
Run the following command on your local environment:
git clone https://github.com/hadi-16/nextjs-chat-openai.git your-project-name
cd your-project-name
npm install
- Get api key from OpenAI https://beta.openai.com.
- Edit env.example to .env
- Enter api key to .env
- Run the development server :
npm run dev
# or
yarn dev
Open http://localhost:3000 with your browser to see the app.
structure folder app
├── components # Components folder
├── pages # Next JS Pages
├── public # Public assets folder
├── store # Store folder
├── styles # Next JS Style
├── README.md # README file
├── tailwind.config.js # Tailwind CSS configuration
├── .env # Next JS environment variables
- ⚡ Next.js for Fullstack Framework Javascript
- 🤖 Integrate Chatbot API with OpenAI
- 💎 Integrate Styling with Tailwind CSS
- ⚙️ State Management with Zustand
- 🔦 Animation Chats with AutoAnimate
Open https://chat.hadi.pw the url in your browser for the demo application.
Screenshot Chat | Screenshot Chats |
---|---|