Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/harshitbalodi/chatbot-app
https://github.com/harshitbalodi/chatbot-app
expressjs framer-motion nodejs reactjs
Last synced: about 1 month ago
JSON representation
- Host: GitHub
- URL: https://github.com/harshitbalodi/chatbot-app
- Owner: harshitbalodi
- Created: 2024-08-21T18:36:11.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-08-22T18:50:40.000Z (3 months ago)
- Last Synced: 2024-09-29T00:13:26.646Z (about 2 months ago)
- Topics: expressjs, framer-motion, nodejs, reactjs
- Language: JavaScript
- Homepage: https://chatbot-app-sigma-five.vercel.app
- Size: 185 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ChatBud: Your AI Companion
ChatBud is a full-stack web application designed to provide an interactive chat experience. It serves as an AI companion where users can express their feelings and engage in conversations. The application is built using the Express.js and React.js and leverages Framer Motion for smooth animations.
## Features
- **Dynamic Chat Interface**: Engage in real-time conversations with ChatBud.
- **Gender Selection**: Personalize your chat experience by selecting your gender at the start.
- **Theme Switching**: Toggle between light and dark themes for a personalized look and feel.
- **Sticky Header**: The Chatbot component includes an unmovable header displaying the bot icon and the name "ChatBud."
- **Persistent Chat History**: Chat history remains intact even after collapsing and reopening the chat window.
- **Animated Responses**: Enjoy smooth animations as the bot responds, enhancing the overall user experience.
- **Notification Sound**: Audio cues are provided when new messages are received.
- **Responsive Design**: The application is fully responsive and works seamlessly across different devices.
## Application Overview
### Landing Page
Upon loading the application, users are greeted with a beautiful and responsive landing page that takes up 100% of the viewport height. A sticky header with the ChatBud icon and name is visible at the top of the chat window.
### Chat Interface
- **Gender Selection**: If a gender has not been previously selected, the application prompts the user to select their gender before starting the conversation.
- **Persistent Chat**: Users can collapse and reopen the chat window without losing the conversation history.
- **Real-time Conversations**: Type messages in the input field and send them by pressing Enter or clicking the "Send" button.
- **Thematic Experience**: Switch between light and dark themes using the toggle button located in the top-right corner of the application.
## Result
ChatBud provides a fluid and interactive chatting experience, combining a sleek UI with engaging animations. Whether you're looking for a friendly conversation or just testing the AI's capabilities, ChatBud is designed to make your experience enjoyable and personalized.
