get out of my swamp!
Shrexpo is an opinionated, curated set of tools for building React Native applications.
- System requirements: https://docs.expo.io/get-started/installation/#requirements
- expo CLI installed:
npm install -g expo-cli - If testing on emulator (installation of required tooling will take 1 hour at absolute minimum, likely a good bit longer; possibly a day if you need to update XCode (if you need to test on iOS))
- Emulators set up per platform
- https://docs.expo.io/workflow/android-studio-emulator/
- for setting shell env vars, if using zsh on macos, you may need to set said vars in
.zshrc, not.zshenv. For some reason, on running through that doc, said vars weren't set when using.zshenvon macos 11
- for setting shell env vars, if using zsh on macos, you may need to set said vars in
- https://docs.expo.io/workflow/ios-simulator/
- Comprehensive guide, covrering both platforms: https://reactnative.dev/docs/environment-setup
- https://docs.expo.io/workflow/android-studio-emulator/
- Emulators set up per platform
- If testing on physical device
- Expo Go App Installed: https://docs.expo.io/get-started/installation/#2-expo-go-app-for-ios-and
expo init my-project -t https://github.com/BigRoomStudios/shrexpo- or, for a specific branch:
expo init my-project -t https://github.com/BigRoomStudios/shrexpo/tree/BRANCH-NAME - for additional customization, see https://docs.expo.io/workflow/expo-cli/#expo-init
- or, for a specific branch:
cd my-project && expo start(ornpm start) — the Expo dev tools GUI should open in a new tab- Open the app
- if running on a simulator, in your terminal, press the key corresponding to the platform you want to test on (
ifor iOS,afor Android)- If this errors out, saying something like
Couldn't start project on Android: No Android connected device found, and no emulators could be started automatically, try opening Android Studio, then running the Virtual Device first
- If this errors out, saying something like
- if running on a device, scan the QR code shown in the dev tools tab
- if running on a simulator, in your terminal, press the key corresponding to the platform you want to test on (
You should see the base app running on your test device of choice!
...
Files should be named with dash-case.js except in the case of containers or components, which should use PascalCase.js. This includes reducer, action, and action-type files. Filenames need not repeat information specified by their directory names. For example, containers/Counter.js or containers/Counter/index.js are preferred over containers/CounterContainer.js or containers/CounterContainer/CounterContainer.js. The container may still be required into a file using the "full name" e.g.,
const CounterContainer = require('./containers/Counter');Omitting the .js extension in calls to require() is preferred, as it allows one to transition a simple module at components/Counter.js to a complex module with its own internals at components/Counter/index.js without affecting how it is referenced.
We favor the hapi style guide. Yes, even when coding for the browser! The idea is to maintain fluency for developers who work both on the server and in the browser. It is supposed to be the same language, after all! Node and V8 move fast enough on their own, so we plan to keep up-to-date with that ecosystem rather than the hyperspeed with which transpilers make available incompletely-spec'd JS features. It's worth noting that for the time being that includes ES6 modules. We additionally have some standard React lint rules. Just npm run lint to see how you're doing!
...
Tests are automatically picked-up by Jest. You may add tests under any directory named __test__ or in files suffixed .spec.js or .test.js. If you wish to run a coverage report, run npm test -- --coverage.
...