shakirfarhan/realtime-chat

A Real time Messaging App which allows users to create accounts and chat with each other in real-time. The website is developed using MERN stack, which includes MongoDB, Express, React, and Node.js. Socket.IO is used for real-time communication between the users. Redux Toolkit is used for state management, and Tailwind CSS is used for UI

Hi 👋, I'm Shakir Farhan

A passionate Full Stack Developer from India

• 🔭 I’m currently working on A Platform for Developers

• 🌱 I’m currently learning DevOps

• 👯 I’m looking to collaborate on Realtime Chat Application

• 👨‍💻 All of my projects are available at https://shakirfarhan.tech

• 💬 Ask me about MERN Stack,GraphQL, Postgres

• 📫 How to reach me [email protected]

• 📄 Know about my experiences https://drive.google.com/file/d/1B0CqMTfwKW9w1-5UiWfZMs8mX9wPwjJc/view?usp=drive_link

• ⚡ Fun fact I like going out🧳, Sneakerhead👟

Connect with me:

Languages and Tools:

realtime-chat's Issues

how to install

how to install app netlify.com youtube tutorial please

Create group btn not working

Enhance Website Layout to Resemble WhatsApp Web

Overview:

Currently, our website lacks the layout aesthetics seen in WhatsApp Web. To provide a more user-friendly and visually appealing experience, we propose enhancing the website's layout to resemble the design of WhatsApp Web. This involves creating gaps on the four sides of the content area and implementing a colored header section.

Expected Behavior:

Upon implementing this enhancement, users should notice a more modern and familiar layout similar to WhatsApp Web. The content area should be surrounded by empty space on all sides, and the top section should feature a distinct color, just like the header in WhatsApp Web.

Actual Behavior:

At present, our website has a consistent layout throughout its pages, without the distinct design elements seen in WhatsApp Web.

Steps to Reproduce:

1. Open our website in a web browser.
2. Complete Authentication
3. Observe the lack of gaps around the content area and the absence of a colored header.

Screenshot:

Impact:

The current layout might appear outdated compared to the more contemporary design seen on platforms like WhatsApp Web. Implementing this enhancement could result in increased user satisfaction and a more visually appealing website.

Possible Solutions:

1. Introduce CSS modifications to create gaps around the content area.
2. Implement a header section with a distinct color scheme.
3. Ensure responsive design to maintain the layout on various screen sizes.