.png&w=3840&q=75)
The Journey
Carranza Restoration LLC is a leading platform dedicated to home restoration and improvement services. We specialize in transforming visions into reality with our expert estimates, meticulous renovations, and detailed project management. Visit us at carranzarestoration.com.
!
The Challenge
The initial mobile navigation suffered from alignment issues, particularly with nested "Pages" dropdowns, and lacked visual feedback for the menu state.
✓
The Solution
I rehauled the mobile navbar with a custom sidebar design, implementing a CSS-based "X" animation for the toggle button and adjusting layout parameters to ensure links were perfectly centered and legible on small screens.
!
The Challenge
Establishing a secure admin-only area while allowing social login (Google) for regular users was a critical requirement for business operations.
✓
The Solution
I built a dual-strategy authentication system using Passport.js. I implemented JWT for session-less authentication and created custom middleware to protect sensitive administrative routes and dashboards, ensuring a safe environment for both users and admins.
!
The Challenge
Ensuring leads from the website were instantly available in JobNimbus without manual data entry was essential for operational efficiency.
✓
The Solution
I developed a backend service that hooks into the "Free Quote" form submission, formats the data according to JobNimbus API requirements, and pushes it via secure headers, with a fallback to Google Sheets for total redundancy.
!
The Challenge
Multiple sections used inconsistent logo assets, leading to broken images and fragmented branding across the Portfolio and Footer sections.
✓
The Solution
I consolidated all partner logos into a local asset folder and updated all components to use these shared imports, ensuring 100% reliability and visual harmony across the entire platform.
!
The Challenge
Several sections used dark, high-contrast background images (e.g., the Appointment section), making standard text unreadable.
✓
The Solution
I applied utility classes and targeted CSS overrides to ensure text elements automatically switch to light colors when placed over dark hero sections, maintaining high accessibility and readability standards.
Tech Stack
React 18Node.jsExpressMongoDBPassport.jsGoogle Cloud StorageJobNimbus APIRechartsBootstrap 5
Live Project
Experience the final product live in your browser to see the performance and interactions firsthand.
Visit Website