TravelGram is a fullstack CRUD social media application inspired by Instagram for users to share vacation photos and captions with friends and family. Users can create their own profiles and images are shared on a public feed. Users can also like photos/posts and add comments to posts. Users can delete their own photos/posts and comments.
- EJS
- MongoDB
- Node.js
- Express
- Bcryptjs
- Cloudinary
- Passport
- Bootstrap
- Tailwind
- Javascript
I built a full-stack CRUD application for users to upload and share vacation photos. I was inspired by Instagram and I wanted to create a similar social media application experience.
Upon loading the webpage, an unauthenticated user is directed to the home page and authenticated user is directed to their profile. The home page includes a snippet about the site and the user can either log in or register a new account.
Once authenticated or registered, the user is directed to their profile. Express session is utilize to store cookie and a session id in the user's browser to retrieve session information. On user's profile page, the user can upload images or go to the public feed. Feed is where users can view all vacation images shared on the site. Users can like and comment on their own and other users' posts. Users can delete their own comments or comments on their posts.
This was a fun project and I learned how to:- Use Bootstrap framework and read and research documentation
- Use Express-session to use a cookie to store session id in browser
- Use Passport for user authentication
- Use Multer middleware for handling multipart/form-data to upload files
- Use Cloudinary to host user images
- Add additional profile features, such as a user profile pictures and about me section
- Add friends list and search for friends feature
- Additional features in the user dashboard and styling to improve the overall UX/UI
- Portfolio: https://jcsf.netlify.app/