Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/danteterry/talk_fe


https://github.com/danteterry/talk_fe

Last synced: 4 days ago
JSON representation

Awesome Lists containing this project

README

        




react.js
mongodb
tailwindcss
express.js
socket.io

###

Talk

###

Talk is an all-in-one communication platform that connects you with friends, family, and colleagues through chat, voice, and video.

## πŸ“‹ Table of Contents

1. πŸ€– [Introduction](#introduction)
2. βš™οΈ [Tech Stack](#tech-stack)
3. πŸ”‹ [Features](#features)
4. ⚑ [Performance](#performance)
5. 🀸 [Quick Start](#quick-start)
6. πŸš€ [More](#more)

## πŸ€– Introduction

Talk is designed for effortless communication, offering a variety of features that keep you connected wherever you are. From one-on-one chats to group conversations, Talk enables users to engage via instant messaging, voice, and video calls.

Whether you’re sharing files, sending images, video or audio, Talk has you covered. The platform's standout feature is real-time chat translation, making global interactions smoother by translating messages instantly. Alongside a range of additional features like online status updates, typing indicators, friend requests, and notifications, Talk ensures a robust and responsive communication experience.

Talk is your go-to app for maintaining personal and professional connections, bridging the gap between languages, and making every conversation engaging and hassle-free.

## βš™οΈ Tech Stack

- React for dynamic and interactive user interfaces
- Node.js and Express.js for scalable server-side logic and API management
- Socket.IO for real-time, bidirectional communication for chat and notifications
- Simple-Peer for seamless peer-to-peer video and voice calls
- Tailwind CSS for responsive, mobile-first design and styling
- Cloudinary for file and media management (image and video storage)
- NextAuth for secure authentication and user session management

## πŸ”‹ Features

πŸ’¬ **Instant Messaging**: Stay connected with friends and family through one-on-one or group text chats with real-time updates.

πŸ“ž **Voice & Video Calls**: Enjoy high-quality voice and video calls, enabling you to stay in touch across the globe using peer-to-peer technology.

🌍 **Chat Translation**: Break language barriers with real-time message translation, making conversations effortless regardless of the language spoken.

πŸ“ **File Sharing**: Easily send documents, images, and media files to your contacts, stored and optimized with Cloudinary.

πŸ–‹οΈ **Typing Indicator**: Know when your friends are responding with the typing indicator for an interactive experience.

🟒 **Online Status**: Instantly see when your contacts are online or last active, helping you time your communication perfectly.

🀝 **Friend Requests & Management**: Add new friends or send and receive friend requests, manage your connections, and remove friends when necessary.

πŸ‘₯ **Group Chats**: Create and manage group chats to stay connected with multiple people at once, making it ideal for team discussions or socializing.

πŸ”” **Notifications**: Receive push notifications for new Friend requests ensuring you never miss important communication.

πŸ›‘οΈ **Privacy & Security**: End-to-end encryption ensures all your chats and calls are secure, safeguarding your personal conversations.

## 🀸 Quick Start

Follow these steps to set up the project locally on your machine.

**Prerequisites**

Make sure you have the following installed on your machine:

- [Git](https://git-scm.com/)
- [Node.js](https://nodejs.org/en)
- [npm](https://www.npmjs.com/) (Node Package Manager)

**Cloning the Repository**

```bash
git clone https://github.com/DanteTerry/talk_fe.git
cd talk_fe
```

**Installation**

Install the project dependencies using npm:

```bash
npm run dev
```

**Set Up Environment Variables**

Create a new file named `.env` in the root of your project and add the following content:

```env
#VITE
VITE_APP_API_ENDPOINT=

#CLOUDINARY CREDENTIAL
VITE_APP_CLOUD_NAME=
VITE_APP_CLOUD_SECRET=
VITE_APP_CLOUD_API_KEY=

```

Replace the placeholder values with your actual respective account credentials. You can obtain these credentials by signing up on the [Cloudinary](https://cloudinary.com)

**Running the Project**

```bash
npm run dev
```

Open [http://localhost:5173](http://localhost:5173) in your browser to view the project.

##

## Connect with Me

Feel free to reach out if you have any questions, feedback, or just want to chat! You can connect with me via:

- Email: [[email protected]](mailto:[email protected])
- LinkedIn: [Arpit Yadav](https://www.linkedin.com/in/arpityadav0/)
- Twitter: [@Arpit685895](https://twitter.com/Arpit685895)

##

Thank you for visiting