A project that aims at creating a social media platform where users can share images & information about the interesting places they see and visit, built using MERN stack.
This project was created as a follow-along for this Udemy Course, but just following along is boring and so, I made the following changes/improvements to it:
- Used TypeScript for both React and Express
- Used Vite for the build tool instead of the webpack configuration which comes with CRA.
- Used React Router Dom v6 instead of the v5 used in the tutorial.
- Modernized Folder Structure to the typical pattern.
- Improvised the logic for the useForm hook.
- Use a monorepo architechture instead of two different projects.
- Remove body parser dependency and use the built in functions provided by Express 4.16+
- Replace uuid dependency with nanoid - a much faster, leaner and more secure unique ID generator.
- Modernized Backend to use ESModules instead of CommonJS
- Typed the mongoose schema models to ensure data integrity.
- Use Axios to fetch API data instead of built in fetch.
- Use Type Generics to properly type the custom http hook response.
- Implement changes in CSS that makes sense - (NewPlace form image size as an example)
Home Page
My Places
Map View
Edit Place
Add Place
Login Page
Signup Page