Want to Track the places you visit with a Great UI and User Experience?
Visité - A Place Tracker is the Solution.
This is a Feature-Rich app in which you can add and remove places you visited, wishlist them, share blogposts, like other user's profile and even send them texts...
It included many more features like Automatic place search and Map rendering which enhance the user experience.
- Share Places (Visible to the world)
- Wishlist Places (Only visible to the user)
- Share Posts in Markdown Format
- Like other Profiles and Send Messages
- Four types of places to add from and count of each type gives a personalized badge to the user
- Automatic search any place around the world (TomTom search bar)
- Render Map of the address (Leaflet Maps)
- Public chatbox that shows real-time messages
- Admin only protected route that can post global blogposts
You can see detailed Working of App on Youtube: Video
I personally have a Dream to visit as many Beautiful Places in the World as I can.
So this App is developed for people like those who visit different places in the world and not just want to keep track of them but to show it to the world too.
It's Simple, Beautiful and one day I would also love to add a Genuinely visited International place in this application.
During the development of this app, I strengthened previous knowledge and learned various things like...
- React.js with Normal and Custom Hooks (Custom hooks includes HTTP hook and Authentication Hook)
- Node.js and Express Restful API
- MongoDB with Mongoose and Database validations
- Working with JSON Data and Handling CORS error
- Fetch, Post, Patch,Delete API Calls
- Setting up admin only route with protection from frontend and backend too
- Cloud Firestore with Rules
- Firebase Storage Add and Delete
- Rendering Map with Leaflet
- Automatic place search functionality by TomTom
- Using Various Material UI Components like Modal, Drawer, Tooltip, Alerts etc
~ Frontend
- React.js with Hooks
- Html, Css, Javascript
- Material UI Components
- Bootstrap
~ Backend
- Node.js with Express
~ Database
- MongoDB with Mongoose [For User Data]
- Cloud Firestore (For Global Realtime chatbox and Admin Blogposts)
~ Hoisted on
- Frontend on Firebase and Backend on Heroku