Back to Learning

React Native from Scratch

Mobile 40 min read Beginner–Intermediate
Ad Block

Build a fully functional cross-platform mobile app using Expo and React Native. We'll cover navigation, state management, API calls, and how to publish to the App Store and Google Play.

React Native Expo TypeScript Expo Router React Query

What You'll Build

A news reader app that fetches live articles from a public API, displays them in a polished list, and allows bookmarking with local persistence.

1

Bootstrap with Expo

Create a new Expo app with TypeScript support, configure ESLint and Prettier, and run it on a simulator or physical device.

2

File-Based Routing with Expo Router

Set up tab navigation and stack navigation using the file-based routing system — no configuration required.

3

Fetch Data with React Query

Connect to a REST API, handle loading and error states, and implement pull-to-refresh and pagination.

4

Local Storage with MMKV

Persist bookmarks locally using MMKV, the fastest key-value store for React Native.

5

Build & Submit

Use EAS Build to create production binaries and EAS Submit to publish to both app stores.

npx create-expo-app@latest NewsApp \
  --template blank-typescript

cd NewsApp
npx expo install expo-router react-native-safe-area-context \
  react-native-screens @tanstack/react-query react-native-mmkv

Heads up: Make sure you have Node.js 18+ and the Expo Go app installed on your phone for the fastest development experience.

More Tutorials → AI Apps Tutorial →
Ad Block