Skip to content

Latest commit

 

History

History
54 lines (42 loc) · 2.46 KB

ARCHITECTURE.md

File metadata and controls

54 lines (42 loc) · 2.46 KB

Leather monorepo setup

We reviewed a few monorepo approaches and how they may fit into our codebase and decided upon starting with pnpm workspaces before then adding Nx if needed

Motivation

As a largely single-product company, with a vision for being a multi-product company, we need a way to share code between our various projects. We also need to ensure high code standards and have the best developer experience we can

Requirements

  • Well organised monorepo
  • Automated package releases
  • Enable developers to easily create new packages
  • Easy to work with in local development
  • Easy to set up package-specific CI jobs

Basic Leather monorepo architecture

This is a basic blueprint of the monorepo. We will begin with a package based monorepo and then decide whether to also host apps here too

mono
├─ apps
│ ├─ extension
│ ├─ mobile
│ ├─ desktop
│ ├─ storybook <-- replaces test-app, place to view UI components with context + tests
├─ docs
├─ packages
│ ├─ api <-- leather API / wrapper interface to other libs: here / under apps,
│ ├─ eslint-config
│ ├─ prettier-config
│ ├─ tsconfig-config
│ ├─ lib
│ ├─ utils <-- shared utils,
│ ├─ ui <-- using definePreset(), contains the theme base (tokens.colors, semantic tokens, etc)
│ │ └─ button <-- consuming the preset, provides a button recipe (in a buttonPreset)
│ │ └─ some-component <-- consuming the preset, provides a component using internal `css` calls, ships a panda.json extract result

Items for further consideration

  • migration from yarn to pnpm
  • upgrading from webpack to esbuild

Useful references