Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/vikas350/sociopedia--mern-stack-application

A social media application with features like post uploading, liking, and user connections. Utilized React JS for a responsive UI, Redux for state management, and MongoDB for scalable data storage. Backend built with Node JS and Express JS for efficient server-side operations.
https://github.com/vikas350/sociopedia--mern-stack-application

material-ui mongodb nodejs reactjs redux

Last synced: about 6 hours ago
JSON representation

A social media application with features like post uploading, liking, and user connections. Utilized React JS for a responsive UI, Redux for state management, and MongoDB for scalable data storage. Backend built with Node JS and Express JS for efficient server-side operations.

Awesome Lists containing this project

README 

        
# 🌐 Sociopedia

Sociopedia is a social media web application built using the MERN (MongoDB, Express.js, React, Node.js) stack. It allows users to register, create posts, and view profiles of other users. The app provides a platform for social networking and sharing content with friends and the wider community.



## 🛠️ Technologies used:

[![My Skills](https://skillicons.dev/icons?i=react,redux,materialui,nodejs,express,mongodb,vercel)](https://skillicons.dev)

### Front-end:

- React: JavaScript library for building user interfaces. ⚛️

- React Router: Library for handling client-side routing. 🛣️

- Material-UI: UI component library for styling and theming the app. 🎨

- Redux: State management library for managing global app state. 🔄

- Axios: Promise-based HTTP client for making API requests. 🌐

### Back-end:

- Node.js: JavaScript runtime for server-side development. 🖥️

- Express.js: Web application framework for building RESTful APIs. 🌐

- MongoDB: NoSQL database for storing user information, posts, and other data. 📦

- Mongoose: MongoDB object modeling library for interacting with the database. 🍃

- JSON Web Tokens (JWT): Token-based authentication mechanism for securing routes. 🔒

### Other Tools:

- Multer: Middleware for handling file uploads. 📎

- Helmet: Middleware for setting HTTP headers for improved security. 🛡️

- Morgan: HTTP request logging middleware. 📝

- dotenv: Library for loading environment variables from a .env file. 🔑



## Deployment:

- [Vercel Front-End Deployment](https://sociopedia-app.vercel.app)

- [DigitalOcean API Deployment](https://urchin-app-v2nci.ondigitalocean.app)



## MongoDB Schema:

![image](https://github.com/Vikas350/SocioPedia--MERN-Stack-Application/assets/77073202/5ceb8f2a-71dc-4028-8656-32f19eac3742)



## Features ✨

- **User Registration** 📝: Users can create an account by providing their information and uploading a profile picture.

- **User Authentication** 🔒: Secure authentication is implemented using JSON Web Tokens (JWT) to ensure authorized access to protected routes.

- **Post Creation** 📝: Users can create posts with text content and an optional picture upload.

- **User Profiles** 👤: Each user has a profile page where their posts are displayed along with their profile picture and information.

- **Home Feed** 🏠: Authenticated users can view a feed of posts from all users, sorted by the most recent.

- **Responsive Design** 📱: The app is optimized for various screen sizes and devices, allowing users to access Sociopedia from desktops, tablets, and mobile devices.



## Prerequisites 📋

- Node.js (version 12 or above) and npm (Node Package Manager) must be installed on your system.

- MongoDB should be installed and running locally or provide a connection URL to a remote MongoDB instance.