MENU


React Native

Cordova and Framework7 built BookNest as a web app: HTML, CSS and JavaScript running inside a WebView, with Cordova 129 supplying the native shell. That approach reuses everything you know about the browser, but the screen your users touch is still a web page. React Native 36,878 takes the other road. You still write JavaScript and React 7,897 components, yet every <View> and <Text> becomes a real Android View or iOS UIView, laid out and drawn by the platform itself. Scrolling, text input, gestures and accessibility behave exactly like those of an app written in Kotlin or Swift, because underneath they are the same widgets.

React Native has changed more in the last three years than in the seven before them. The asynchronous "bridge" that defined the framework for a decade is gone. In its place is the New Architecture: the JavaScript Interface (JSI), the Fabric renderer and TurboModules, running in bridgeless mode on the Hermes 11,328 engine. Much of what you find in older tutorials, from class components to NativeModules calls with callbacks, still works through compatibility layers but is no longer how new apps are written. This chapter teaches the current platform: React Native 0.87 and Expo SDK 57 6,418 , the framework that the React Native team itself recommends for new projects.

You will rebuild BookNest from scratch: a catalog with a detail screen, a reading-notes editor and a cart with a checkout form. The chapter starts with the core components and APIs (views, text, images, lists, touch, animation and the platform-specific modules), then adds the libraries a production app needs: Expo Router 6,418 for navigation, TanStack Query 79,069 and Zustand 58,763 for data and state, React Hook Form 351,018 with Zod 44,027 for forms, Reanimated 11,010 and Gesture Handler 6,788 for motion, and Expo's modules for authentication, notifications, maps and the camera. It ends with testing, debugging, performance work and publishing to Google Play 1 and the App Store 10 . Every Android screen in the chapter is a real screenshot from an emulator; iOS steps come from Apple's and Expo's documentation and are marked as not run here.

The chapter assumes the React from MERN Stack Development (JSX, props, state and hooks) and the flexbox from Front-End Web Development. Where React Native departs from the web, the text says so; where it does not, it points you back rather than re-teaching.

What you will learn

Sections