Hello everyone ๐ ! I am Mansi . I have started learning Mern Stack from few months . I am really passionate about learning and developing . So , now let's talk about my project for this hackathon . My basic motive behind building this is to learn . I have build a social webapp named as " Qwerty " .
Inspiration
Ever wondered how the social media apps works ? That's what inspired me for making this project . I always wanted to have my own social media app . And here I come with my social app . Although the there are not much features that are implemented but it is good to go . It has got authentication , emailing features too which i learned while making this project .
Tools/Tech Stack Used
- Visual Studio was used for development as I feel it provides the best development environment .
- Github was used for maintaining my version controls .
- FrontEnd : React.js , Material-UI
- Backend : Node.js
- Database : Mongodb and Cloudinary
- Deployment : Vercel and Heroku
Working
User has to come up and signup where he can also update his details . An email will be sent to you email id after successfull registration . After logging in , User will be able to see the posts by other users . User can follow / unfollow other users . He can see other's profile . Search option is also available over there . In case user forgets his/her password then he can choose the option to reset the password . Mail Transporter was used to send emails to the user . When a user posts a pic , it is first stored in the cloudinary platform and the url of the pic generated from it is saved in our mongodb database . There are two schemas : User and Posts . The posts are seen in a decreasing time fashion , which means latest ones are shown on top .
Features
- Login / Signup
- Post a picture
- Delete a picture
- Post a comment
- Delete a comment
- Like / Unlike a post
- Reset Password
- Email greeting
Login Page
Home Page
User's Profile
Search User
Creating a Post
Posted
Posting a comment
Deployment
The backend of nodejs was hosted using heroku . The frontend was deployed very easily using vercel . The link is instaclient-ten.vercel.app . Enjoy !
#vercelhashnode