Awesome
Next JS x window.ai
This is a simple Next JS application that demonstrates how to integrate window.ai to build a chatbot interface. The app provides a user-friendly chat interface for users to communicate with an AI assistant.
Features
- User-friendly chat interface
- AI assistant powered by window.ai
- Automatically scrolls to the most recent message
- Loading state while waiting for the AI to respond
- Responsive design
Installation
To get started with this app, follow these steps:
- Clone the repository:
git clone https://github.com/YanniKouloumbis/next-js-window-ai/
- Change directory to the project folder:
cd next-js-window-ai
- Install the required dependencies:
pnpm install
- Start the development server:
pnpm dev
- Visit
http://localhost:3000
in your browser to see the app in action.
Usage
- Type a message in the input field at the bottom of the chat window.
- Press "Send" or hit "Enter" to send the message.
- The AI assistant will respond with a message after processing your input.
- Continue the conversation by sending more messages.
Deployment
Customization
You can customize the app by modifying the pages/index.js
file. Here are some ideas for customization:
- Change the initial system message to set a different context for the AI assistant.
- Adjust the streaming options like
temperature
andmaxTokens
to control the AI's response. - Update the UI to match your branding by changing colors, fonts, and other styles.
Contributing
Feel free to contribute to this project by submitting a pull request, reporting bugs, or suggesting new features.
License
This project is licensed under the MIT License. Use it for anything!
Acknowledgments
- The
window.ai
library for providing the AI assistant functionality. - The Next.js framework for simplifying the development of React applications.