The Spark of Inspiration
Once upon a time, Instagram was my go-to app, not for its filters or stories, but for a single, simple feature - its interactive world map. As a world traveler who grew up with printed photos and tangible travel scrapbooks, Instagram's map feature was a digital revolution. It felt like having the entire world at my fingertips, with each pin on the map a memory, a story, a piece of my journey etched in the virtual world.
However, like all good things, it came to an abrupt end. Whether it was due to privacy concerns or a shift towards interactive reels and bite-sized video snippets, the map feature was scrapped, and with it, my interest in Instagram. But the concept stuck with me, and today, it became the inspiration for my project, the "Travel Tracker".
The Birth of "Travel Tracker"
Flash forward to the present, I found myself taking the Kintone’s REST API workshop at Code Chrysalis, where we were incorporating React and Kintone’S REST API to record countries, states, and cities. As I interacted with others in the workshop debating whether or not they should enter Kintone’s contest, a memory of Instagram's map feature resurfaced, and I was struck with a wave of nostalgia and inspiration. Thus, "Travel Tracker" was born - my modern rendition of the digital travel scrapbook.
The goal was simple: create an application that allows users to mark locations they have visited on a map, upload photos, and curate their personal travel experiences, just like the good old days of Instagram's map feature.
Technology Stack
The "Travel Tracker" application features a diverse technology stack that ensures smooth operation of both the frontend and backend. For the frontend, I used React.js mainly, utilizing components for efficient organization and functionality. I employed CSS for styling to ensure a visually pleasing and user-friendly interface. I integrated the Mapbox API to facilitate interactive maps with dynamic markers, enhancing the user experience.
The geolocation aspect is powered by the Country-State-City React library, enabling seamless integration with Kintone's REST API for data communication. For user authentication and login functionality, I leveraged Firebase, ensuring secure access. Cloudinary serves as the image hosting solution, enabling users to upload and display images effortlessly. I deployed the frontend on Vercel, providing scalability and fast loading times.
On the backend, I used Node.js and Express to create a robust foundation for handling data interactions. I harnessed the GET and POST functionalities of the Kintone REST API to manage data retrieval and storage. The backend is deployed on Render for reliable performance.
Overcoming Challenges
Building "Travel Tracker" was a journey in itself, filled with a few challenges. One of them was linking relational data, such as user information and location data, in Kintone's nonrelational database. To address this, although I could have used Kintone's relational database plugin, I employed Firebase's serverside authentication database to store user data and utilized React's useContext to facilitate the retrieval and storage of user information upon location submission.
Another hurdle was dealing with Kintone's database's limitations on data values that could be stored. For instance, I needed to store an array of geocoordinates as individual integer values. With a bit of problem-solving, I was able to overcome these challenges, resulting in an overall smoother user experience and a deployed application.
Future Prospects
As the "Travel Tracker" application takes its first steps, the journey ahead is still far. I envision future features such as user interaction capabilities, enabling users to follow and engage with each other's travel journeys. Enhanced functionalities such as tagging other users, bookmarking favorite photos, and uploading multiple images to a single location with descriptions could further enrich the user experience. I hope to see "Travel Tracker" transform into a thriving community of travel enthusiasts, sharing their adventures in a dynamic and interactive manner from both those who remember the good old days of Instagram’s past, to those who never got to grow up with it.
Conclusion
Building the "Travel Tracker" application was an enjoyable and nostalgic trip down memory lane. Kintone's REST API was extremely user-friendly and easy to use, without the hassle of micromanaging migrations and rolling back databases, which could have affected overall application performance. I'd like to extend my gratitude to Kintone for providing the opportunity to utilize and participate in their contest. As the project evolves, I eagerly look forward to seeing the growth and expansion of a dynamic and thriving user community!
Travel Tracker application:
https://kintone-travel-tracker.vercel.app/login
Linkedin:
https://www.linkedin.com/in/garrett-omi/
Github handle:
@garrettomi
_This post is part of the Kintone Customization Contest 2023.
Submitter: https://forum.kintone.dev/u/Garrett _
Top comments (1)
Thank you for submitting your project to the Kintone Customization Contest 2023!
Congratulations on your win!
We will be reaching out to you through the Kintone Developer Forum.