Mat Warger - @mwarger
Over a decade of experience constructing software across startups and enterprises.
Why Expo?
React Native is a way to develop applications for native platforms using React. Expo abstracts away the complexity of React Native.
Expo's library of packages is a massive win. Multiple libraries are provided to accomplish most things you'd want to do.
Expo's Application Services (EAS) is a fantastic way to provide building, deployment, and code updates to ship apps quickly.
expo install `dependency`
Using expo install will ensure compatibility between the dependency version and the expo version.
npx expo init
npm install --global expo-cli
npx create-expo-app my-app
npx create-nx-workspace
npm install @nrwl/expo
nx generate @nrwl/expo:application my-app
npx ignite-cli@next new my-app --yes
# Mac Only
brew install cocoapods
sudo gem inst ffi -- --disable-system-libffi
App creation boilerplate
Components and Navigation
API URLs
Base URL for Expo client
Network Call Debugging
import Constants from 'expo-constants'
const { manifest } = Constants
let apiHost = ''
const endpoint = Constants.manifest?.extra?.apiUrl ?? ''
reactotron.log?.('endpoint', endpoint)
if (__DEV__) {
apiHost =
typeof manifest?.packagerOpts === `object` && manifest.packagerOpts.dev
? manifest.debuggerHost?.split(`:`).shift()?.concat(`:4200`)
: endpoint
// add http if not present
if (!apiHost.startsWith('http')) {
apiHost = `http://${apiHost}`
}
} else {
apiHost = endpoint
}
import 'dotenv/config';
let Config = {
apiUrl: process.env.API_ENDPOINT,
enableHiddenFeatures: true,
}
if (process.env.APP_ENV === 'production') {
Config.apiUrl = 'https://api.production.com'
Config.enableHiddenFeatures = false
} else if (process.env.APP_ENV === 'staging') {
Config.apiUrl =
'https://conference-demos-git-develop-mwarger.vercel.app'
Config.enableHiddenFeatures = true
}
API and Debugging