Turborepo Template

A Turborepo for easy web and native applications.

Repo set up

This Turborepo includes the following packages/apps:

Apps and Packages

native: a react-native app built with expo
web: a Next.js app built with react-native-web
@repo/ui: a stub react-native component library shared by both web and native applications
@repo/typescript-config: tsconfig.jsons used throughout the monorepo
@repo/app: shared features and utils used by both web and native applications

Each package/app is 100% TypeScript.

Utilities

This Turborepo has some additional tools already setup for you:

Tamagui, but only core for build a completely custom UI component library
Firebase for authentication
Solito for unified navigation
Expo for native development
TypeScript for static type checking
Prettier for code formatting

Features

This is mainly a demo repo that includes some of the features that are usually a bit painful to get working. These include:

Custom fonts in both apps
Deployment via a stateless Docker container (Fly.io) so you can be Vercel-free if you need to be (e.g. for HIPAA compliance)
Environment variables configurable with .env files, and the ability to run any command in any environment
Styleable cross-platform SVG icons

Development

Getting started

Start by cloning this repo and creating a .env file in the root of the repo. You can copy the .env.example file to get started.

Next, install the dependencies and start the apps:

yarn install
yarn dev

This will start the web and native apps using the .env file.

Adding new environment variables

Adding new environment variables currently involves changing values in a few places.

Add the variable to the .env file in the root of the repo, and add it to the .env.example file.
That's it! deploy.sh (for Next.js) and Babel (for Expo) will automatically pick up the new variable and make it available in the app if it matches the relevant prefix and is available in the environment from which the build was run.

Deployment

If you plan on building the app locally, make sure you have dotenvx installed:

npm install @dotenvx/dotenvx -g

Web (Next.js)

You can easily deploy this repo with Docker.

To test building the image, run the following command, although you will need to set some build secrets in the docker command for it to work properly:

dotenvx run -- bash -c 'docker build --secret id=NEXT_PUBLIC_WHATEVER,env=your-secret . -t outro-turbo-web -f apps/web/Dockerfile'

You can deploy an image that is built locally (and e.g. uses the production env file) to Fly.io very straightforwardly using:

dotenvx run --env-file=./.env.production -- sh deploy.sh

Note: you will need to enable "Allow the default Docker socket to be used (requires password)" setting in Docker Desktop's 'Advanced' settings.

Native (Expo)

You'll need the EAS CLI installed to deploy the native app. You can install it with:

npm install -g eas-cli

To deploy the native app, run the following command:

eas build --platform ios

jckw/turbo-template