Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/diivvuu/slack-clone-nextjs
slack clone nextjs fullstack
https://github.com/diivvuu/slack-clone-nextjs
convex date-fns emoji-mart fullstack-slack jotai nextjs nextjs14 nuqs quill quill-editor react reactjs shadcn-ui slack slack-clone slack-clone-next-js slackclone tailwindcss typescript
Last synced: 6 days ago
JSON representation
slack clone nextjs fullstack
- Host: GitHub
- URL: https://github.com/diivvuu/slack-clone-nextjs
- Owner: Diivvuu
- License: mit
- Created: 2024-09-15T11:24:59.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2024-10-28T19:19:39.000Z (10 days ago)
- Last Synced: 2024-10-28T20:25:08.483Z (9 days ago)
- Topics: convex, date-fns, emoji-mart, fullstack-slack, jotai, nextjs, nextjs14, nuqs, quill, quill-editor, react, reactjs, shadcn-ui, slack, slack-clone, slack-clone-next-js, slackclone, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://slack-clone-nextjs.vercel.app
- Size: 500 KB
- Stars: 2
- Watchers: 1
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# Slack Clone with Next.js & Convex
[deployed link here](https://slack-clone-nextjs.vercel.app/)
This is a fully-functional Slack clone built with Next.js and Convex as the backend database and authentication provider. It allows you to create workspaces, manage channels, direct messages (DMs), react to messages, and much more, just like Slack! You can fork it, contribute to it, or just run it locally and customize it to your needs.
feel free to login with these credentials and explore the functionality
- [email protected] Password123!
- [email protected] Password213!
(these 2 credentials are already in sample workspace and you can create more workspaces, channel, invite more people via joincode, feel free to explore)
## Features
- *Workspaces*: Create multiple workspaces for different teams or projects.
- *Channels*: Add public or private channels inside your workspaces.
- *1:1 Direct Messaging (DMs)*: Send direct messages within the workspace.
- *Threaded Conversations*: Start a thread from any message in a channel or DM.
- *Message Reactions*: React to messages with emojis.
- *Edit & Delete Messages*: Update or remove any message within a channel or DM.
- *Search Functionality*: Search across channels and DMs.
- *User Invitations*: Invite users via a unique code or link.
- *Google & GitHub Authentication*: Seamless signup and login using OAuth from Google or GitHub.
- *Real-time Updates*: Messages and reactions update in real-time without refreshing the page.
## Screenshots
## Getting Started
To run this project locally, follow the steps below.
### Prerequisites
- [Bun](https://bun.sh/) or [Node.js](https://nodejs.org/) installed on your system.
- A [Convex](https://convex.dev/) account to set up a project.
- Google Cloud Console credentials and GitHub OAuth credentials for authentication.
### Setup
1. Clone the repository:
```bash
git clone https://github.com/Diivvuu/slack-clone-nextjs.git
cd slack-clone
2. Install dependencies:
- With bun : bun install / With npm : npm install
- Create a project in Convex.
3. Add your Google and GitHub OAuth credentials to the the environment variables:
-AUTH_GITHUB_ID
-AUTH_GITHUB_SECRET
-AUTH_GOOGLE_ID
-AUTH_GOOGLE_SECRET
-JWKS (convex will take care of this)
-JWT_PRIVATE_KEY (convex will take care of this)
-SITE_URL (convex will take care of this)
4. Start the development server:
Using Bun:
bash
- bun run dev
- bunx convex dev
Using npm:
bash
- npm run dev
- npx convex dev
5. Open your browser and navigate to [http://localhost:3000](http://localhost:3000).
!Happy Coding then!
## Contributing
This project is still under active development, with new features constantly being added! Feel free to fork the repository, submit a pull request, or open an issue if you'd like to contribute or report a bug.