Swingyy is a robust chat application that enables real-time messaging between users. It comes with a range of features including user authentication, friends list management, and message status tracking.
- User Authentication: Sign up, log in, and log out functionalities.
- Friends List: View and manage your list of friends.
- Real-Time Messaging: Send and receive messages instantly.
- Message Status: Mark messages as seen or unseen.
- User Status: Monitor the online/offline status of friends.
- Profile Management: Upload and display your profile picture.
- React
- React Router
- Axios
- Socket.IO Client
- Node.js
- Express.js
- MySQL
- Socket.IO
- Docker
- CSS
- Cloud Build: CI/CD pipeline
- Cloud Run: Serverless deployment
- Cloud SQL: MySQL database
- Firebase: Google Authentication
- Artifact Registry: Docker container registry
- Cloud Storage: File storage
- Docker 🐳
-
Clone the Repository
git clone https://github.com/your-username/Swingyy.git
-
Navigate to Project Directory
cd chat-app
-
Install Dependencies
- Frontend:
cd client npm install
- Backend:
cd Server npm install
- Frontend:
-
Configuration
- Update MySQL connection details in
backend/config/db.js
. - Update Socket.IO server URL in
frontend/src/utils/socket.js
.
- Update MySQL connection details in
-
Start Development Servers
- Backend:
cd client npm start
- Frontend:
cd Server npm start
Open
http://localhost:3000
in your browser. - Backend:
- Sign up or log in.
- You'll be redirected to the chat interface.
- Your friends list appears on the left; click a friend to start chatting.
- Messages are real-time and auto-scroll to the latest.
- Click messages to mark as seen or unseen.
- Log out via the "Logout" button in the top-right corner.
This project is licensed under the MIT License.