https://github.com/saibbyweb/Realtime-Location-Tracking-NativeScript-Vue

A working, cross platform, realtime location tracking mobile app made with NativeScript and Vue, under 350 lines of code.
https://github.com/saibbyweb/Realtime-Location-Tracking-NativeScript-Vue

Last synced: about 1 month ago
JSON representation

A working, cross platform, realtime location tracking mobile app made with NativeScript and Vue, under 350 lines of code.

• Host: GitHub
• URL: https://github.com/saibbyweb/Realtime-Location-Tracking-NativeScript-Vue
• Owner: saibbyweb
• Created: 2019-01-26T17:29:53.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2022-04-09T18:25:51.000Z (about 2 years ago)
• Last Synced: 2024-02-15T03:34:21.540Z (5 months ago)
• Language: JavaScript
• Homepage: https://medium.com/saibbyweb/building-a-real-time-location-tracking-app-with-nativescript-vue-under-350-lines-of-code-8b51ad40d657
• Size: 43.2 MB
• Stars: 46
• Watchers: 3
• Forks: 12
• Open Issues: 5
• Metadata Files:
  • Readme: README.md

Lists

• awesome-nativescript - Realtime Location Tracking App with NativeScript + Vue - A working, cross platform, realtime location tracking mobile app made with NativeScript and Vue, under 350 lines of code. (Open Source)
• awesome-nativescript-vue - Realtime Location tracking app with Nativescript + Vue

README

        
# A Cross Platform, Real-time Location Tracking app made with NativeScript-Vue under 350 lines of code

## Prerequisites

 1) Setup your machine to compile apps as directed in this [Nativescript-Vue Installation Manual](https://nativescript-vue.org/en/docs/getting-started/installation/)

 2) Obtain a key from [Google Cloud Console](https://console.cloud.google.com/google/maps-apis/overview) having access to the following APIs:

    - [Maps SDK for Android](https://developers.google.com/maps/documentation/android-sdk/intro) 

    - [Maps SDK for iOS](https://developers.google.com/maps/documentation/ios-sdk/get-api-key)

    - [Directions API](https://developers.google.com/maps/documentation/directions/start)

    - [Distance Matrix API](https://developers.google.com/maps/documentation/distance-matrix/get-api-key)

> Google Cloud Console will ask you to create a project before you can gain access to the APIs. Once you have created a project and a key is issued for an API, subsequent enabled APIs will be accessible using the same key which was issued for the first one. That means, the 4 APIs listed above can have one single key if falling under the same project, which exactly is the case with this app.

 3) Setting up the API key

    Now that we have got our precious key with all required APIs enabled, we can proceed by feeding this key to both Android and iOS.

  - **For Android** : Modify `AndroidManifest.xml` located at `app/App_Resources/Android/src/main/AndroidManifest.xml` and insert this between `` tags.

      ```

      

      ```

  - **For iOS**: Add the following snippet at the top of main.js

      ```

      import * as platform from 'platform'  

      if (platform.isIOS) { 

        GMSServices.provideAPIKey("PUT_API_KEY_HERE")

      }

      ```

## Usage

``` bash

# Install dependencies

npm install

# Build for production

tns build  --bundle

# Build, watch for changes and debug the application

tns debug  --bundle

# Build, watch for changes and run the application

tns run  --bundle

```