Skip to content

sksabbirhossain/chat-app

Repository files navigation

CHAT APP

Chat App Next.js v15 Tailwind CSS v4 License

A modern real-time chat application built with Next.js v15, Socket.IO, and Tailwind CSS.
It allows users to register, log in, and chat in real-time with online/offline status and conversation updates.

🌐 Live Demo

🚀 Features

✅ Real-time messaging with Socket.IO
✅ User authentication (signup & login)
✅ Online/offline user status
✅ Message read indicators
✅ Responsive design (mobile & desktop)
✅ Clean UI with Tailwind CSS
✅ Powered by Next.js 15 (App Router)

🏗️ Tech Stack

  • Frontend Framework: Next.js v15
  • UI Styling: Tailwind CSS
  • Real-time Engine: Socket.IO client
  • State Management: React hooks & Context API
  • Backend: Express.js (Hosted on Render)
  • Database: MongoDB Atlas

⚙️ Getting Started

1. Clone the repository

git clone https://github.com/sksabbirhossain/chat-app.git
cd chat-app-frontend

2. Install dependencies

yarn install

3. Create a .env file in root

cp .env.example .env

(Replace with your actual key value. follow .env.example)

4. Run the development server

npm run dev

Your app will be live at: 👉 http://localhost:3000

🧩 Folder Structure

chat-app/
├── actions              # common convention for organizing Server Actions
├── app/                 # Next.js App Router pages
├── components/          # UI components (Chat, Message, etc.)
├── configs/             # Global configarations (Auth, Socket, etc.)
├── contexts/            # Global React contexts
├── public/              # Static assets
└── utils/               # Helper functions

Usage

  • Visit the deployed website or run the development server (as described in the installation instructions) to access the application.

Contributing

If you have any suggestions on how to improve this Application, please open an issue, share your ideas, and create a pull request. Or read this CONTRIBUTING file.

License

This project is licensed under the terms outlined in the LICENSE file.

Summary of Terms:

  • Viewing and Studying: You are free to view, study, and learn from the source code and documentation.
  • Contributing: Contributions to this project are welcome. Please adhere to the contribution guidelines provided in the CONTRIBUTING.md file.
  • Restrictions:
    • Personal Use: This project cannot be used for personal purposes outside the scope of this open-source project.
    • Commercial Use: You are not allowed to sell, distribute, or incorporate any part of this project into other commercial products or services.

Violation of License Terms: If any part of this project is copied, used, or distributed in violation of these terms, legal action may be taken to enforce these license terms.

By using this project, you agree to abide by these terms. For more details, please refer to the full LICENSE.md file.

Code of Conduct

We adhere to the Contributor Covenant Code of Conduct to ensure a positive and inclusive environment for all participants in our community. Please review the full Code of Conduct for details on our standards and enforcement guidelines.

For more details, visit the Code of Conduct file.

👤 Connect with Me

Portfolio LinkedIn Facebook Instagram GitHub

About

A chat application built with Next.js and Tailwind CSS for frontend, and NextAuth.js for authentication.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published