https://github.com/ramzibouzaiene/chat-app
A real-time chat application with a TypeScript-powered Express backend and React Native mobile client, featuring instant messaging using Socket.io.
https://github.com/ramzibouzaiene/chat-app
expressjs mongodb nodejs react-native socket-io typescript
Last synced: 3 months ago
JSON representation
A real-time chat application with a TypeScript-powered Express backend and React Native mobile client, featuring instant messaging using Socket.io.
- Host: GitHub
- URL: https://github.com/ramzibouzaiene/chat-app
- Owner: ramzibouzaiene
- Created: 2025-02-05T15:32:34.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-05T15:34:41.000Z (over 1 year ago)
- Last Synced: 2025-02-05T16:22:41.063Z (over 1 year ago)
- Topics: expressjs, mongodb, nodejs, react-native, socket-io, typescript
- Language: TypeScript
- Homepage:
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Chat App ( In Progress )
The project combines a TypeScript backend for reliable server-side operations with React Native's cross-platform capabilities, using Socket.io for instant bidirectional communication between mobile clients and the server.
## Overview
This is a real-time chat application built using:
- **Backend:** Express.js with TypeScript
- **Frontend:** React Native
- **Real-time Communication:** Socket.IO
## Features
- User authentication (JWT)
- Real-time messaging
- Online/offline status
- Room Chats
## Tech Stack
### Backend:
- Node.js
- Express.js
- TypeScript
- Socket.IO
- MongoDB
### Mobile:
- React Native
- React Navigation
- Socket.IO-client
## Installation
### Backend Setup
1. Clone the repository:
```sh
git clone https://github.com/ramzibouzaiene/chat-app.git
cd chat-app/Back
```
2. Install dependencies:
```sh
npm install
```
3. Create a `.env` file and configure environment variables:
```env
PORT=5000
MONGO_URI=your_database_uri
JWT_SECRET=your_secret
NODE_ENV=your_dev_env
```
4. Start the server:
```sh
npm run dev
```
### Mobile Setup
1. Navigate to the mobile directory:
```sh
cd chat-app/Mobile
```
2. Install dependencies:
```sh
npm install
```
3. Start the React Native app:
```sh
npx react-native start
```
4. Run on emulator or device:
```sh
npx react-native run-android # For Android
npx react-native run-ios # For iOS
```
## WebSocket Events
### Backend Events:
- `connection`: Triggered when a user connects.
- `join`: A user joins a chat room.
- `message`: Sent when a user sends a message.
- `disconnect`: Triggered when a user disconnects.
### Frontend Events:
- `joinChat({ name, roomId })`: Sends a request to join a chat room.
- `sendMessage({ roomId, senderId, username, text })`: Sends a message to the server.
- `receiveMessage(data)`: Receives a message from the server.
- `userTyping(userId)`: Notifies when a user is typing.
## API Endpoints
| Method | Endpoint | Description |
| ------ | -------------------------- | --------------------------------- |
| POST | `/joinChat` | Adds a user to a chat room. |
| POST | `/sendMessage` | Sends a message in a chat room. |
| GET | `/getRoomMessages/:roomId` | Fetches messages from a room. |
| GET | `/getRooms` | Fetches all available chat rooms. |
| POST | `/createRoom` | Creates a new chat room. |