
A chat app built with React, Material-UI, Socket.io, and NextJS
Next-chat is an innovative chat application that leverages modern technologies such as React, Material-UI, Socket.io, and NextJS. Born out of the need for improved communication tools during the COVID-19 pandemic, this app is designed to provide users with a seamless chatting experience while incorporating fun and interactive features. It’s perfect for anyone looking to stay connected while also enjoying some customization options.
By utilizing a user-friendly interface and efficient backend technologies, Next-chat stands out from other messaging platforms with its unique features that enhance the chatting experience. Whether you’re chatting with friends or collaborating with colleagues, Next-chat aims to make communication as engaging and efficient as possible.
Assigned RoboHash Avatar: Users can have a unique RoboHash avatar generated based on their chosen nickname, adding a personalized touch to their profile.
Nickname Color Customization: Similar to popular platforms like Discord, users can pick a specific color to represent their nickname, making conversations more visually appealing.
Chat Message History: The app saves chat history locally (up to a limit) on the server, so users can revisit previous conversations whenever they wish.
User Notifications: Stay informed with notifications when other users join or leave the chat, helping maintain the flow of conversation.
Typing Indicators: Users are notified when someone is typing with a glowing green dot next to their name, enhancing real-time interaction.
Docker Support: Easy deployment options with Docker support enable smooth operation and scalability of the application.
Local and Production Setup: Users can easily set up the application locally for development or run a production build, making it adaptable for various user needs.

Express.js is a simple Node.js framework for single, multi-page, and hybrid web applications.
Next.js is a React-based web framework that enables server-side rendering, static site generation, and other powerful features for building modern web applications.
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
material-ui adds classes to Tailwind CSS for all common UI components. Classes like btn, card, etc. This allows us to focus on important things instead of making basic elements for every project.
ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.