Build a social network with ReactJS, Spring Boot and MongoDB

I have developed a small social network web app for educational purpose and want to share this with the community. This app is built with ReactJS for frontend, Java Spring Boot for backend and MongoDB as the database.

The app tries to mimic a few fu…


This content originally appeared on DEV Community and was authored by Linh Truong Cong Hong

I have developed a small social network web app for educational purpose and want to share this with the community. This app is built with ReactJS for frontend, Java Spring Boot for backend and MongoDB as the database.

Image description

The app tries to mimic a few functions of Twitter, including:

  • Create post with text and image
  • The number of characters in each post is limited to 200 characters
  • Like, comment and re-post a post
  • View the number of likes, comments and shares of a post
  • Comments are toggle
  • The number of character in each comment is limited to 100 characters
  • Follow, un-follow someone
  • See who are following us and follow them back
  • Check who we are following
  • View all posts of an individual
  • View our own posts
  • List all user accounts in the entire social network (due to the number of users are still small, I did not develop search user function)

  • Other functions:

    • Due to limited storage space, client app compresses the uploaded image to the maximum of 250px (width or height) User avatar is created by hashing user id and convert that hash code into a hexagonal image
    • Authentication and authorization use JWT
    • Responsive frontend for desktop and mobile devices
  • Technical stack:

    • Frontend: ReactJS, Redux Toolkit, React Router, React Bootstrap
    • Backend: Java Spring Boot
    • Database: MongoDB

Hope you enjoy it and give me a ⭐ Github star ⭐ for my effort!

Live Demo:
https://psn-social-network.herokuapp.com/#/

Source Code:
https://github.com/linhtch90/psn-social-network-public-source


This content originally appeared on DEV Community and was authored by Linh Truong Cong Hong


Print Share Comment Cite Upload Translate Updates
APA

Linh Truong Cong Hong | Sciencx (2022-01-07T12:13:56+00:00) Build a social network with ReactJS, Spring Boot and MongoDB. Retrieved from https://www.scien.cx/2022/01/07/build-a-social-network-with-reactjs-spring-boot-and-mongodb/

MLA
" » Build a social network with ReactJS, Spring Boot and MongoDB." Linh Truong Cong Hong | Sciencx - Friday January 7, 2022, https://www.scien.cx/2022/01/07/build-a-social-network-with-reactjs-spring-boot-and-mongodb/
HARVARD
Linh Truong Cong Hong | Sciencx Friday January 7, 2022 » Build a social network with ReactJS, Spring Boot and MongoDB., viewed ,<https://www.scien.cx/2022/01/07/build-a-social-network-with-reactjs-spring-boot-and-mongodb/>
VANCOUVER
Linh Truong Cong Hong | Sciencx - » Build a social network with ReactJS, Spring Boot and MongoDB. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/01/07/build-a-social-network-with-reactjs-spring-boot-and-mongodb/
CHICAGO
" » Build a social network with ReactJS, Spring Boot and MongoDB." Linh Truong Cong Hong | Sciencx - Accessed . https://www.scien.cx/2022/01/07/build-a-social-network-with-reactjs-spring-boot-and-mongodb/
IEEE
" » Build a social network with ReactJS, Spring Boot and MongoDB." Linh Truong Cong Hong | Sciencx [Online]. Available: https://www.scien.cx/2022/01/07/build-a-social-network-with-reactjs-spring-boot-and-mongodb/. [Accessed: ]
rf:citation
» Build a social network with ReactJS, Spring Boot and MongoDB | Linh Truong Cong Hong | Sciencx | https://www.scien.cx/2022/01/07/build-a-social-network-with-reactjs-spring-boot-and-mongodb/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.