Introduction
Hello! 😀
I created a simple social media site using the MERN stack, so I just wanted to show you guys it.
I'm a newbie when it comes to React so it's not something fancy but it's the first thing I created using React. 😆
Implementing Signup
I made the Signup form simple. All it requires is a Name, Email and Password.
Next I'm thinking of adding a confirm password field to prevent password confusion, I would also like to make it so that the user has to use a strong password with a mix of numbers and symbols. 👀
Once the user is registered they are taken to the signin page.
Implementing Signin
The signin form is pretty standard you log in via email/password. Once the user has signed in the session is managed via a unique JWT token.
Here I would eventually like to implement OAuth.
Implementing Newsfeed
The Newsfeed page is shown once the user has signed in, it only displays posts from people the user is following.
To the right is people the user hasn't followed yet and gives the user quick access to their profile and/or to follow them.
Posting allows both text and photo. I would also like to implement video support and possibly access to the camera so the user can upload their camera image.
Once a post is submitted the poster can delete the post if needed, other users are able to like the post and comment.
Implementing Profile
The profile page shows the user's profile, the user can edit their profile and can also delete it.
At the bottom the user can view the posts they have made, who they are following and their followers.
The ui was made with the help of Material Design. 😎
Conclusion
Here I have shown a simple SMS site I built using the MERN stack.
I'm pretty new when it comes to frontend stuff, but I had a lot of fun building it. 😆
Though I did spend quite a bit of time trying to translate the errors that React somethings throws. 🥴
Once I get better at React I would like to have a go using Tailwind instead of Material Design.
I hope you enjoyed my simple SMS site.
The source code can be found via Github:
https://github.com/ethand91/sample-sms
I also used the following book as a reference to help me build it:
https://amzn.to/3tpN9eY
Although package versions etc, have changed quite a bit. 😅
Next I'm thinking of trying to build an online learning platform. 👀
Like me work? I post about a variety of topics, if you would like to see more please like and follow me.
Also I love coffee.
Top comments (3)
Hi, Ethan. This is cool! I'd like to know if you have any websites or apps that are up and running? Could you send me a clickable link to check out? Thanks!
Thank you :) I don't have anything running at the moment but once I've created a couple of samples I'm thinking of setting up a portfolio site to show them off.
Terrific, Ethan. I will look forward to seeing it!