A project I created to learn more about react and MERN (MongoDB, ExpressJs, React.JS, Node.JS) tech stack. However, unfortunately I did not bother to deploy it yet because I think in the future I may still work on this project to add more features. :) And also Heroku is not free anymore since Nov. 2022....
- download the repository to your local address;
- open with any code editor (e.g. vscode) and open a terminal: Client side: (1) cd client (2)npm run start; Server Side: (1) cd server (2) npm run start;
For the front end I built it with React and for the backend with MongoDB. And to connect them I used ExpressJS and Node.JS.
- LoginPage, I achieved functions like register, login and authentication using Morgan, jsonwebtoken. And during that it also accepts photos as profile picture, so I used multer and multer-gridfs-storage to upload.
Preview of the LoginPage:
-
HomePage
Preview of the Homepage:
In the homepage I achieved a user widget to show user information, a post widget to allow user to make posts similar to Twitter, a friendPost widget to show friends' posts, an Ads widget that shows advertisement and finally a friendList widget that show a list of your friends on the network.
User Widget：
Post Widget:
Friend Post Widget:
Ads Widget & Friend List :
I think I would consider about adding more features like payments, wallets and features like book a flight/hotel/rental car, and a chat system. In the end, I project it to be a mix of Wechat, Twitter and Expedia.