1. Project Overview
2. Features
3. Architecture
4. Configuration
5. Error handling
6. Detailed docs

This mobile application📱 showcases the capabilities of the OneEntry CMS with React Native. All app data is sourced from OneEntry. You can customize it to meet your requirements by modifying in the CMS. In this application, you will find the use of all the functional features of OneEntry, fully available on both Android and iOS.

This app provides a fully immersive shopping experience with all essential e-commerce features. Start by registering for an account, and dive into a comprehensive, flexible catalog of products complete with powerful search options, extensive filtering, and organizational tools. Users can add products to their favorites and cart, with state managed on the server to support consistency across sessions.

Home	Catalog	Order	Profile	Menu

All interactions with the OneEntry CMS in this application are powered by the OneEntry SDK for JavaScript, ensuring seamless integration and efficient data handling. Additionally, most of the app's content is editable directly through the CMS.

This application is built using the Expo framework, allowing for streamlined development across both iOS and Android platforms. For optimal functionality, the app is configured to work with Expo Prebuild. The layout leverages Tailwind CSS (via NativeWind). Push notifications built in for both platform and can be sent and customized directly from the OneEntry CMS and FCM.

• 📝 User creation: Register users via different providers (email, phone) and customize which data to store.
• ✅ User Activation: Activate users via code, such as through email verification code.
• 🔄 State Management: Utilize Redux Toolkit for effective state management.
• 🛒 Efficient Shop Catalog: Easily manage an unlimited number of products in the catalog.
• 🔍 Advanced Filtering: Apply a variety of filters to the product catalog for better organization and search.
• 💡 Product Recommendations: Display various selections of products.
• 🖼️ Block Content: Using entities of the "Block" type from CMS.
• 📋 Feedback Forms: Include customizable feedback forms with captcha protection to prevent spam.
• 💳 Order Creation and Purchases: Complete transactions using Stripe for secure, seamless payments.
• 📜 Order History: View past purchases and maintain a record of all transactions.
• 📬 Event Notifications: Allow users to subscribe to events via email, push notifications, and WebSocket.
• 🚀 TypeScript Integration: The project is beginner-friendly and uses lightweight TypeScript for development.
• 🎨 Tailwind: User-friendly layout comprehensible to everyone.

• Auth-related and content-related logic/components are strictly separated to avoid ambiguity.
• Pages (/src/pages) act as layout containers with minimal logic, delegating functionality to components.

• Components are nested under domain-specific folders (e.g., components/content/PrepareOrderScreen).
• Example:
• PrepareOrderScreen → components/content/PrepareOrderScreen/ItemsInOrderList

• Feature-specific hooks (e.g., usePrepareOrderData) are colocated with their components:
• hooks/content/PrepareOrderScreen/usePrepareOrderData
• Shared hooks (universal logic) live in hooks/shared/.

• Reusable components/hooks are isolated in /shared folders (e.g., components/shared/Rating).

Open the .env file and fill the variables with your project data

Configure push notifications. Add google-services.json and GoogleService-Info.plist files to project root. Detailed instruction for Push Notifications setup you can see in our Documentation.

Configure app.json.

Install project dependencies using yarn.

yarn install

To verify your project is set up correctly, use the following Expo command:

npx expo-doctor

This will identify any configuration issues and ensure your environment is properly configured for development.

To run the app with Expo Prebuild, use the following commands:

Note: This app requires native dependencies and will not work with Expo Go.

Android:

npx expo run:android

iOS:

npx expo run:ios

Running the app with Expo Prebuild will create dedicated android and ios folders in your project for native code.

If you prefer to avoid managing native code, consider using Expo Application Services (EAS), which allows for custom builds without needing direct access to these native folders.

After completing all these steps, your app should run correctly. If you encounter any issues, we've created a guide to help you troubleshoot common errors.

First, try running doctor with the following command to check for any issues:

npx expo-doctor

If you encounter errors with Firebase during an Android build, try updating the <meta-data> tags in your AndroidManifest.xml as follows:

Replace:

<meta-data android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="default"/>
<meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/notification_icon_color"/>
<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/>

with:

<meta-data tools:replace="android:value" android:name="com.google.firebase.messaging.default_notification_channel_id" android:value="default"/>
<meta-data tools:replace="android:resource" android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/notification_icon_color"/>
<meta-data tools:replace="android:resource" android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/>

For iOS, ensure you are using the latest version of Xcode and iOS.

This is the central hub for all documentation. Below are links to specific sections.

• Authorization Documentation
• Covers login, sign-up, token management, and account activation.

• Orders Documentation
• Details order creation, tracking, and transaction handling.

• Events Documentation
• Explains real-time updates and event triggers.

• State Documentation
• Describes user state management and synchronization.

In case of any issues or questions, you can post: GitHub discussion for React Native