Why not just go straight to Vibe Coding?

Honestly, you could skip this and ask Cursor to generate a React Native app for you. If you only want a quick prototype and will hand it to someone more technical, that can work. This class still gives you a foundation so you understand components, state, layout, and navigation — which makes vibe coding faster and less mysterious when something breaks.

If you want to skip ahead to prototyping anyway: install Cursor, use Expo, and build with AI assistance. Native apps need a phone or simulator to test (unlike a simple web page you refresh in Chrome). Expo makes that path much easier than “bare” React Native.

What is React Native?

React Native lets you build iOS and Android apps using JavaScript (and React). You write one codebase that renders real native UI — not a website inside a browser shell (though Expo can also run on web for quick checks).

How it compares to front-end web:

• React (web) draws to the browser DOM with HTML/CSS
• React Native draws with native views: View, Text, Image, etc. There is no HTML
• StyleSheet + Flexbox replace most of CSS for layout
• JavaScript / TypeScript still drives logic, events, and data

Expo vs bare React Native:

• Expo (what we use) — fastest setup, Expo Go on your phone, great defaults for beginners
• Bare / React Native CLI — more native control, more setup (Xcode, Android Studio). Save this for later

Useful tools:

• Node.js & npm — run the Expo CLI and install packages
• Expo Go — scan a QR code and run your app on a physical phone
• iOS Simulator / Android Emulator — optional; great if you have Xcode or Android Studio
• Cursor or VS Code — edit your project files
• React Navigation — move between screens (Lesson 4)

What you will build

By the end of this course you can create multi-screen mobile apps with lists, forms, navigation, and a small game-style capstone — all in React Native with Expo.

Class Structure

• Build real stuff! Most lessons end with small apps you can run on your phone — not throwaway sandboxes.
• Self-paced. Fast or slow. Skip modules you already know; use cheat sheets to scan quickly.
• Modular. We assume little prior mobile experience. Coding 101 (JS / HTML / CSS) helps but is not required if you are willing to learn JS alongside RN.
• Learn, Do, Teach. Read the concept → build the project yourself → explain it to a friend.
• Try first, then Answers. Struggle productively, then check the Answers tab.

Course map

1. React Native Quick Start — Expo, Hello World, JSX, props, TextInput, useState
2. JavaScript for React Native — modern JS you need every day in RN
3. Screens & Layout — View, Text, StyleSheet, Flexbox, ScrollView, images
4. Interactivity & Navigation — Pressable, forms, FlatList, React Navigation
5. Capstone — Color Echo game + build your own app

Instructions

To start, flip through lessons, slides, cheat sheets, and the projects overview.

Every few days

• Skim past lessons so concepts stick
• Learn at least one new thing and run it on a device

After you finish, revisit materials monthly so you do not forget the patterns.