CodeBlanks Logo Icon CodeBlanks
Login Register
Free 4 levels

React Native

Learn mobile app development with React Native 0.7x and Expo from basics to expert level.

The React Native course covers all levels with JSX, components, hooks, navigation, API, native modules, the new architecture (JSI, Fabric) and performance engineering.

  • 362 lessons
  • 30 h 43 min
  • 10 projects
Start for free View curriculum

No account needed, you can start right away. To save your progress, create a free account

Levels

The React Native course goes from zero to expert in four levels. Start at any level you like.
Not sure of your level? Take the placement test
Beginner

Learn React Native and Expo fundamentals: components, JSX, props, style and Flexbox.

  • React Native basics
  • JSX
  • Components
  • TextInput
116 lessons · 9 h 44 min See lessons →
Intermediate

Learn hooks, context, form management, API requests and navigation patterns in React Native.

  • Hooks
  • Custom hooks
  • Context
  • useReducer
116 lessons · 9 h 59 min See lessons →
Advanced

Learn push notifications, camera, maps, offline support and native module integration in React Native.

  • Push notifications
  • Camera
  • Image picker
  • Location
83 lessons · 7 h 0 min See lessons →
Expert

Learn the new architecture (JSI, Fabric, TurboModules), performance engineering and large-scale app architectures in React Native.

  • New architecture
  • Performance engineering
  • App architecture
  • Monorepo
47 lessons · 4 h 0 min See lessons →

Projects you will build

At every level you combine what you learned into a real page.
Counter app Beginner · 5 lessons To-do app Beginner · 5 lessons Weather app Beginner · 5 lessons Beginner final Beginner · 5 lessons Notes app Intermediate · 5 lessons Quiz app Intermediate · 5 lessons E-commerce Intermediate · 5 lessons Intermediate final Intermediate · 5 lessons Advanced final Advanced · 5 lessons Expert final Expert · 5 lessons

How does it work?

Short explanation

Each lesson explains one concept in a few short cards; no long videos or walls of text.

Try it right away

Multiple choice, fill-in-the-blank and matching exercises lock in what you just learned.

Write it yourself

You write real code in the in-browser editor; it is checked instantly and you see the result live.

Curriculum

62 groups · 362 lessons · 30 h 43 min

Learn React Native and Expo fundamentals: components, JSX, props, style and Flexbox.

1
React Native basics
6 lessons · 26 min
  1. 1 What is React Native? Learn that React Native is a mobile app development framework. 4 min
  2. 2 Expo setup Learn to create a React Native project with Expo CLI. 5 min
  3. 3 Your first component Learn to write your first component with View and Text. 4 min
  4. 4 App.js Learn the App.js structure and export default. 4 min
  5. 5 Running Learn to run the app with Expo start. 4 min
  6. 6 Summary - React Native basics Combine View, Text and App.js to write your first mobile app. 5 min
2
JSX
6 lessons · 27 min
  1. 1 What is JSX? Learn JSX syntax and HTML-like writing in JavaScript. 4 min
  2. 2 Expressions Learn JavaScript expressions in JSX with {}. 4 min
  3. 3 Component tree Learn nested component trees with JSX. 5 min
  4. 4 Self-closing Learn self-closing tags and empty components. 4 min
  5. 5 Conditional rendering Learn conditional rendering with && and ternary. 5 min
  6. 6 Summary - JSX Combine expressions, nested components and conditional rendering to write a profile card. 5 min
3
Components
6 lessons · 29 min
  1. 1 Functional components Learn to define functional components. 4 min
  2. 2 Props Learn to pass data to components with props. 5 min
  3. 3 Children Learn child components with the children prop. 5 min
  4. 4 Multiple props Learn to pass multiple props. 5 min
  5. 5 Component reuse Learn to reuse components. 5 min
  6. 6 Summary - Components Combine props, children and reuse to write a card component. 5 min
4
Project: Counter appProject
5 lessons · 30 min
  1. 1 Project design Design the structure of the counter app and write the skeleton code. 6 min
  2. 2 useState Learn counter state with useState. 6 min
  3. 3 Increment and decrement Add increment and decrement buttons. 6 min
  4. 4 TouchableOpacity Learn touch with TouchableOpacity. 6 min
  5. 5 Putting it together Combine all parts into a working counter. 6 min
5
TextInput
6 lessons · 29 min
  1. 1 TextInput Learn to take user input with TextInput. 4 min
  2. 2 onChangeText Learn text changes with onChangeText. 5 min
  3. 3 Controlled input Learn controlled input and state. 5 min
  4. 4 placeholder Learn placeholder and keyboardType. 5 min
  5. 5 Secure text Learn password fields with secureTextEntry. 5 min
  6. 6 Summary - TextInput Combine onChangeText, controlled and placeholder to write a form field. 5 min
6
Style
6 lessons · 28 min
  1. 1 style prop Learn to style components with the style prop. 4 min
  2. 2 StyleSheet.create Learn style objects with StyleSheet.create. 5 min
  3. 3 Color and font Learn color, fontSize and fontWeight. 4 min
  4. 4 Margin and padding Learn spacing with margin and padding. 5 min
  5. 5 border Learn borderWidth, borderColor and borderRadius. 5 min
  6. 6 Summary - Style Combine StyleSheet, color and spacing to write a business card. 5 min
7
Flexbox
6 lessons · 30 min
  1. 1 flexDirection Learn layout direction with flexDirection. 5 min
  2. 2 justifyContent Learn main-axis alignment with justifyContent. 5 min
  3. 3 alignItems Learn cross-axis alignment with alignItems. 5 min
  4. 4 flex Learn flexible sizing with flex: 1. 5 min
  5. 5 flexWrap Learn wrapping behavior with flexWrap. 5 min
  6. 6 Summary - Flexbox Combine flexDirection, justifyContent and alignItems to write a menu bar. 5 min
8
Buttons
6 lessons · 29 min
  1. 1 Button Learn the Button component and its onPress. 4 min
  2. 2 TouchableOpacity Learn touch feedback with TouchableOpacity. 5 min
  3. 3 Pressable Learn advanced touch with Pressable. 5 min
  4. 4 onPress and onPressIn Learn onPress, onPressIn and onPressOut events. 5 min
  5. 5 disabled Learn to disable buttons with the disabled prop. 5 min
  6. 6 Summary - Buttons Combine Button, TouchableOpacity and disabled to write an action panel. 5 min
9
Project: To-do appProject
5 lessons · 30 min
  1. 1 App design Design the structure of the to-do app. 6 min
  2. 2 Adding tasks Learn to add tasks with TextInput. 6 min
  3. 3 Task list Write the task list with FlatList. 6 min
  4. 4 Completing tasks Add a completion toggle. 6 min
  5. 5 Putting it together Combine all parts into a working to-do app. 6 min
10
Lists
6 lessons · 30 min
  1. 1 FlatList Learn to render efficient lists with FlatList. 5 min
  2. 2 renderItem Learn to render each item with renderItem. 5 min
  3. 3 keyExtractor Learn unique keys with keyExtractor. 5 min
  4. 4 SectionList Learn grouped lists with SectionList. 5 min
  5. 5 List header and footer Learn ListHeaderComponent and ListFooterComponent. 5 min
  6. 6 Summary - Lists Combine FlatList, renderItem and keyExtractor to write a student list. 5 min
11
ScrollView
6 lessons · 29 min
  1. 1 ScrollView Learn scrollable areas with ScrollView. 5 min
  2. 2 horizontal Learn horizontal scrolling with the horizontal prop. 4 min
  3. 3 contentContainerStyle Learn content styling with contentContainerStyle. 5 min
  4. 4 onScroll Learn the scroll event with onScroll. 5 min
  5. 5 RefreshControl Learn pull-to-refresh with RefreshControl. 5 min
  6. 6 Summary - ScrollView Combine ScrollView, horizontal and RefreshControl to write a gallery. 5 min
12
Images
6 lessons · 29 min
  1. 1 Image Learn to display images with the Image component. 4 min
  2. 2 source Learn local and remote images with the source prop. 5 min
  3. 3 resizeMode Learn image scaling with resizeMode. 5 min
  4. 4 ImageBackground Learn background images with ImageBackground. 5 min
  5. 5 Image size Learn width, height and aspectRatio. 5 min
  6. 6 Summary - Images Combine Image, source and resizeMode to write a profile image. 5 min
13
State
6 lessons · 30 min
  1. 1 useState Learn state management with useState. 5 min
  2. 2 State update Learn to update state with setState. 5 min
  3. 3 Previous state Learn to derive new state from previous state. 5 min
  4. 4 Multiple state Learn multiple state variables. 5 min
  5. 5 Object state Learn object state management. 5 min
  6. 6 Summary - State Combine useState, previous state and object state to write a form. 5 min
14
Events
6 lessons · 29 min
  1. 1 onPress Learn the press event with onPress. 4 min
  2. 2 onLongPress Learn long press with onLongPress. 5 min
  3. 3 Event parameters Learn event handler parameters. 5 min
  4. 4 onLayout Learn layout events with onLayout. 5 min
  5. 5 Form events Learn form submission and validation events. 5 min
  6. 6 Summary - Events Combine onPress, onLongPress and form events to write a feedback form. 5 min
15
Project: Weather appProject
5 lessons · 30 min
  1. 1 App design Design the structure of the weather app. 6 min
  2. 2 Data model Set up the weather data model. 6 min
  3. 3 Display Display the temperature and condition. 6 min
  4. 4 City selection Add city selection. 6 min
  5. 5 Putting it together Combine all parts into a working weather app. 6 min
16
Navigation
6 lessons · 30 min
  1. 1 React Navigation Learn the React Navigation library. 5 min
  2. 2 Stack navigator Learn page transitions with the Stack navigator. 5 min
  3. 3 navigate Learn to transition with navigation.navigate. 5 min
  4. 4 params Learn to pass data between screens with params. 5 min
  5. 5 Back button Learn the back button and goBack. 5 min
  6. 6 Summary - Navigation Combine Stack, navigate and params to write a two-screen app. 5 min
17
Alerts
6 lessons · 29 min
  1. 1 Alert Learn to show alerts with Alert.alert. 4 min
  2. 2 Alert buttons Learn alert buttons and callbacks. 5 min
  3. 3 Toast Learn toast messages. 5 min
  4. 4 Modal Learn custom dialogs with the Modal component. 5 min
  5. 5 Modal animation Learn modal animationType. 5 min
  6. 6 Summary - Alerts Combine Alert, Toast and Modal to write a confirmation dialog. 5 min
18
Platform
6 lessons · 30 min
  1. 1 Platform.OS Learn OS detection with Platform.OS. 5 min
  2. 2 Platform.select Learn platform-specific styles with Platform.select. 5 min
  3. 3 Platform.Version Learn version detection with Platform.Version. 5 min
  4. 4 File extension Learn platform-specific files with .ios.js and .android.js. 5 min
  5. 5 Platform-specific components Learn to write platform-specific components. 5 min
  6. 6 Summary - Platform Combine Platform.OS, select and file extension to write a platform-compatible component. 5 min
19
Async Storage
6 lessons · 30 min
  1. 1 AsyncStorage Learn persistent data storage with AsyncStorage. 5 min
  2. 2 setItem Learn to write data with AsyncStorage.setItem. 5 min
  3. 3 getItem Learn to read data with AsyncStorage.getItem. 5 min
  4. 4 removeItem Learn to delete data with AsyncStorage.removeItem. 5 min
  5. 5 JSON serialize Learn to store objects with JSON.stringify and parse. 5 min
  6. 6 Summary - Async Storage Combine setItem, getItem and JSON to write a settings system. 5 min
20
Beginner finalProject
5 lessons · 30 min
  1. 1 Project design Design the skeleton of the beginner final mini app. 6 min
  2. 2 Components Set up View, Text and TextInput components. 6 min
  3. 3 State and events Write interaction with useState and onPress. 6 min
  4. 4 Navigation Combine two screens with Stack navigation. 6 min
  5. 5 Putting it together Combine all parts into a working final app. 6 min

Learn hooks, context, form management, API requests and navigation patterns in React Native.

1
Hooks
6 lessons · 30 min
  1. 1 useEffect Learn side effects with useEffect. 5 min
  2. 2 Dependency array Learn the useEffect dependency array. 5 min
  3. 3 Cleanup Learn the useEffect cleanup function. 5 min
  4. 4 useRef Learn mutable references with useRef. 5 min
  5. 5 useMemo Learn memoization with useMemo. 5 min
  6. 6 Summary - Hooks Combine useEffect, useRef and useMemo to write a timer. 5 min
2
Custom hooks
6 lessons · 30 min
  1. 1 Custom hook Learn to write custom hooks. 5 min
  2. 2 useToggle Learn to write the useToggle custom hook. 5 min
  3. 3 useCounter Learn the useCounter custom hook. 5 min
  4. 4 usePrevious Learn the usePrevious custom hook. 5 min
  5. 5 Hook composition Learn to compose hooks. 5 min
  6. 6 Summary - Custom hooks Combine useToggle, useCounter and usePrevious to write a hook library. 5 min
3
Context
6 lessons · 30 min
  1. 1 What is Context? Learn global state with the Context API. 5 min
  2. 2 createContext Learn to create a context with createContext. 5 min
  3. 3 Provider Learn to provide values with Context.Provider. 5 min
  4. 4 useContext Learn to consume context with useContext. 5 min
  5. 5 Context default Learn context default values and fallback. 5 min
  6. 6 Summary - Context Combine createContext, Provider and useContext to write a theme system. 5 min
4
Project: Notes appProject
5 lessons · 30 min
  1. 1 Project design Design the structure of the notes app. 6 min
  2. 2 Note model Set up the Note model and state. 6 min
  3. 3 Adding notes Write the add note form. 6 min
  4. 4 AsyncStorage Save notes with AsyncStorage. 6 min
  5. 5 Putting it together Combine all parts into a working notes app. 6 min
5
useReducer
6 lessons · 30 min
  1. 1 useReducer Learn complex state management with useReducer. 5 min
  2. 2 Reducer function Learn to write a reducer function. 5 min
  3. 3 Action dispatch Learn to dispatch actions with dispatch. 5 min
  4. 4 Initial state Learn the useReducer initial state. 5 min
  5. 5 useReducer vs useState Learn the difference between useReducer and useState. 5 min
  6. 6 Summary - useReducer Combine reducer, dispatch and initial state to write a shopping cart. 5 min
6
Form handling
6 lessons · 30 min
  1. 1 Controlled form Learn the controlled form component. 5 min
  2. 2 Form state Learn form state management. 5 min
  3. 3 Validation Learn form validation. 5 min
  4. 4 Submit Learn form submit and onSubmit. 5 min
  5. 5 Form libraries Learn form libraries like react-hook-form. 5 min
  6. 6 Summary - Form handling Combine controlled, validation and submit to write a registration form. 5 min
7
API and fetch
6 lessons · 30 min
  1. 1 fetch Learn HTTP requests with the fetch API. 5 min
  2. 2 GET request Learn to make GET requests with fetch. 5 min
  3. 3 async/await Learn fetch with async/await. 5 min
  4. 4 JSON parse Learn JSON parsing with response.json(). 5 min
  5. 5 Error handling Learn fetch error handling. 5 min
  6. 6 Summary - API and fetch Combine fetch, async/await and error handling to write a user viewer. 5 min
8
Project: Quiz appProject
5 lessons · 30 min
  1. 1 Quiz model Design the Question model and state. 6 min
  2. 2 Loading questions Learn to load questions with fetch. 6 min
  3. 3 Running the quiz Write the flow that shows questions in turn. 6 min
  4. 4 Score calculation Write the score calculation screen. 6 min
  5. 5 Putting it together Combine all parts into a working quiz app. 6 min
9
Tab navigation
6 lessons · 30 min
  1. 1 Bottom Tabs Learn the Bottom Tabs navigator. 5 min
  2. 2 createBottomTabNavigator Learn tab navigation with createBottomTabNavigator. 5 min
  3. 3 Tab icons Learn tab bar icons. 5 min
  4. 4 Material Top Tabs Learn the Material Top Tabs navigator. 5 min
  5. 5 Tab badge Learn tab badge and notifications. 5 min
  6. 6 Summary - Tab navigation Combine Bottom Tabs, icons and badge to write a 4-tab app. 5 min
10
Drawer navigation
6 lessons · 30 min
  1. 1 Drawer navigator Learn the Drawer navigator. 5 min
  2. 2 createDrawerNavigator Learn drawer navigation with createDrawerNavigator. 5 min
  3. 3 Drawer items Learn drawer items and customization. 5 min
  4. 4 Drawer toggle Learn to open/close the drawer. 5 min
  5. 5 Nested navigation Learn to nest Stack and Drawer. 5 min
  6. 6 Summary - Drawer navigation Combine Drawer, items and nested to write a menu app. 5 min
11
Lifecycle
6 lessons · 30 min
  1. 1 Mount Learn the component mount event. 5 min
  2. 2 Update Learn the component update event. 5 min
  3. 3 Unmount Learn the component unmount event. 5 min
  4. 4 useEffect lifecycle Learn lifecycle with useEffect. 5 min
  5. 5 Layout effect Learn the difference between useLayoutEffect and useEffect. 5 min
  6. 6 Summary - Lifecycle Combine mount, update and unmount to write a resource manager. 5 min
12
Project: E-commerceProject
5 lessons · 30 min
  1. 1 Project design Design the structure of the e-commerce app. 6 min
  2. 2 Product list Write the product list with FlatList. 6 min
  3. 3 Product detail Write the product detail screen. 6 min
  4. 4 Cart Write cart management with Context. 6 min
  5. 5 Putting it together Combine all parts into a working e-commerce app. 6 min
13
Animated
6 lessons · 30 min
  1. 1 Animated.Value Learn animation values with Animated.Value. 5 min
  2. 2 Animated.View Learn animated components with Animated.View. 5 min
  3. 3 Animated.timing Learn timing animations with Animated.timing. 5 min
  4. 4 Animated.spring Learn spring animations with Animated.spring. 5 min
  5. 5 interpolate Learn value ranges with interpolate. 5 min
  6. 6 Summary - Animated Combine Animated.Value, timing and interpolate to write a sliding card. 5 min
14
Gestures
6 lessons · 30 min
  1. 1 PanResponder Learn touch gestures with PanResponder. 5 min
  2. 2 onMoveShouldSetPanResponder Learn onMoveShouldSetPanResponder. 5 min
  3. 3 onPanResponderMove Learn dragging with onPanResponderMove. 5 min
  4. 4 onPanResponderRelease Learn release with onPanResponderRelease. 5 min
  5. 5 react-native-gesture-handler Learn the react-native-gesture-handler library. 5 min
  6. 6 Summary - Gestures Combine PanResponder and gesture handler to write a draggable card. 5 min
15
Theme
6 lessons · 30 min
  1. 1 Light/dark theme Learn light and dark theme management. 5 min
  2. 2 Theme context Learn theme management with Context. 5 min
  3. 3 Theme toggle Learn the theme toggle button. 5 min
  4. 4 useColorScheme Learn the system theme with useColorScheme. 5 min
  5. 5 Persistent theme Learn persistent theme with AsyncStorage. 5 min
  6. 6 Summary - Theme Combine Context, toggle and persistent theme to write a theme system. 5 min
16
Performance
6 lessons · 30 min
  1. 1 React.memo Learn memoization with React.memo. 5 min
  2. 2 useCallback Learn callback memoization with useCallback. 5 min
  3. 3 useMemo Learn computation memoization with useMemo. 5 min
  4. 4 FlatList optimization Learn FlatList performance optimization. 5 min
  5. 5 InteractionManager Learn smooth interaction with InteractionManager. 5 min
  6. 6 Summary - Performance Combine React.memo, useCallback and useMemo to write an optimized list. 5 min
17
Testing
6 lessons · 30 min
  1. 1 Jest Learn the Jest test framework. 5 min
  2. 2 React Native Testing Library Learn the React Native Testing Library. 5 min
  3. 3 render Learn to render components with render. 5 min
  4. 4 getByText Learn to find elements with getByText. 5 min
  5. 5 fireEvent Learn to trigger events with fireEvent. 5 min
  6. 6 Summary - Testing Combine Jest, RNTL and fireEvent to write a component test. 5 min
18
Dev tools
6 lessons · 29 min
  1. 1 Flipper Learn the Flipper mobile debug tool. 4 min
  2. 2 React DevTools Learn the component tree with React DevTools. 5 min
  3. 3 Console Learn console.log and console.warn. 5 min
  4. 4 Remote debug Learn remote JS debugging. 5 min
  5. 5 Performance monitor Learn the performance monitor and FPS. 5 min
  6. 6 Summary - Dev tools Combine Flipper, DevTools and console to write a debug session. 5 min
19
Permissions
6 lessons · 30 min
  1. 1 What are permissions? Learn the mobile app permissions concept. 5 min
  2. 2 expo-permissions Learn to ask for permissions with expo-permissions. 5 min
  3. 3 Camera permission Learn to ask for camera permission. 5 min
  4. 4 Location permission Learn to ask for location permission. 5 min
  5. 5 Notification permission Learn to ask for notification permission. 5 min
  6. 6 Summary - Permissions Combine expo-permissions and camera/location permissions to write a permission flow. 5 min
20
Intermediate finalProject
5 lessons · 30 min
  1. 1 Project design Design the skeleton of the intermediate final mini app. 6 min
  2. 2 Context and hooks Set up data management with Context and custom hooks. 6 min
  3. 3 API integration Write API integration with fetch. 6 min
  4. 4 Navigation Combine Tab and Stack navigation. 6 min
  5. 5 Putting it together Combine all layers into a working app. 6 min

Learn push notifications, camera, maps, offline support and native module integration in React Native.

1
Push notifications
6 lessons · 30 min
  1. 1 expo-notifications Learn push notifications with expo-notifications. 5 min
  2. 2 Token retrieval Learn to get push tokens. 5 min
  3. 3 Local notifications Learn to send local notifications. 5 min
  4. 4 Remote notifications Learn to receive notifications from a remote server. 5 min
  5. 5 Notification events Learn notification taps and events. 5 min
  6. 6 Summary - Push notifications Combine token, local and remote notifications to write a notification system. 5 min
2
Camera
6 lessons · 30 min
  1. 1 expo-camera Learn camera access with expo-camera. 5 min
  2. 2 Camera permission Learn to ask for camera permission. 5 min
  3. 3 Taking pictures Learn to take pictures with takePictureAsync. 5 min
  4. 4 Front/back camera Learn to switch between front and back cameras. 5 min
  5. 5 Flash Learn flash and torch modes. 5 min
  6. 6 Summary - Camera Combine expo-camera, takePictureAsync and flash to write a camera app. 5 min
3
Image picker
6 lessons · 30 min
  1. 1 expo-image-picker Learn gallery access with expo-image-picker. 5 min
  2. 2 Gallery permission Learn to ask for gallery permission. 5 min
  3. 3 launchImageLibraryAsync Learn to pick images with launchImageLibraryAsync. 5 min
  4. 4 launchCameraAsync Learn to get images from camera with launchCameraAsync. 5 min
  5. 5 Image processing Learn to process and display selected images. 5 min
  6. 6 Summary - Image picker Combine expo-image-picker and gallery/camera selection to write a profile photo app. 5 min
4
Location
6 lessons · 30 min
  1. 1 expo-location Learn location access with expo-location. 5 min
  2. 2 Location permission Learn to ask for location permission. 5 min
  3. 3 getCurrentPositionAsync Learn the current location with getCurrentPositionAsync. 5 min
  4. 4 watchPositionAsync Learn location tracking with watchPositionAsync. 5 min
  5. 5 Geocoding Learn geocoding and reverse geocoding. 5 min
  6. 6 Summary - Location Combine expo-location, getCurrentPositionAsync and watchPositionAsync to write a location tracking app. 5 min
5
Maps
6 lessons · 30 min
  1. 1 react-native-maps Learn to display maps with react-native-maps. 5 min
  2. 2 MapView Learn the MapView component and initialRegion. 5 min
  3. 3 Marker Learn to mark locations with Marker. 5 min
  4. 4 onRegionChange Learn map panning with onRegionChange. 5 min
  5. 5 Custom marker Learn custom marker design. 5 min
  6. 6 Summary - Maps Combine MapView, Marker and onRegionChange to write a map app. 5 min
6
Offline support
6 lessons · 30 min
  1. 1 NetInfo Learn network state with NetInfo. 5 min
  2. 2 Offline cache Learn the offline cache strategy. 5 min
  3. 3 Sync Learn to sync when online. 5 min
  4. 4 Conflict resolution Learn conflict resolution. 5 min
  5. 5 Retry queue Learn retry queue and backoff. 5 min
  6. 6 Summary - Offline support Combine NetInfo, cache and sync to write an offline-first app. 5 min
7
Secure storage
6 lessons · 30 min
  1. 1 expo-secure-store Learn secure storage with expo-secure-store. 5 min
  2. 2 setItemAsync Learn secure writes with setItemAsync. 5 min
  3. 3 getItemAsync Learn secure reads with getItemAsync. 5 min
  4. 4 deleteItemAsync Learn secure deletion with deleteItemAsync. 5 min
  5. 5 Token storage Learn secure auth token storage. 5 min
  6. 6 Summary - Secure storage Combine setItemAsync, getItemAsync and token storage to write an auth system. 5 min
8
Authentication
6 lessons · 30 min
  1. 1 Auth context Learn authentication with an Auth context. 5 min
  2. 2 Login Learn the login screen and flow. 5 min
  3. 3 JWT token Learn JWT token management. 5 min
  4. 4 Protected routes Learn protected routes and navigation guards. 5 min
  5. 5 Logout Learn logout and token cleanup. 5 min
  6. 6 Summary - Authentication Combine context, JWT and protected routes to write an auth flow. 5 min
9
State management
6 lessons · 30 min
  1. 1 What is Redux? Learn the Redux state management framework. 5 min
  2. 2 Redux Toolkit Learn simplified Redux with Redux Toolkit. 5 min
  3. 3 Slice Learn state slices with createSlice. 5 min
  4. 4 useDispatch Learn to dispatch actions with useDispatch. 5 min
  5. 5 useSelector Learn to read state with useSelector. 5 min
  6. 6 Summary - State management Combine createSlice, useDispatch and useSelector to write a counter. 5 min
10
Zustand
6 lessons · 30 min
  1. 1 Zustand Learn lightweight state management with Zustand. 5 min
  2. 2 create Learn to create stores with create. 5 min
  3. 3 Reading state Learn to read state from a Zustand store. 5 min
  4. 4 Action Learn to define Zustand actions. 5 min
  5. 5 Middleware Learn Zustand middleware (persist). 5 min
  6. 6 Summary - Zustand Combine create, action and persist to write a persistent counter. 5 min
11
Reanimated
6 lessons · 30 min
  1. 1 react-native-reanimated Learn the react-native-reanimated library. 5 min
  2. 2 useSharedValue Learn shared values with useSharedValue. 5 min
  3. 3 useAnimatedStyle Learn animated styles with useAnimatedStyle. 5 min
  4. 4 withTiming Learn timing animations with withTiming. 5 min
  5. 5 withSpring Learn spring animations with withSpring. 5 min
  6. 6 Summary - Reanimated Combine useSharedValue, useAnimatedStyle and withTiming to write an animated card. 5 min
12
Native modules
6 lessons · 30 min
  1. 1 What are native modules? Learn the native module concept. 5 min
  2. 2 NativeMethods Learn native calls with NativeMethods. 5 min
  3. 3 Platform-specific Learn platform-specific native modules. 5 min
  4. 4 Native events Learn native events and emitters. 5 min
  5. 5 TurboModules Learn TurboModules and the new architecture. 5 min
  6. 6 Summary - Native modules Combine NativeMethods, events and TurboModules to write a native bridge. 5 min
13
CI/CD
6 lessons · 30 min
  1. 1 EAS Build Learn cloud builds with EAS Build. 5 min
  2. 2 EAS Submit Learn store submission with EAS Submit. 5 min
  3. 3 eas.json Learn the eas.json configuration. 5 min
  4. 4 GitHub Actions Learn CI with GitHub Actions. 5 min
  5. 5 OTA update Learn OTA (over-the-air) updates. 5 min
  6. 6 Summary - CI/CD Combine EAS Build, eas.json and OTA updates to write a release pipeline. 5 min
14
Advanced finalProject
5 lessons · 30 min
  1. 1 Project design Design the skeleton of the advanced final mini app. 6 min
  2. 2 Auth and API Write auth context and API integration. 6 min
  3. 3 Native features Add camera, location and notification native features. 6 min
  4. 4 Offline Add offline support and caching. 6 min
  5. 5 Putting it together Combine all layers into a working mini service app. 6 min

Learn the new architecture (JSI, Fabric, TurboModules), performance engineering and large-scale app architectures in React Native.

1
New architecture
6 lessons · 30 min
  1. 1 What is the new architecture? Learn the React Native new architecture. 5 min
  2. 2 JSI Learn the JSI (JavaScript Interface) concept. 5 min
  3. 3 Fabric Learn the Fabric renderer. 5 min
  4. 4 TurboModules Learn TurboModules and JSI-based modules. 5 min
  5. 5 Codegen Learn Codegen and automatic code generation. 5 min
  6. 6 Summary - New architecture Combine JSI, Fabric and TurboModules to write a new architecture summary. 5 min
2
Performance engineering
6 lessons · 30 min
  1. 1 Profiling Learn profiling and performance measurement. 5 min
  2. 2 React Profiler Learn the React Profiler and render times. 5 min
  3. 3 Bottleneck Learn performance bottleneck detection. 5 min
  4. 4 List optimization Learn FlatList and SectionList optimization. 5 min
  5. 5 Memory leaks Learn memory leak detection and prevention. 5 min
  6. 6 Summary - Performance engineering Combine Profiler, bottleneck and memory leak to write a perf report. 5 min
3
App architecture
6 lessons · 30 min
  1. 1 Feature-based Learn feature-based architecture. 5 min
  2. 2 Layered Learn layered architecture. 5 min
  3. 3 Clean architecture Learn clean architecture principles. 5 min
  4. 4 Repository pattern Learn the repository pattern. 5 min
  5. 5 Dependency injection Learn dependency injection. 5 min
  6. 6 Summary - App architecture Combine feature-based, clean and repository to write an architecture skeleton. 5 min
4
Monorepo
6 lessons · 30 min
  1. 1 What is a monorepo? Learn the monorepo concept. 5 min
  2. 2 Yarn workspaces Learn monorepos with Yarn workspaces. 5 min
  3. 3 npm workspaces Learn monorepos with npm workspaces. 5 min
  4. 4 Turborepo Learn monorepo management with Turborepo. 5 min
  5. 5 Shared packages Learn shared packages and code sharing. 5 min
  6. 6 Summary - Monorepo Combine Yarn workspaces, Turborepo and shared packages to set up a monorepo. 5 min
5
Accessibility
6 lessons · 30 min
  1. 1 accessibilityLabel Learn accessible labels with accessibilityLabel. 5 min
  2. 2 accessibilityRole Learn roles with accessibilityRole. 5 min
  3. 3 accessibilityHint Learn hints with accessibilityHint. 5 min
  4. 4 accessibilityState Learn state with accessibilityState. 5 min
  5. 5 VoiceOver and TalkBack Learn the VoiceOver and TalkBack screen readers. 5 min
  6. 6 Summary - Accessibility Combine Label, Role, Hint and VoiceOver to write an accessible button. 5 min
6
Internationalization
6 lessons · 30 min
  1. 1 What is i18n? Learn the internationalization (i18n) concept. 5 min
  2. 2 i18next Learn the i18next library. 5 min
  3. 3 Translation files Learn translation JSON files. 5 min
  4. 4 useTranslation Learn the useTranslation hook. 5 min
  5. 5 Language switching Learn language switching and persistence. 5 min
  6. 6 Summary - Internationalization Combine i18next, useTranslation and language switching to write a multilingual app. 5 min
7
Security
6 lessons · 30 min
  1. 1 Code obfuscation Learn code obfuscation and minification. 5 min
  2. 2 API key security Learn API key and secret management. 5 min
  3. 3 Certificate pinning Learn certificate pinning. 5 min
  4. 4 Anti-tamper Learn anti-tamper and jailbreak detection. 5 min
  5. 5 Secure coding Learn secure coding principles. 5 min
  6. 6 Summary - Security Combine obfuscation, API key and pinning to write a secure app. 5 min
8
Expert finalProject
5 lessons · 30 min
  1. 1 Project design Design the skeleton of the expert final mini app. 6 min
  2. 2 New architecture Write components with the new architecture (JSI, Fabric). 6 min
  3. 3 Performance Add performance profiling and optimization. 6 min
  4. 4 Monorepo Set up monorepo structure and shared packages. 6 min
  5. 5 Putting it together Combine all expert topics into a working mini app. 6 min

Lessons are free, an account keeps your progress

You do not have to sign up. If you do, you continue where you left off and never lose your work.

  • Progress saved on every device
  • Earn XP and badges
  • Keep your daily streak
  • Get a certificate when you finish
create a free account

Frequently asked questions

Are the React Native lessons free?

Yes. All 362 lessons of the React Native course are free and you can start without an account.

Do I need any prior knowledge?

No. The beginner level starts from zero; a browser is all you need. If you already know the basics, start at a higher level.

How long does the course take?

Lessons take 2–8 minutes. The whole course is about 31 hours; with 15–20 minutes a day you can finish in a few months.

Do I get a certificate?

Yes. When you complete the course with a free account, a verifiable certificate is issued in your name.

Will I lose my progress without an account?

Without an account your progress is kept only in your current browser. When you create a free account it is moved to your account.

Next step Dart

Learn Dart 3 from null safety, records, pattern matching and async to expert level with hands-on projects.