Welcome to the world of React Native! As we dive into 2023, it’s important to stay up to date on the latest trends in this dynamic framework. React Native has quickly become a go-to choice for developers seeking to create robust, high-performance mobile apps. With its flexibility and ease of use, React Native continues to evolve and shape the mobile app development landscape. In this article, we’ll explore some of the latest trends in React Native and how they’re transforming the way we build mobile apps. From new libraries to emerging technologies, we’ll take a deep dive into what’s next for React Native in 2023. So, grab a cup of coffee and let’s get started!
Starting with version 0.71, a TypeScript app will be generated by default when you start a new React Native project using the React Native CLI. Your IDE will support you in writing typed code right immediately because the new project has been configured with a tsconfig.json right out of the box.
npx react-native init My71App --version 0.71.0
When you run above, you’ll get a TypeScript app by default!
The following styles have had feature enhancements to adapt specific CSS styles:
alt
, tintColor
, crossOrigin
, height
, referrerPolicy
, src
, srcSet
, and width
.autoComplete
, enterKeyHint
, inputMode
, readOnly
, and rows
.aspectRatio
now supports string valuesfontVariant
now supports space-separated string valuesfontWeight
now supports number valuestransform
now supports string valuesThe following aliases have been added to shadow existing React Native styles:
This comes with an opt-in implementation of PointerEvents
Once enabled, the following handlers on View
will support hover:
onPointerOver
, onPointerOut
onPointerEnter
, onPointerLeave
These events are also implemented in Pressability
for new opt-in support for hover.
“The best ideas are the result of good collaboration.” — Malcolm Gladwell
The “Click to inspect” option in React Dev Tools’ top left corner enables you to click on an item in the app to get an in-depth analysis of it in Dev Tools, much as the Chrome element inspector.
To examine which React components align with which on-screen items, use the component highlighting option in the DevTools app. This will highlight the element you selected.
Fabric is React Native’s new rendering system. Based on user comments and reports, this update significantly improves the experimental New Architecture experience.
Decreased build times: The new distribution strategy makes use of Maven Central, which enables to significantly shorten the Android build time, fix a number of Windows build issues, and offer a more seamless New Architecture experience(Read more here).
Write less C++ code: The CLI app template has been cleared of all the C++ code and the CMake files, and you may now enable the New Architecture without adding any C++ code to your app(Read more here).
Better encapsulation of iOS app setup: On iOS, we followed a similar approach to Android and encapsulated most of the logic to set up the New Architecture in the RCTAppDelegate class, which will simplify upgrades in the future with fewer manual breaking changes.
Better dependency management on iOS: For library managers, there’s a new install module dependencies function that you can call inside of your package podspec to install all of the New Architecture’s necessary dependencies.
In conclusion, React Native continues to be a driving force in the mobile app development space, and the trends we’ve explored in this article show no signs of slowing down. As we look ahead to the rest of 2023 and beyond, we can expect to see even more innovation and advancements in this powerful framework. Developers who stay up to date on the latest trends and technologies in React Native will be better equipped to build high-quality mobile apps that meet the evolving needs of users. Whether you’re a seasoned developer or just getting started with React Native, there’s never been a better time to explore what this framework has to offer. So, here’s to a bright future for React Native and the exciting developments yet to come!
Source: Medium