February 2024 Summaries

Callum Hemsley, a tech lead at Theodo and organizer of React Native London, discusses the development of an offline-first expenses tracker app using Legend State and Expo. Emphasizing the benefits of a local-first approach to counter connectivity issues in app development, the app enables users to add expenses from any device, syncing data locally and uploading to the cloud once online for seamless updates. Hemsley highlights the distinction between offline-first and local-first technologies, where offline-first preserves changes made offline for later synchronization, and local-first prioritizes local data as the primary source of truth. Throughout the development process, Legend State's offline-first capabilities, along with Expo's support, allow for efficient data persistence and remote synchronization using Firebase Realtime Database. The app's performance is tested under various scenarios, demonstrating effective real-time syncing upon reconnection. While challenges remain in data ownership and privacy, the project showcases the potential of local-first apps in providing user-friendly, anytime-anywhere functionality, encouraging exploration of the local-first movement.

On June 20, 2024, Google will discontinue the Firebase Cloud Messaging (FCM) Legacy API, transitioning to the FCM V1 API for Android push notifications, which will impact notifications sent through Expo Push Notifications, although iOS notifications will remain unaffected. In early March, Expo will announce updates that allow sending Android notifications via the FCM V1 API on an opt-in basis, requiring a few re-authentication steps for the new API, with detailed guidance provided during the launch. Expo encourages users to reach out on Discord for support and offers resources, including a Supabase video tutorial, to help users unfamiliar with Expo push notifications understand the setup process, which simplifies the handling of device information and communication with both FCM and Apple Push Notification Service (APNs). Expo's approach allows for consistent handling of Android and iOS notifications, streamlining both front-end and back-end processes, and provides documentation for setting up, obtaining credentials, and testing push notifications, making it easy to enhance user interaction with applications.

The blog post discusses the integration of @expo/fingerprint with GitHub Actions to enhance the management of native code changes in React Native projects. It introduces expo-github-action/fingerprint, which helps identify differences in native code fingerprints across pull requests, and an experimental GitHub action, expo-github-action/preview-build, that initiates new builds via EAS Build when changes are detected. The post also details challenges faced while using GitHub Actions Caches with SQLite for tracking fingerprints, such as immutability and branch-specific scopes, and describes solutions like using concurrency settings and updating caches only upon merging pull requests into the main branch. Despite these hurdles, the author encourages users to try @expo/fingerprint, emphasizing its potential to optimize development workflows and invites feedback to improve its application in various scenarios.

SDK 50 introduces the capability to build applications for Apple TV and Android TV using Expo modules, expanding the possibilities for developers who previously could not include these modules in TV apps. Previously, React Native for TV allowed developers to create TV applications, but integrating Expo features was not possible until now. The guide demonstrates how to create a TV app using the Ignite CLI, which includes libraries like react-navigation and MobX, replacing the react-native dependency with a React Native for TV package. The process involves configuring the app for TV, removing unsupported dependencies, and using a TV config plugin to adjust native files for TV compatibility. Developers are encouraged to try the IgniteTV example, which showcases TV-specific features such as focus APIs and improved layout designs. Future plans for Expo TV apps include potential support for Expo Router, expo-dev-client, and additional third-party libraries, with an invitation for feedback from developers on their experiences.

Expo SDK 50 introduces expo-camera/next, an updated version of one of Expo's oldest libraries, aligning it with modern native platform best practices for accessing device cameras in mobile apps. This update streamlines the library by removing niche features such as face detection and complex lower-level camera APIs, opting instead for Google's CameraX on Android, which simplifies implementation and enhances reliability across various devices. The new version also improves barcode scanning, incorporates the DataScannerViewController API for iOS 16+, and allows configuration through props to ensure consistent image quality without flicker during picture or video capture. While fundamental changes like renaming the component to CameraView are minimal, the expo-camera/next remains in beta during SDK 50, encouraging user feedback before the legacy API is deprecated in SDK 51.

Expo has introduced a new set of development tools plugins for the Expo CLI, marking a shift away from Flipper, which no longer has first-party support in React Native. These plugins, available with Expo SDK 50, are designed to be easy to use and develop, and are housed in the expo/dev-plugins repository. By adapting existing Flipper plugins and third-party tools, Expo has streamlined the migration process, avoiding the need for complete rewrites. The core structure of these dev tools includes an App Adapter, a Web UI, and a Communication Message Bus using WebSocket for interaction between components. A significant challenge was transitioning the Web UI from Flipper's sophisticated React-based components to a broader web technology environment, allowing developers to leverage any web technology for dev tool UI creation. The initiative encourages community participation, offering tools to create custom plugins and inviting feedback to enhance the developer experience, with special recognition given to the foundational work of Flipper plugin creators.

Expo has introduced a new tool called @expo/fingerprint, designed to streamline app development processes in React Native by generating a unique hash that encapsulates a project's native characteristics. This innovation addresses common challenges such as determining whether a pull request includes native code changes, assessing compatibility with production app runtime, and deciding if a development build is necessary. By utilizing the command `npx @expo/fingerprint@latest`, developers can quickly obtain a comprehensive overview of their project's native setup, enabling the detection of native changes through a single succinct hash value. The tool is designed for speed, precision, and customizability, supporting both Expo CLI projects and bare React Native apps. Additionally, it offers API integration for programmatic use, supports diffing to identify changes, and reads a .fingerprintignore file for excluding irrelevant files. Expo is seeking community feedback to refine @expo/fingerprint and plans to integrate it with EAS services, providing a seamless experience for automated decision-making regarding app updates and builds.