Vue.js/Nuxt Web App for a Rapidly Expanding Home Repair Company
1-2 years
SaaS web appAbout Them
Fixd Repair is an innovative home repair webapp showcasing the seamless integration between Vue.js and modern design. Fixd Repair seamlessly connects homeowners with trusted professionals, streamlining the process of fixing household issues.
See Site LiveWhat I Did
With the opportunity to create a web app from scratch, I happily picked up Vue, Vuex, and Vue Router from my toolkit. Using the standard Vue toolkit (and eventually Nuxt), I created highly interactive modular components that not only meet design specs but also provide an intuitive user experience. Among these components include an interactive location map linked with the Google Maps API, a dynamic product offering table that consumes custom back-end API data, and highly interactive forms throughout the web app. My main job was to work with their internal team of developers and marketers to coordinate pushes that meet strict deadlines.
- Create a modern web experience that replaces the old WordPress solution without losing any key content.
- Improve all web performance markers, including First Contentful Paint (FCP) by over 15%.
- Work effectively under fast-moving business deadlines and project curveballs.
- Utilize Vue and Vuex to consume back-end API data and display highly interactive modular components used throughout the app.
I had the opportunity to manage the project Brandon was on when we started building the web app. He took it from start to finish and beyond. Brandon was able to handle high pressure deadlines, deliver great work, and provided a nice addition to the team.
Rich
, Project Manager at Fixd Repair
Using Vue.js validation libraries, creating highly responsive forms is a breeze. The biggest advantage to using Vue.js for forms is the ability to provide instant feedback and enhance the user experience.
All assets are loaded as inline svgs for blazing fast load times. This interactive location map is a good example of how reactive an animated map can be. I accomplished this using keyframes for the animations, svgs for the assets, SASS for the styles, and a Vue styled component for the functionality and Google Map API integrations.