Skip to content

RanitManik/CHAT

Repository files navigation

CHAT favicon

CHAT – Connect, Have A Talk

View Demo · Report Bug · Request Feature

GitHub Created At GitHub repo size GitHub Discussions GitHub License GitHub stars GitHub forks
Netlify Status Wakatime

Welcome to CHAT – Connect, Have A Talk, a real-time chat application built with React and Firebase. This application provides an interactive chat experience, leveraging modern technologies to deliver fast and reliable communication.

Table of Contents

Overview

Why This Application?

CHAT is designed to offer a seamless real-time chat experience, making it easier to connect and communicate. Built with React and Firebase, it ensures real-time data synchronization and a smooth user interface, making it ideal for modern communication needs.

Technologies Used

React FirebaseContext TailwindCSS ShadcnUI JavaScript PostCSS ESLint Prettier Figma

Features

  • React: A powerful JavaScript library for building user interfaces.
  • FirebaseContext: A comprehensive app development platform for managing databases, authentication, and hosting.
  • Tailwind CSS: A utility-first CSS framework for rapid UI development.
  • Shadcn/UI: A UI component library for building beautiful interfaces.
  • JavaScript: The programming language that powers the web.
  • PostCSS: A tool for transforming CSS with JavaScript plugins.
  • ESLint: Code linting to maintain consistent code quality.
  • Prettier: Code formatting to ensure a consistent code style.

Getting Started

Prerequisites

  • Node.js (>= 20.0.0)
  • npm (>= 10.0.0) or yarn (>= 1.22.0)

Installation

  1. Clone the repository:

    git clone https://github.com/RanitManik/CHAT.git
    cd CHAT
  2. Install dependencies:

    npm install

    or

    yarn install

Running the Development Server

To start the development server, run:

npm run dev

or

yarn dev

Open your browser and navigate to http://localhost:5173 to see the application in action.

Building for Production

To build the application for production, run:

npm run build

or

yarn build

The built files will be located in the dist directory.

Linting and Formatting

To lint your code, run:

npm run lint

or

yarn lint

To format your code, run:

npm run format

or

yarn format

Project Structure

The project structure is as follows:

CHAT/
├── public/ # Public static assets
├── src/ # Main source code
│   ├── assets/ # Application assets (e.g., images, icons)
│   ├── components/ # Reusable React components
│   │   ├── ui/ # UI components (e.g., buttons, forms)
│   │   └── block/ # Custom reusable components
│   ├── context/ # React contexts for state management
│   ├── hooks/ # Custom React hooks
│   ├── index.css # Global styles
│   ├── App.jsx # Main application component
│   └── main.jsx # Entry point for React application
├── .env.example # Template for environment variables
├── .gitignore # Files and directories to be ignored by Git
├── .prettierrc # Prettier configuration file
├── index.html # HTML template for the app
├── LICENSE # License information
├── package.json # Project dependencies and scripts
├── package-lock.json # Lock file for dependencies
├── postcss.config.js # PostCSS configuration
├── README.md # Project documentation
├── tailwind.config.js # Tailwind CSS configuration
├── tsconfig.json # TypeScript configuration
├── tsconfig.node.json # TypeScript configuration for Node.js
└── vite.config.js # Vite configuration file

Contributing

We welcome contributions to enhance the CHAT application. To contribute:

  1. Fork the repository.

  2. Create a new branch for your feature or bug fix:

    git checkout -b feature-name
  3. Make your changes and commit them with clear and descriptive messages.

  4. Push your changes to your fork:

    git push origin feature-name
  5. Create a pull request to the main repository, detailing the changes and enhancements you have made.

Contact

Social Media Username Link
Email ranitmanik.dev@gmail.com Email
LinkedIn Ranit Manik LinkedIn
Instagram ranit_manik_ Instagram
Facebook RanitKumarManik Facebook

Feel free to reach out if you have questions or just want to chat about web adventures!

Acknowledgments

This project wouldn't be possible without the collaboration and resources of the developer community. Thanks to the community and tools like React and Firebase. Special appreciation goes to friends and family. I hope it inspires further learning.


Thank you for using CHAT! Happy chatting! 🚀