ringge/t4-app

Type-Safe, Full-Stack Starter Kit for React Native + Web.

create-t4-app

Interactive CLI to start a full-stack, typesafe, universal Expo & Next.js app on Cloudflare's edge platform.

Get started with the T4 Stack by running pnpm create t4-app

   

🍔 The T4 Stack

The T4 Stack is a universal web and native stack made by Tim Miller focused on developer experience, rapid development, and performance.

Easy integration with Cloudflare services, such as R2 & D1 enable developers to build apps with AI-powered features at a lower cost compared to AWS.

👉 Further documentation can be found on the T4 Stack website. 👈

     

📐 UI Kit

• 🎨 Tamagui

📡 Data Fetching

• 🔄 tRPC
• ⏲️ Tanstack Query

🔮 Frontend

• 🔗 Next.js
• 📱 Expo

🧭 Navigation

• ☀️ Solito

🏢 Global State Management

• 🧩 Jotai

⚙️ Backend

• 🔥 Hono
• 💚 Cloudflare Workers
• 📁 Cloudflare D1
  • SQLite database for the edge
• 🗄️ Drizzle

🔒 Authentication

• 🔑 Supabase

or

• 🔑 Clerk

📖 Background

T4 is a project starter kit for building type-safe, native & web applications in TypeScript using Tamagui, tRPC, and Turborepo. Deploy to Cloudflare for a global edge network. All at a fraction of the cost of AWS, Vercel, or Azure.

It provides a unified, opinionated, & minimalistic setup for quickly getting started with building native & web apps, using the same code, without having to worry about the complexities of setting up a development environment.

💪 Build Apps for All Platforms

• 📱 iOS
• 🤖 Android
• 🕸️ Web
  • Progressive Web App (PWA) support
  • 💻 macOS
  • 🪟 Windows
  • 🐧 Linux

Build native apps for iOS, Android, macOS, Windows, and Linux using the same codebase.

Never worry about using XCode or Android Studio again

 

❓ Why T4?

• Small learning curve
• Instant feedback, rapid development
• Universal across React Native & React Web
  • Data fetching
  • Styling
  • Authentication
  • Navigation
• High code re-use
• Low bundle size
• Edge compatible
• Fast startup time
• Simple setup
• Allows for platform-specific code when needed.
• Type-safety

📦 What's Included

• Tamagui - A UI kit for building beautiful and responsive user interfaces.
• Turborepo - A high performance build system for TypeScript, built in Rust.
• tRPC - A TypeScript framework for building end-to-end typesafe APIs.
• TypeScript - A typed superset of JavaScript that compiles to plain JavaScript.

🚀 Quick Start

pnpm v8.6.5 is required to use create-t4-app

To scaffold an app using create-t4-app, run any of the following commands.

pnpm

pnpm create t4-app

Supabase

If you would like to use Supabase as your authentication provider instead of Clerk use:

pnpm create t4-app --supabase

🧩 VSCode Extension

The VSCode extension is optional but highly recommended. It provides a better developer experience by providing code actions to help you scaffold your app. You can find more info in the docs or install it from the VSCode Marketplace.

✨ Features

• ✅ Uses Next.js for building web apps.
• ✅ Uses Expo for building native mobile apps.
• ✅ PWA by default for native desktop support. No Electron required.
• ✅ Tamagui UI kit across all platforms.
• ✅ Uses Cloudflare Workers for serverless functions.
• ✅ No Docker containers required.
• ✅ Uses tRPC & Tanstack Query for fetching & caching across all platforms.
• ✅ Authentication across all platforms.
• ✅ Powered by TypeScript for type safety and better developer experience.
• ✅ Comes with pre-configured ESLint and Prettier for code consistency.
• ✅ Github Action publishing for Expo apps
• ✅ Database migration in CI/CD
• ✅ Supabase Auth
• ✅ PNPM support

⭐ Wish List

I would like to add the following features to create-t4-app in the future:

• Legend State
• Million.js example
• GraphQL (type-safe) data fetching
  • ⏲️ GQty - A No-GraphQL client for TypeScript.
  • 🔄 Garph - Fullstack GraphQL Framework for TypeScript
• 📚 Storybook support
• 🖌️ Chromatic support

💬 Community

For help, discussion about best practices, or any other conversation that would benefit create-t4-app:

Join the T4 Discord Server

🫶 Contributors

We welcome contributions from anyone and everyone. Please read our contributing guidelines for more information on how to get started.

👏 Special Thanks

• Cloudflare Developers
• Shopify Developers
• Drizzle Developers
• Yusuke Wada - Creator of Hono.js
• Tanner Linsley - Creator of TanStack
• Nate Birdman - Creator of Tamagui
• Tim Neutkens - Co-author of Next.js
• Guillermo Rauch - Co-author of Next.js
• Fernando Rojo - Creator of Solito
• Daishi Kato Creator of Jotai
• Jared Palmer - Creator of Turborepo
• Evan Bacon - Maintainer of Expo

⚖️ License

Create T4 App is licensed under the Apache License.