React Native

Creating a New RN App

2 options - Expo or React Native CLI

Expo

• Third party service (free) but with paid premium features
• "Managed app development"
• Easier to use; less friction in getting it up and running
• Can "eject" to leave the ecosystem anytime

React Native CLI

• By the React Native team and community
• Bare-bones - more flexible but also means you have to do more work to get it running
• Less features
• Slightly better integration with native source code

For most cases, start with Expo to scaffold and prototype your app. If required, can eject to RN at anytime.

Basics

• Use FlatList or SectionList instead of ScrollView for long pieces of data as ScrollView renders everything - even things not on the screen.

// 2 props = data & renderItem (how it's gonna loop through the data)

const FlatListBasics = () => {
  return (
    <View style={styles.container}>
      <FlatList
        data={[{ key: "Devin" }, { key: "Dan" }]}
        renderItem={({ item }) => <Text style={styles.item}>{item.key}</Text>}
      />
    </View>
  );
};

Links