2025
Personal Project
trackify.com
Background
Trackify is a web-based application designed to help users track and organize their entertainment consumption across music, podcasts, and audiobooks. As media content continues to expand across platforms, users needed a centralized space to log their activity, revisit what they’ve listened to, and receive content recommendations tailored to their tastes. The platform includes a personalized onboarding flow, structured log tables, and a modern interface to elevate the user experience.
Tech Stack
Languages: JavaScript
Frontend: React, Tailwind CSS, Next.js
Backend: Node.js, Express.js
Database: MongoDB
Hosting: Vercel (Client), Render (Server)
The Features
Secure user authentication
Personalized onboarding based on user interests
Spotify API integration for real-time media data
Tailored recommendations across music, podcasts, and audiobooks
Log and view listening history in a structured table
Detailed log view for each media entry
MongoDB integration for efficient data storage
How Trackify was built
🧭 Research & Planning: Defined core features and identified gaps in media tracking tools.
🧩 Design & Wireframing: Created user flows and clean UI mockups focused on accessibility.
💻 Front-End Development: Built a dynamic UI with React, Next.js, Tailwind CSS, and Spotify API.
🛠️ Back-End Development: Set up a Node.js + Express API and connected it to MongoDB.
🧪 Testing & Debugging: Manually tested forms, API calls, and responsiveness across devices.
🚀 Deployment: Launched on Vercel (frontend) and Render (backend) with MongoDB Atlas integration.
Results
Trackify brings together a clean, personalized front end with a robust back end to help users track and discover music, podcasts, and audiobooks. Built with React, Next.js, and Tailwind CSS, the UI is fast and intuitive. The back end, powered by Node.js, Express, and MongoDB, ensures secure data handling and smooth API integration—including real-time content from Spotify. The result is a seamless, full-stack experience that turns everyday media consumption into something organized and engaging.