Apex Monorepo

• Automatic: Release, Changelog, Publishing, Dependency Updates
• Zero Installation PRs with Stackblitz CodeFlow
• Internal and External Packages
• ESM and CJS support for published packages
• Setup ready for:
  • Next.js
  • Remix
  • Astro (coming soon 🚧)

Workspaces 🚗

Name	Type	Description
Remix	App	with module transpilation.
Nextjs	App	with module transpilation in dev.
UI	External Pkg	Component library published on NPM
eslint-config-custom	Internal Pkg	shared ESLint configuration
tsconfig	Internal Pkg	shared TypeScript configuration

Tooling 🤹

• TypeScript for static type checking
• ESLint for code linting
• Prettier for code formatting
• changesets for managing releases according to SemVer
• pnpm for managing Node.js packages
• tsup for easily bundling TypeScript packages

Bots 🤖

Name	Links	Reason
Renovate	Marketplace / Docs	Pin and auto-update dependencies
Kodiak	Marketplace / Docs	Automerge selected Pull Requests (including minor and patch dependency updates)
Changesets	Marketplace / Docs	Handle SemVer, changelog generation, and publishing for External Packages

Usage 🤹

Remember to set up access for the Bots mentioned above by visiting their Github Marketplace pages and enabling them.

⚠️ for Kodiak it is also important to enforce Branch Protection rules for main in your repository settings

Once that is done, install dependencies from root.

pnpm install

And to build every package and app in the monorepo:

pnpm build

To develop all apps and packages:

pnpm dev

Whenever neccessary to run only a certain set of workspaces, use the --filter flag:

pnpm dev --filter workspace-name

Expanding 📦

When creating a new internal package, it's important to set overrides for pnpm on the stackblitz/codeflow.json.

{
  "pnpm": {
    "overrides": {
      "ui": "./packages/ui",
      "tsconfig": "./packages/tsconfig",
      "eslint-config-custom": "./packages/eslint-config-custom",

      "<new-pacakge-name>": "./new/package/path/from/root"
    }
  }
}

Remote Caching ☁️

Besides local caching, Turbo can also cache build artifacts in the cloud and share across members of a team and environments. The quickest setup for Turbo's Remote Caching is with Vercel.

Deploying Apps 🚀

Remote Caching will skip processes when there are no changes. In order to make the best use of that, it is recommended to use Turbo as the task runner for every task in all environments.

So, when deploying your apps it is important to override the inferred build tasks from the platform and run them from root. For example, usually your build script declared in package.json will run either remix build or next build. For the apps within an Apex Monorepo it's best to change directory back to root of the monorepo and run the task from there with the filter.

For example, if your app is localted at /apps/app-workspace-name the build command in the server platform will be:

cd ../../ && pnpm build --filter app-workspace-name

Useful Links 📚

• Turborepo Docs