The technology team at BASIC/DEPT® was tasked with building a new website for the performance wearable WHOOP, as well as migrating content from their existing WordPress site to a new Contentful environment.
As the lead developer on the project, overseeing three other devs, I worked on the initial project configuration, implementing a monorepo structure (with Yarn Workspaces).
Using Yarn Workspaces made it easier to deploy different parts of the project, i.e. the web app and the Storybook app, separately, which simplified the deployment configuration in our cloud provider. It also allowed us to separate some of our library code from the application logic.
The web app itself was built using the (then relatively new) App Router in Next.js. As a team we always wanted to push ourselves and try out new things in our projects, and this project was a good candidate to be the agency's first project using this new feature. It gave us the flexibility to build certain routes statically, while others where rendered server-side.
As a major part of the app logic, I built a module resolver in React that could easily link any React component in the Next.js app with the data from a corresponding content type in Contentful. This made it easy for the other devs to focus on building out the UI without having to worry about how the data was provided or how the component was loaded, which increased development velocity.
Other responsibilities
Implemented design tokens using Style Dictionary. This made it super easy to match tokens to the design system properties in Figma
Created reusable accessible React primitives, i.e. the lower level UI building blocks such as buttons, headings, image wrappers, etc., using the design tokens from Style Dictionary
Extensive content modeling in Contentful, including internationalization logic
WordPress-to-Contentful content migration, using the WordPress REST API and Contentful's Content Management API
