web-ts-monorepo-starter-pack

Feature-heavy monorepo boilerplate for web and mobile apps

---

Project maintained by Rock-n-Prog Hosted on GitHub Pages — Theme by mattgraham

Features

Here’s a non-exhaustive list of everything this base app has to offer:

• Heavily detailed documentation
• Monorepo setup with Turborepo and pnpm
• Next.js (React) web app (apps/web)
• Expo (React Native) mobile app (apps/mobile)
• Type-safe end-to-end communication between layers
  • UI-API: tRPC, bundled with react-query
  • API-DB: Prisma, which also handles schema definitions and migrations
• Docker, with Docker Compose to run the local MySQL database
• Theming
  • Defined design system (UI library)
    • web: packages/web-ui
    • mobile: packages/mobile/ui
    • Contains example for snackbar requests handling
  • Defined theme, with styled-components and automatic theme detection
  • Automatic theme mode detection using client storage
  • Theme handling contexts and hooks
• Translations (i18next)
  • Setup for translation namespaces
  • Automatic locale detection using client storage
  • Server-side rendering examples with next-i18next
  • Locale handling contexts and hooks
• Forms, with react-hook-forms and zod resolvers
  • Form handling and validation through React Hook Form and zod resolvers
  • Reusing the zod schemas from the API
  • Separation of concerns between inputs and form fields
    • web: packages/web/forms
    • mobile: packages/mobile/forms
• Navigation
  • Defined routes for both web and mobile apps
  • Example of path params usage
• Workflows (CI), with GitHub Actions, scoped for each app and package
• Pre-commit hooks with Husky for code formatting using lint-staged
• Storybook and custom mobile UI showcase app setup to display the design system
  • web: packages/web-ui
  • mobile: apps/mobile-ui-showcase
• Well-defined linter / formatter rules
  • eslint
  • prettier
  • stylelint
  • ls-lint
• Base FP-oriented config for TS and linters (packages/config)

Okay, but what isn’t in here?

• Deployment setup
  • We don’t actually want to deploy this boilerplate. It could be a good example, but dealing with cloud operations is out of scope for now.
• Infrastructure as code
  • Same as deployment setup