
GotYourRide.com is a full-featured tour management platform that allows users to explore, book, and inquire about tours with ease. The project includes both a customer-facing website and a custom-built admin panel for managing tours, bookings, messages, and website content. Designed and developed as a complete full-stack application with a secure authentication system.
Type : customTech Stack : Next.js, MERNReact.jsTailwind CSSNode.jsExpress.jsMySQLJWT Authentication
This project’s color palette is designed to create a cohesive visual experience. The chosen colors balance contrast and harmony, reinforcing brand identity while maintaining readability and aesthetic appeal.
The typography of this project is designed to create a clear visual hierarchy and enhance readability across all devices. A combination of elegant display fonts for headings and clean sans-serif fonts for body text ensures both style and legibility. Font sizes are carefully balanced to maintain consistency, accessibility, and a modern visual appeal throughout the user interface.
Font Sizes:
Heading: 36px
Sub Heading: 16px
Paragraph: 16px
Montserrat
Google Fonts
Extra Bold
Bold
Regular
Fully responsive design optimized for mobile, tablet, and laptop devices to ensure a smooth user experience across all platforms.
Key Features & Admin Panel Capabilities
- Full-Stack Architecture – Complete control over frontend, backend, and database layers using React, Node.js, Express, and MySQL.
- Dynamic Admin Panel (Custom CMS) – Built an intuitive admin dashboard where administrators can manage website content, including hero sections, tour details, descriptions, and FAQs in real time.
- Bookings & Inquiries Management – The admin panel allows viewing, editing, and deleting all bookings, client messages, and user inquiries seamlessly.
- JWT Authentication System – Secure login and access management for both admin and users.
- Online Payment Integration – Integrated PayPal checkout for secure and convenient tour bookings.
- Fully Responsive UI – Optimized layouts for mobile, tablet, and desktop devices using Tailwind CSS and Material Tailwind.
- Interactive Animations & UX – Used Framer Motion and Motion for smooth transitions and interactive animations throughout the platform.
- Dynamic Components – Includes multiple sliders, date pickers, modals, carousels, and rating systems for a complete user experience.
Major Packages & Libraries Used
- @material-tailwind/react – UI components built on top of Tailwind for consistent design.
- @paypal/react-paypal-js – PayPal integration for handling secure payments.
- Framer Motion & Motion – For advanced animations and interactive page transitions.
- React Router DOM v7 – Client-side routing and navigation between pages.
- React Toastify – For elegant success/error notifications.
- React Modal – For dynamic modals and popups.
- React Datepicker – For date input selection in booking forms.
- React Multi Carousel, React Slick, Swiper, React Alice Carousel – For image sliders, testimonials, and featured tours.
- React Player – Embedded video support.
- React Icons & React Feather – Icon libraries used across the platform.
- React Phone Input 2 – For formatted phone number input in forms.
- React Simple Star Rating – Used in reviews and feedback sections.