Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rohanmathur91/evolt-social
Myspace is a social media web app for people to connect with each other. Users can share pictures with others, upload, like, comment, and bookmark the posts. Follow each other and be connected.
https://github.com/rohanmathur91/evolt-social
es6 frontend react-router-v6 reatctjs redux-toolkit tailwindcss
Last synced: about 1 month ago
JSON representation
Myspace is a social media web app for people to connect with each other. Users can share pictures with others, upload, like, comment, and bookmark the posts. Follow each other and be connected.
- Host: GitHub
- URL: https://github.com/rohanmathur91/evolt-social
- Owner: rohanmathur91
- Created: 2022-04-20T07:51:58.000Z (over 2 years ago)
- Default Branch: dev
- Last Pushed: 2023-05-12T05:00:47.000Z (over 1 year ago)
- Last Synced: 2023-05-12T06:20:22.696Z (over 1 year ago)
- Topics: es6, frontend, react-router-v6, reatctjs, redux-toolkit, tailwindcss
- Language: JavaScript
- Homepage: https://evolt-myspace.netlify.app
- Size: 964 KB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# myspaceπ
A social media web app.
[![Netlify Status](https://api.netlify.com/api/v1/badges/2c93609e-b9bb-43cf-8333-646d70b91310/deploy-status)](https://app.netlify.com/sites/evolt-myspace/deploys)
![chrome-capture-2022-4-18](https://user-images.githubusercontent.com/61556757/168996081-669617f1-1f8a-4357-b866-aa61913add91.gif)
## Table of Contents
- [Getting Started](#getting-started)
- [Live link](#live-link)
- [About](#about)
- [Technologies used](#-technologies-used)
- [Features](#features)
- [Screenshots](#screenshots)
- [Connect with me](#-connect-with-me)## Getting Started
- Clone the repository on your local machine with the command below in your terminal, and cd into the **evolt-social** folder
```sh
https://github.com/rohanmathur91/evolt-social.gitcd evolt-social
```- Install dependencies (if you are using **yarn** then do with that)
```sh
npm install
```- Create a `.env` file at the root level of the directory (at the level of `package.json`) and create a environment variables
```
REACT_APP_TEST_USERNAME = rohanmathur
REACT_APP_TEST_PASSWORD = rohanmathur@123
REACT_APP_JWT_SECRET =
REACT_APP_CLOUD_NAME =
REACT_APP_UPLOAD_PRESET_NAME =
```- Start the serverπ
```
npm start
```## Live link
https://evolt-myspace.netlify.app
## About
- myspace is a social media web app for people to connect with each other.
- Users can share pictures with others, upload, like, comment, and bookmark the posts. Follow each other and be connected.## π Technologies used
- ReactJS
- Redux Toolkit
- React Router
- Tailwind
- [Mockbee](https://mockbee.netlify.app/) for backend## Features
**User/Home Feed**:
- User will able to see all his posts and post of the people he/she follow.
- Feed can be sort based on `recent` and `trending` posts.
- User/Home and Explore feed has `infinite scroll`.**Explore Feed**
- All the new users posts will be shown over here.
**Search**
- User can search other users and follow them if not followed.
- Implemented `debounce` for search.**Post**
- User can `add`, `like/unlike` `edit`, `delete`, and `bookmark` a post.
- Each post can be viewed on single page where user can comment and can edit or delete the comment.
- Post can consist of text, image or gifs.**Profile**
- User can view there profile or any other users profile.
- Each user can edit there profile.
- From someones profile logged in user can follow there following or follower users.**Authentication**
- myspace has login, signup and logout feature.
- A new user can also login using test credentials.
- For Signup, form validation is done for all the fields.**Dark mode**
- Has light and dark mode.
## Screenshots
![mobile (5)](https://user-images.githubusercontent.com/61556757/168998787-5b5d988c-3d17-4ad2-b321-876db9b74c38.png)
![mobile (6)](https://user-images.githubusercontent.com/61556757/168999027-797a8116-9488-4e87-b02d-665723c3a212.png)
![mobile (8)](https://user-images.githubusercontent.com/61556757/168999297-ff45b571-afdd-4360-ad73-05ac18a541db.png)
![image](https://user-images.githubusercontent.com/61556757/168998000-63f28ed4-6ac8-47cd-a0e4-338f433378b6.png)## π¨βπ» Connect with me