[callaction url=”https://www.youtube.com/user/JPlaya01″ background_color=”#333333″ text_color=”#ffffff” button_text=”Go Now” button_background_color=”#e64429″]Subscribe To My Youtube Page[/callaction]
Overview
In this programming series I am going to show you how to create a real time Laravel app that shows the location of an android device on a Google map in real time. This design can easily be applied to iOS and I will cover it at a later date. This project will be constructed of three parts:
- Laravel app that handles registration/login, saves coordinates and timestamps
- Node Application that talks to Laravel application and android devices
- Android application that talks to node application
In this post I will create the Laravel + Node apps and I will write the Android app at a later post. The Laravel app is a run down version of my new application SocketDroid, an application that allows you to control android devices from a web panel. click a button and alert the Android device to send geolocation information back to the server and push it to the browser. The application will store the geolocation information in a database for later analysis if you so choose (in a later post I will expand upon the admin panel). The Laravel app will communicate with the Node app via Redis using the built-in Event system. From there the Node app will communicate with our devices via Socket.io. The Android device will listen on a websocket connection in a background service and listen for an event to start grabbing and posting GPS data, and another event to stop listening. Make sense so far? Good, let’s get started!
Scaffolding The Laravel Application
If you have followed any of my Laravel tutorials in the past, you know the drill, create a new application, and scaffold the authentication routes and views:
laravel new real-time-gps
cd real-time-gps
php artisan make:auth
Now we have a basic Laravel application with registration and login logic established. Let’s talk about database design for a moment shall we? This application is going to have 3 really important tables they are:
- Users (Already made for us be default)
- Devices
- Locations
- ActivationCodes
A user can have many devices, a device can have many locations and belongs to one user, and a location belong to one device, that is the basic relationship structure. Activation codes are for you guessed it activating devices to use the app. Go ahead and create the relations and models for devices and locations using the following commands:
php artisan make:model -m Device
php artisan make:model -m Location
php artisan make:model -m ActivationCodeDevice Model
Open up the devices migration file and add the following content to the up() function:
Schema::create('devices', function (Blueprint $table) {
$table->increments('id');
$table->string('uuid');
$table->integer('user_id')->unsigned();
$table->foreign('user_id')->references('id')->on('users')->onDelete('cascade');
$table->timestamps();
});
The only things we need to know about devices are who they belong to and what channel they are listening on. We also want to make sure that when a user account is deleted from the database, that all of their devices are also removed from the database. Now open up the Device model (app/Device.php), there are three things we need to do with this model, the first is tell it which parameters to accept when inserting into the database. The second thing is to tell the model about its relation to the User model, while the third is to tell the model about it’s relation to the Location model. The finished version should look like this:
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Device extends Model
{
//
protected $guarded = [];
public function user(){
return $this->belongsTo('App\User');
}
public function locations(){
return $this->hasMany('App\Location');
}
}
The Device model and migration is now complete, now on to the Location model and migration.
Location Model
Open up the location migration file and in its up() function we are going to add the following:
Schema::create('locations', function (Blueprint $table) {
$table->increments('id');
$table->string('lat');
$table->string('long');
$table->integer('device_id')->unsigned();
$table->foreign('device_id')->references('id')->on('devices')->onDelete('cascade');
$table->timestamps();
});
Hopefully by now you understand what is going on, we are saving the lat/long acquired from the device, as well as its id. Using this information we can associate geolocations with independent devices. Next we will open up the Location(app/Location.php) model, tell it which properties to fill, and it’s relation to the Device model.
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Location extends Model
{
//
public $guarded = [];
public function device(){
return $this->belongsTo('App\Device');
}
}
User Model
The only thing we need to do the user model is make it aware of it’s new device relation open up the User(app/User.php) model and add the following function:
public function devices(){
return $this->hasMany('App\Device');
}
ActivationCode Model
The activation code model is responsible for storing the activation code given from the Android device on app installation to register the device with your account. It will take in the UUID of the device and the activation code, open up the migration file and add the following:
public function up()
{
Schema::create('activation_codes', function (Blueprint $table) {
$table->increments('id');
$table->string('uuid');
$table->string('code');
$table->timestamps();
});
}
Now open up the ActivationCode(app/ActivationCode.php) model and add the following:
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class AuthCode extends Model
{
//
public $guarded = [];
}
That’s all that’s needed you can now run your migrations!
php artisan migrate
In the next lesson we will be creating the views and front end logic needed to visualize the devices on a Google map!