React native Multi Screen Starter with Expo

Multi Screen Starter with Expo

react native / expo / react navigation v4.

Out of the Box

  • Expo SDK 40
  • React Navigation v4 & Theme Support!
  • iOS 13 Appearance Support (with react-native-appearance)
  • Preloading/caching local assets
  • SVG custom icon usage
  • Checker for the iOS notch: iPhoneX, iPhoneXs, iPhoneXr, iPhoneXs Max

install

First, make sure you have Expo CLI installed: npm install -g expo-cli

Install: yarn or yarn install

Run Project Locally: expo start or yarn dev

development on a physical device

  • first, your machine and physical device should be on the same wifi connection
  • make sure you have Expo CLI installed globally, if not run:
    • npm install -g expo-cli
  • then navigate to this project's directory on your machine and run:
    • yarn dev or expo start
  • now download the Expo Client app on your preferred physical device:
  • scan the QR code generated when this project build started (expo start)
    • android users: the QR scanner is built within the Expo Client app! ?
    • ios 11 and later: you can open your camera app to scan the QR code, apple made the Expo peeps remove the QR scanner from the app for some reason... ?
    • ios 10 and below: i wrote about a work around to get expo running on older iOS devices
  • having issues? check the installation page for any pitfalls you may have.

linting

  • run: yarn lint for a list of linting warnings/error in cli
  • prettier and airbnb config
  • make sure you have prettier package installed:
  • then make sure to enable these options (packages → prettier):
    • eslint integration
    • stylelint integration
    • automatic format on save (toggle format on save)
  • be aware of the .prettierignore file

GitHub