Skip to main content

Getting started

ProductionReadyForms is a React Native boilerplate. This means that it is a mobile app project with many things pre-setup for you.

info

đź’ˇ It is built on top of a pure React Native project. If something isn't specified in these docs you can jump to React Native docs or docs for a specific package and search for solutions there.

Setting up the development environment​

If you haven’t already then prepare your environment to run React Native project.

Depending on the platform you’ll need different tools. Please go with the “React Native CLI Quickstart” path on Environment Setup - React Native docs.

Install yarn (yarn docs) or npm package manager for this project. For the examples, I will be using yarn.

Get ProductionReadyForms code​

To get the project you have to purchase it and download the package from Gumroad.

You don’t need an account on Gumroad to make a purchase. Yet I recommend creating one. Having an account allows them to access their purchases through their Gumroad Library anytime.

If you choose to create an account, you can do so before or after the purchase.

Step by step guide - download and unzip the package​

  1. buy on Gumroad,
  2. download package with the project from receipt using the “Start coding!” button or from your Gumroad Library,
    1. your license is only applicable to you so never share the package,
  3. unzip the project into your desired location,
  4. at this point, you can rename the unzipped folder to represent your app name,
  5. open the project’s folder with your favourite code editor (VSCode recommended).

Start coding​

Install dependencies​

In order to run the project, you have to download all the dependencies.

Enter the unzipped folder with the command line and run the yarn command (or npm install).

cd prf_20xx-xx-xx_xx-xx # enter your unzipped folder
yarn # download dependencies

Start the app​

To start the project first-run

yarn start # this command starts metro bundler

Now depending on the platform, you want to work on, you can run one of the two commands. It will work only if your environment is properly prepared (e.g. Xcode with iOS simulator downloaded, or java and Android emulator configured).

Android​

yarn android # to run project on android emulator/device

iOS​

cd ./ios
pod install # to install all iOS dependencies, you need cocoapods installed first
cd..
yarn ios # to run project on iOS simulator/device

Troubleshooting​

No simulator available with name "iPhone [something]".​

Freshly installed React Native environment might complain about the lack of a default version of the iPhone. For example error No simulator available with the name "iPhone 12".

To solve this, use the following:

xcrun simctl list devices

A list of available devices should appear e.g.

â–¶ xcrun simctl list devices
== Devices ==
-- iOS 16.2 --
iPhone SE (3rd generation) (C3269987-83AA-403A-8074-FBAE9858AB1E) (Shutdown)
iPhone 14 (D9960F72-2C30-4FEE-81E6-AFE39B9ACD29) (Shutdown)
iPhone 14 Plus (DCDB346E-C91D-46D9-9B84-7DCA5D88F283) (Shutdown)
iPhone 14 Pro (D405BC75-2E08-4ED9-9D84-B4C103A681D2) (Shutdown)
...

Specify the existing simulator as a param to run the app:

yarn ios --simulator="iPhone 14"