React Native is a fast and efficient way to build iOS and Android apps.
- Share code, often 80-90% of the codebase.
- The same designers and developers can contribute to the web app and mobile app.
- Save a file and see app reload.
- Use existing text editor.
- The compiled apps are native and performant.
Even so, React Native has many parts to be learned, some optional. Reducing the early decisions to make can help build momentum and confidence. This article describes a MacOS laptop setup and Vim configuration for React Native to help folks get to working software faster.
Follow these decisions
Yes, from the beginning:
- React Navigation
Soon, very soon:
Not now, maybe later:
- Flow or TypeScript
brew update brew install node brew install watchman brew cask install expo-xde brew upgrade brew cleanup brew cask cleanup npm install prettier --global
Develop using Expo XDE
Expo XDE was previously installed via Homebrew Cask. Open it now.
Create an account or sign in. Create a new project from their dropdown menu. This will download the appropriate files and build the project.
Test the app on your phone
Download the Expo Client iPhone app. Open it.
From within the Expo Client app, scan the project's QR code in the Expo XDE.
Expo Client reloads the app on your phone!
Configure your text editor
For Vim, install these plugins:
" Auto-format on save augroup fmt autocmd! autocmd BufWritePre *.js,*.jsx Neoformat prettier augroup END
Edit the codebase in a text editor
Edit a file such as
screens/HomeScreen.js in Vim.
Save the file.
Prettier re-formats it on save! (no linting necessary)
Expo Client reloads the app on your phone!Edit this article