Vue.js at refurbed

Refurbed has a tech stack centered around Go (backend) and Vue.js (front-end).

When we need the best user experience and interactivity while building non-trivial user interfaces, Vue.js is our go-to technology. We use Vue.js in two ways: embedded in our server-side generated pages and full SPA:

• Our checkout is a micro-frontend application embedded in our server-side generated pages. Checkout is a complex workflow involving validations, APIs, Payment systems, addon selections, etc. The user account section of the Website is another Vue micro-frontend following this pattern.

Thanks to Vue, we can reuse components, think reactively, and find good patterns to keep our code isolated when doing A/B experiments.

• Our new Merchant Interface builds on top of a full-fledged Vue SPA application, which integrates with our new gRPC APIs. An envoy proxy offers the grpc-web protocol to our application, and we consume this end-point with JavaScript bindings.

We have reusable components built on top of Vuetify which allow integration with the gRPC APIs queries, filtering system and permission system while still following frontend good practices.

We test both applications with Jest and Cypress.

Other public pages (eg. Categories, Products) do not follow a SPA architecture. Instead we compile simple HTML/alpine.js decorated templates down to Go using quicktemplates.