Core Philosophy

Bagisto Native is built on pragmatic principles that make web → native integration simple, reliable, and safe. At its core, the framework provides a minimal, focused API through web components and utility functions that work seamlessly across any frontend framework - React, Next.js, Vue, Angular, or Svelte. It embraces progressive enhancement, meaning your web application continues to function normally in browsers while native features automatically enhance the experience when running in mobile containers. The architecture is event-driven, using Hotwire/Turbo native bridge and custom DOM events for clear, decoupled communication between web and native layers. Tiny, hidden web components serve as bridge anchors with Stimulus controllers, avoiding any interference with your UI. Explicit utility functions like triggerHotwireNativeToast() and isTurboNativeUserAgent() make it easy to trigger native behaviors intentionally. The framework maintains strict separation of concerns: @bagisto-native/core contains Web Components and bridge controllers, while @bagisto-native/react offers thin React wrappers with no heavy abstractions. All APIs are production-ready and safe for SSR, checking runtime availability before DOM manipulation. This design ensures developers get powerful native capabilities without complexity, maintaining code simplicity and developer productivity. The philosophy centers on three key principles: Native First - prioritizing true native experiences over web wrappers, Headless First - separating frontend from backend for maximum flexibility, and Web → Native Bridge - seamlessly connecting existing web apps to native mobile functionality through Hotwire technology.

Next Steps

• Understand Native First
• Explore Headless First
• Learn about the Web → Native bridge