app/
├── _layout.tsx        # التخطيط الجذري
├── index.tsx          # الصفحة الرئيسية (/)
├── about.tsx          # صفحة عن التطبيق (/about)
├── (tabs)/            # مجموعة تبويبات
│   ├── _layout.tsx    # تخطيط التبويبات
│   ├── index.tsx      # التبويب الأول
│   └── settings.tsx   # تبويب الإعدادات
└── user/
    ├── [id].tsx       # صفحة مستخدم ديناميكية (/user/123)
    └── index.tsx      # قائمة المستخدمين (/user)

// app/_layout.tsx
import { Stack } from 'expo-router';

export default function RootLayout() {
  return (
    <Stack
      screenOptions={{
        headerStyle: { backgroundColor: '#0a0010' },
        headerTintColor: '#a78bfa',
        headerTitleStyle: { fontWeight: 'bold' },
      }}
    >
      <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
      <Stack.Screen name="user/[id]" options={{ title: 'الملف الشخصي' }} />
    </Stack>
  );
}

import { Link, router } from 'expo-router';

// باستخدام Link
<Link href="/about">عن التطبيق</Link>

// باستخدام router
router.push('/user/123');
router.replace('/login');
router.back();

// app/(tabs)/_layout.tsx
import { Tabs } from 'expo-router';
import { Ionicons } from '@expo/vector-icons';

export default function TabsLayout() {
  return (
    <Tabs
      screenOptions={{
        tabBarActiveTintColor: '#7c3aed',
        tabBarStyle: {
          backgroundColor: '#0a0010',
          borderTopColor: '#27272a',
        },
      }}
    >
      <Tabs.Screen
        name="index"
        options={{
          title: 'الرئيسية',
          tabBarIcon: ({ color }) => (
            <Ionicons name="home" size={24} color={color} />
          ),
        }}
      />
      <Tabs.Screen
        name="settings"
        options={{
          title: 'الإعدادات',
          tabBarIcon: ({ color }) => (
            <Ionicons name="settings" size={24} color={color} />
          ),
        }}
      />
    </Tabs>
  );
}

// app/user/[id].tsx
import { useLocalSearchParams } from 'expo-router';
import { View, Text } from 'react-native';

export default function UserProfile() {
  const { id } = useLocalSearchParams<{ id: string }>();

  return (
    <View>
      <Text>الملف الشخصي للمستخدم: {id}</Text>
    </View>
  );
}