Protected Routes

src/app/
├── _layout.tsx           # Root layout with ClerkProvider (see setup.md)
├── (auth)/               # Public: sign-in / sign-up
│   ├── _layout.tsx       # Redirects signed-in users away
│   ├── sign-in.tsx
│   └── sign-up.tsx
└── (home)/               # Protected: app content
    ├── _layout.tsx       # Redirects signed-out users to sign-in
    └── index.tsx

// src/app/(home)/_layout.tsx — protect the group
import { useAuth } from '@clerk/expo'
import { Redirect, Stack } from 'expo-router'

export default function Layout() {
  const { isSignedIn, isLoaded } = useAuth()

  if (!isLoaded) return null
  if (!isSignedIn) return <Redirect href="/(auth)/sign-in" />

  return <Stack />
}

// src/app/(auth)/_layout.tsx — keep signed-in users out of auth screens
export default function AuthRoutesLayout() {
  const { isSignedIn, isLoaded } = useAuth()

  if (!isLoaded) return null
  if (isSignedIn) return <Redirect href="/" />

  return <Stack />
}

import { Show } from '@clerk/expo'

<Show when="signed-in">
  <Text>Hello {user?.firstName}</Text>
</Show>
<Show when="signed-out">
  <Link href="/(auth)/sign-in"><Text>Sign in</Text></Link>
</Show>