Resideo

Ulises Garcia

Figma
GraphQL
Node.js
React
TypeScript
Resideo main website

A bit of context, Resideo being a big company with a lot of products had all the user base spread across different systems, not a problem, just a natural outcome of growing and acquiring companies over time.

Our end goal was to merge multiple systems into one or at least create a standard that other teams were able to copy easily, adding on top of that a technology refresh to systems using old paradigms or less performing.

When I joined the team, this was a greenfield project, we had the opportunity to choose the tech stack and design the architecture that we wanted to use to move forward.

For the Frontend, we decided to use React as our main UI library, the recently created team had experience using it in very large projects, so it was the right choice, along with that we did create a component library that can be used across the company on apps using a similar stack, we did leverage Storybook to showcase the library.

Pro Portal - Sign In page

We also have the task to unify multiple identity providers that they did use over the past few years, so all the users were able to enjoy the same experience and were able to use the same credentials across different applications, even mobile apps, where the tech of choice was Flutter.

To mitigate the issue above we went with a very robust product Auth0, they provide us the tools that we needed to achieve what we wanted without the effort of maintaining an identity ecosystem by ourselves (this could be quite complex).

Auth0 - Identity provider

Last but not least our Backend, from the beginning we noticed that this project was a perfect candidate to use GraphQL, why? because there are multiple sources of data and we wanted to have a single way to communicate with them.

We came out with implementing a very robust GraphQL explorer solution, where we were able to see not only the graph but also the services, which one owns what, and how all the data is connected, of course, the goodies that come with GraphQL were a huge plus, playground, self-documentation, etc.

To achieve all this we used the following stack, Node.js, Typescript, Prisma, Postgres, Apollo Gateway, Apollo Federation, and Relay, all this deployed to the Azure Cloud (Company preference).

All the described above gave us a really good foundation to keep iterating, building, and creating something amazing for the final users, along with a very good DX (Developer Experience).

Wrapping up

If you are looking for a solution like the one above, advice, or development workforce to set the foundation and the standards of your next project, hit me up.







2020

Partner With Ulises
View Services

More Projects by Ulises