Git Product home page Git Product logo

chat-app's Introduction

Supabase Slack Clone πŸš€

Welcome to the Supabase Slack Clone project! This open-source initiative is dedicated to creating a feature-rich chat application inspired by Slack, utilizing Next.js for the frontend and Supabase for the backend. This project is part of the docsplus project, demonstrating integrated solutions and collaborative features.

Why Build Another Chat App?

Our primary aim is to explore and demonstrate the capabilities of Supabase, showcasing the potential of this platform as a backend service. This project serves as a real-world test to evaluate the power of PostgreSQL through Supabase's interface, addressing numerous challenges along the way.

Challenges and Innovations

Throughout the development, we encountered several limitations with Supabase's real-time features. However, these obstacles led us to devise innovative solutions that not only work around these hurdles but also enhance our application's functionality.

Focus on Performance

Performance is a key concern for us. We strive to ensure that our application runs efficiently with minimal server resources. One of the decisions we made to boost performance was to disable Row Level Security (RLS), as it introduced latency in requests. This choice was made to prioritize responsiveness and speed, making our chat application swift and lightweight.

This initiative is an extension of the broader docsplus project, which provides a suite of tools for real-time collaboration and information management. By connecting these projects, we aim to enrich the functionality and demonstrate the seamless integration possible with Supabase and other open-source technologies.

Join us in building the ultimate chat applicationβ€”enhancing communication through collaborative development while pushing the limits of what Supabase can do!

🌟 Features Checklist

Keep track of our progress with this detailed feature checklist:

πŸ” Authentication and User Profile

  • User Authentication
  • Edit Profile

🎨 User Interface

  • βœ… Dark Mode πŸŒ‘, Light Mode πŸŒ•
    • βœ… Save theme preference
  • Responsive Design
    • βœ… Resizable Panels
  • Progressive Web App (PWA)

πŸ”” Notifications

  • Push Notifications
  • Desktop Notifications
  • βœ… Toast Notifications

πŸ“±πŸ’» Platform-Specific Versions

  • Desktop App
  • Mobile App

πŸ’¬ Messaging

  • βœ… Emoji Reactions
  • User Mentions @user
  • Channel Mentions @everyone
  • βœ… Threads (reply in thread)
  • βœ… Pin Messages
  • βœ… Edit Messages
  • βœ… Delete Messages
  • βœ… Reply to Messages
  • βœ… Forward Messages

πŸ› οΈ Advanced Messaging Features

  • βœ… Markdown Support
  • βœ… Code Block Formatting and Syntax Highlighting

πŸŽ₯ Media and Integrations

  • Multimedia (Image, Voice, Video) File Uploads
  • Giphy Integration
  • YouTube Integration
  • Spotify Integration
  • Twitter Integration
  • GitHub Integration

🎀πŸ‘₯ Communication Features

  • Peer to Peer Video Chat
  • Group Video Chat
  • Screen Sharing

πŸš€ User Experience Enhancements

  • βœ… Typing Indicators
  • βœ… Read Receipts
  • βœ… Presence Indicators
  • βœ… Unread Messages
  • βœ… Unread Channels
  • βœ… Unread Threads
  • Unread Mentions
  • Unread Reactions
  • Search
  • βœ… Infinite Scroll
  • Date Grouped Message Indicators

⭐ Suggested Additional Features

  • Voice Messages
  • Custom Emoji Support
  • Link Previews
  • Message Reactions with Custom Emojis
  • Calendar Integration for Event Scheduling
  • Collaboration Tools (e.g., Shared Documents, Whiteboards)

πŸš€ Quick Start Guide

To get started, ensure you have pnpm installed to manage project dependencies.

Setting up the project locally

  1. Clone the repository:

    git clone https://github.com/your-repo/supabase-slack-clone.git
  2. Install dependencies:

    make install
  3. Start the application (backend and frontend):

    make local
  4. Navigate to the application: Open your browser and visit http://localhost:3000.

πŸ›  Makefile Commands

Here are some handy commands provided in the Makefile to help you manage the project easily:

  • make install: Installs all project dependencies.
  • make local: Boots up both the backend and frontend servers.
  • make back-start: Launches the backend server.
  • make back-stop: Halts the backend server.
  • make front-dev: Activates the frontend development server.
  • make supabase-status: Checks the status of the Supabase server.
  • make supabase-reset: Resets the Supabase database to its initial state (with confirmation).
  • make supabase-seed: Seeds the database with initial data for development.

🀝 Contribution

We love community contributions! 🌍 From bug reports to feature suggestions or code contributions, your input is highly valued.

πŸ“„ License

This project is proudly licensed under the MIT License.

πŸ™Œ Acknowledgments

Big shoutout to these fantastic projects and libraries that make our work possible:

Join us in building the ultimate chat applicationβ€”enhancing communication through collaborative development!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.