CarsMap

A simple React Native mobile app displaying cars information in a list and on a map, similar to ridesharing applications. The cars' information is static, and stored in assets/locations.json

Table of Contents

• Getting Started
  • Requirements
• Development
  • Install Dependencies
  • Network Configuration
  • Running the Project
  • Debugging

Getting Started

git clone https://github.com/amadeuspham/CarsMapv2
cd CarsMapv2

Requirements

Instructions for setting up your development workstation and phone.

Workstation

Mac OSX:

• Install node v6+

  • npm v3+

• Install yarn for package management

npm install -g yarn

• Xcode
  • Xcode command line tools

xcode-select --install

Phone

This application uses a client app called Expo Client for viewing/live-reloading in development.

Go to the App Store on your iOS or Andriod device, and install the Expo Client app (iOS, Andriod).

Development

Run the project on your workstation and preview app on your phone or in Simulator.

Install dependencies

This will create a node_modules folder in your application's root directory and a lock file.

yarn install

Network configuration

If you are running the project on your iOS device, both the device and your workstation must be on the same network! See the Troubleshooting section below if you are experiencing issues.

Running the project

exp start

To view the app on your phone:

1. Open Expo Client on phone
2. Scan QR code presented in terminal

Alternatively, you can run the app in the Simulator on your macOS workstation, e.g:

yarn run ios

However, viewing this app on the Simulator is discouraged, since Google Maps will be slow and lagging on iOS Simulator.

Some screenshots of the application on iOS Simulator:

Debugging

Anything written to the console should print in the terminal.