Menu Close

React social media application that allows users to interact

React social media application that allows users to interact

CHATTER[Work in progress]

Welcome to Chatter, a social media application that allows users to connect and interact with each other in real-time.

Support the project

If you feel awesome and want to support us in a small way, please consider checking out our other projects, starring and sharing this repo! This helps us getting known and grow the community. 🙏

Table of Contents


Chatter is a social media application that allows users to interact with one another by posting, commenting, and liking posts. The application was created by Femi-Ladiran Erifeoluwa (also known as Timi) and Oghenebrume Akpadaka (also known as Brume).
Our goal with Chatter is to provide a platform for users to connect with one another and share their thoughts, ideas, and experiences. The user-friendly interface and sleek design make it easy for users to navigate and engage with the community.

User Story

As a user, I want to be able to share my thoughts, ideas, and experiences with other users in real-time.
I want to be able to post, comment, and interact with other users in a safe and secure environment.
I also want to have access to a wide range of features and tools that will help me connect and engage with other users more effectively.

Technologies Used

  • MongoDB: A powerful and flexible NoSQL database that allows Chatter to store and retrieve data efficiently and quickly.
  • Mongoose ODM: A powerful Object Data Modeling (ODM) library that simplifies interactions between MongoDB and the Chatter application.
  • Express: A lightweight framework for building web applications and APIs that allows Chatter to handle HTTP requests and responses.
  • Node: A powerful runtime environment that allows Chatter to run JavaScript code on the server-side.
  • React: A powerful JavaScript library for building user interfaces that allows Chatter to provide a dynamic and responsive user experience.
  • Material-UI: A popular UI library that provides a wide range of Material Design components for building beautiful and responsive user interfaces.


  • Login and Signup: Users can create an account and log in to the application with their username and password.
  • Profile: Users can view and edit their profile information, including their name, email, and bio.
  • Home: The home page allows users to view and interact with other users’ posts, including commenting, liking, and sharing.
  • Search: Users can search for other users by name or username, allowing them to connect and interact with people they know.

Security Measures

Chatter has implemented a number of security measures to ensure that users’ data is kept safe and secure. These measures include:

  • CORS (Cross-Origin Resource Sharing): A security mechanism that allows Chatter to restrict access to its APIs based on the origin of the request.
  • Helmet: A library that sets various HTTP headers to help protect against common security threats.


Chatter is currently deployed on Heroku and can be accessed at the following link:


  • Login Page:

The login page allows users to enter their username and password to access the application.

  • Signup Page:

The signup page allows users to create an account that they can use to interact with other users.

  • HomePage

The home page allows users to see their friend’s posts and interact with the post by liking and so on

  • ProfilePage

The profile page allows users to see another user’s profile. This includes their posts, follower count and many more.


For additional questions contact me via email on or view some other projects.

View Source Code
Posted in React