lms-mobile-ui-pipeline

Structure React Native LMS apps using a layered approach with design tokens, StyleSheet.create definitions, and runtime styles to enforce visual consistency. This pattern separates theming, component structure, and layout logic to ensure maintainability across all mobile screens.

The best way to organize Expo Router navigation for a mobile LMS is a two-layer system with custom headers and modal sheets. This structured navigation pattern supports complex routing while maintaining consistent layout and transitions across modules.

Optimize React Native list performance by standardizing list virtualization, memoizing list item components, and implementing pull-to-refresh. This pattern ensures smooth scrolling and efficient rendering for large LMS course catalogs and interactive lists.

Yes, you can use modal sheets and swipe actions with Expo Router. The UI architecture pattern standardizes modal sheets, swipe actions, and pull-to-refresh directly within the navigation and list management layers for interactive user experiences.

Strict design token usage is required in React Native LMS component patterns to maintain visual consistency across all screens. Enforcing token discipline prevents style drift, simplifies global theming updates, and ensures modular, memoized components remain maintainable.

This UI architecture pattern is specifically built around Expo Router for its two-layer navigation and modal sheet support. While the component and design token patterns are adaptable, the navigation and layout structure requires Expo Router to function as designed.