A modern real-time chat application built with a powerful tech stack that enables seamless communication with features like instant messaging, image sharing, and emoji support.
- Real-time Messaging: Instant message delivery using Socket.io
- Image Sharing: Upload and share images in conversations with Cloudinary integration
- Emoji Support: Express yourself with a rich emoji picker
- User Authentication: Secure JWT-based authentication system
- Responsive Design: Seamless experience across all devices
- User Profiles: Customizable profiles with avatars
- Message Status: Online status indicators
- Image Preview: Preview images before sending
- Message History: Persistent chat history
- Auto Scroll: Automatically scroll to latest messages
- React.js: UI library for building user interfaces
- Tailwind CSS: Utility-first CSS framework for styling
- Zustand: State management solution
- Socket.io-client: Real-time client-server communication
- Emoji-picker-react: Emoji selection interface
- Lucide React: Modern icon library
- Node.js: Runtime environment
- Express.js: Web application framework
- MongoDB: NoSQL database for data storage
- Mongoose: MongoDB object modeling
- Socket.io: Real-time bidirectional communication
- JWT: User authentication and authorization
- Cloudinary: Cloud-based image management
node >= 14.0.0
npm >= 6.0.0- Clone the repository
git clone https://github.com/basitabdullah/linux-chat
cd linux-chat- Install dependencies for both server and client
npm run build- Set up environment variables
# Backend (.env)
PORT=5001
MONGODB_URI=your_mongodb_uri
JWT_SECRET=your_jwt_secret
CLOUD_NAME=your_cloudinary_cloud_name
CLOUD_API_KEY=your_cloudinary_api_key
CLOUD_API_SECRET=your_cloudinary_api_secret- Start the Application
# To start the application:
npm start- Start the development servers
# Start frontend (from client directory)
npm run dev
# Start backend (from server directory)
npm run devLinux/
├── client/
│ ├── src/
│ │ ├── components/
| | ├── constants/
│ │ ├── lib/
│ │ ├── pages/
│ │ ├── store/
│ │ ├── App.jsx
│ │ ├── index.css
│ │ └── main.jsx
│ ├── public/
│ ├── index.html
│ ├── package-lock.json
│ ├── package.json
│ ├── postcss.config.js
│ ├── tailwind.config.js
│ └── vite.config.js
└── server/
├── controllers/
├── lib/
├── middleware/
├── models/
├── routes/
├── seeds/
├── index.js
├── package-lock.json
└── package.json
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Fahim Abdullah - basitabdullah1122@gmail.com
Project Link: https://github.com/basitabdullah/linux-chat
Made By Fahim Abdullah 🧑💻