Interested in being a contributor? These instructions are here to help you get this repository set-up on your local machine for development purposes. They include instructions for running the app on your mobile device (Android or iOS). If you have difficulty, the React Native documentation on Setting up the Development Environment here, and the Expo documentation on Installation here are likely to be helpful.
As a developer, you will find these steps to be pretty standard. The only part that may be unusual is the .env file that needs to be created.
These instructions assume that you have installed:
Development of the Pinball Map App (pbm-react) is done using Expo. Expo is a platform for making universal native apps using Javascript and React Native. Expo runs on Android, iOS, and the web (the pbm website does not use Expo).
Fork this GitHub repository to your own GitHub account, then clone it to your local machine.
You will want to work against the master
branch to ensure that you are working against the most recent code.
Create a file called ”.env”, in the root directory of the project on your local machine. Open the file, “env_template” in this repo and follow its instructions to populate your newly-created .env file.
You may be able to get away with not setting up many of these depending on which functionality you want to work on.
.env Key Details
This drives the mapping visuals within the app. This is probably the most necessary API key out of this bunch.
Instructions for obtaining the necessary keys are here
MAPBOX_DOWNLOAD
is considered the secret key and will start with sk.
MAPBOX_PUBLIC
is considered the public key and will start with pk.
GOOGLE_MAPS_KEY
The Google Maps key is used for geocoding some searches (and when submitting new locations). Instructions for obtaining a Google Maps API key are here.:
IFPA_API_KEY
The IFPA key is used for the Events screen. Request an IFPA API Key here.
No key is needed. If your development process involves editing data (adding/removing machines, leaving comments, etc.) then do not use the production API endpoints. Instead, use the staging server. The staging server is not always turned on, so please ask us to turn it on.
Staging: API_URL='https://pbmstaging.com/api/v1'
Production: API_URL='https://www.pinballmap.com/api/v1'
SENTRY_AUTH_TOKEN
npm install
- Install all necessary dependenciesnpx expo run
- Build and run a local build- Choose the platform you want to run. It may take some time to build.
- You can also run a platform directly with
npx expo run:ios
ornpx expo run:android
- More details on local dev client builds are here
- or rather than
npx expo run
you can use Expo's EAS to build a Development Build. This will create a build that you install on your phone, then you run a server usingnpx expo start --clear
, scan the QR code, and launch the dev app. Review documentation here for instructions on EAS Development Builds.
If you are unable to successfully get set-up like this, or if you identify errors in these instructions, we'd love for you to file an issue or open a pull request.
If you receive an error upon launching the app that says something along the lines of you are using the bare workflow, where runtime policy versions are not supported.
you will need to adjust your app.config.js. Try replacing
runtimeVersion: {
policy: "sdkVersion",
},
with
runtimeVersion: "1.0.0",