cacho.dev

Building Web3 Commerce at Parcel

March 2022 - January 2023

In early 2022, I joined Parcel as a Frontend Engineer during an exciting time for Web3. Parcel was building a platform that bridged traditional e-commerce with blockchain technology—enabling creators and brands to sell NFTs alongside physical products, all in one seamless checkout experience.

The platform was serving over 1,000 daily active users, and I was brought on to help scale the frontend architecture, optimize backend performance, establish design systems, and deepen the Web3 integration. This was full-stack work in the truest sense, touching everything from database optimization to smart contract interactions.

Backend Optimization: GraphQL + Postgres + Node.js

One of my first priorities was optimizing the backend. With 1,000+ DAU and growing, performance bottlenecks were starting to appear.

The Stack

The Challenge

Users were experiencing slow page loads when browsing product catalogs or viewing order history. The issue? Inefficient database queries and N+1 query problems in our GraphQL resolvers.

The Solution

I focused on optimizing the ORM layer:

  1. DataLoader implementation - Batched database queries to eliminate N+1 problems
  2. Query optimization - Analyzed slow queries, added indexes, restructured joins
  3. Caching strategies - Redis caching for frequently accessed data
  4. GraphQL query complexity limits - Prevented abusive queries from overloading the database

The result was significantly faster page loads and a more scalable backend that could handle growing traffic without degrading user experience.

Frontend Architecture: React + Redux + TypeScript

On the frontend, I was responsible for building a component library and state management system that could support rapid feature development.

Modern React Stack

Reusable Component Library

I built a comprehensive library of reusable components:

Each component was:

State Management

I designed Redux stores for:

The architecture needed to handle both traditional e-commerce state (cart, checkout) and Web3-specific state (wallet connection, pending transactions, gas prices).

Design Systems: Collaboration with Design

One of the most rewarding aspects was working closely with our Head of Design to establish a cohesive brand system and UI/UX patterns.

Figma to Code Workflow

We used Figma as the source of truth for design:

UI/UX Patterns for Web3

Web3 introduces unique UX challenges:

Working with design, we established patterns that made Web3 interactions feel as smooth as traditional web apps.

Build Pipelines: Rollup + Next.js + Storybook

To support rapid development and deployment, I designed modern build pipelines.

Storybook for Component Development

I set up Storybook as our component playground:

Rollup + Next.js

I configured Rollup bundlers for:

CI/CD Automation: Docker + GitHub Actions

To accelerate release cycles, I automated the entire deployment pipeline:

Docker Containerization

GitHub Actions CI/CD

This meant developers could push code confidently, knowing that automated checks would catch issues before they reached production.

Web3 Integration: NFT Purchasing

The core of Parcel’s value proposition was seamless NFT purchasing. I integrated multiple Web3 libraries to make this work:

Libraries

Features I Built

The UX Challenge

The hardest part wasn’t the technical integration—it was making blockchain interactions feel normal. Users shouldn’t need to understand gas, nonces, or block confirmations. They just want to buy an NFT.

I focused on:

What I Learned

Parcel was a masterclass in modern web development and Web3 integration:

  1. Full-stack optimization - Backend performance is just as important as frontend UX
  2. Design systems - Investing in component libraries and design tools pays off long-term
  3. TypeScript - Type safety dramatically reduces bugs and improves developer experience
  4. Web3 UX - Making blockchain feel native to web apps requires thoughtful design
  5. CI/CD - Automated pipelines enable faster, more confident shipping
  6. Collaboration - Working closely with designers creates better products

Reflections

Parcel was at the intersection of e-commerce, Web3, and modern frontend development—three areas I’m deeply passionate about. Building features that served 1,000+ daily users taught me the importance of performance, scalability, and user experience at every layer of the stack.

The Web3 integration work was particularly valuable. Understanding how to build crypto-native features while maintaining a seamless user experience has informed every blockchain project I’ve worked on since.

Today, when I’m building immersive web experiences or working on creative tech projects, I still use the component architecture patterns, build pipelines, and design system thinking I developed at Parcel. And the TypeScript + React + GraphQL stack? That’s become my go-to for any serious web application.

Tech Stack: React, Next.js, TypeScript, Redux, GraphQL, Node.js, Postgres, Figma, Storybook, Rollup, Docker, GitHub Actions, Web3 (web3-react, web3.js, ethers.js), Ethereum, Polygon

Company: Parcel

Role: Frontend Engineer (Full-Stack)

Key Outcomes:

Scale: 1,000+ daily active users (DAU)

Blockchain Networks: Ethereum, Polygon