[Tutorial] Cara Mengirim Data Serial Arduino ke Firebase Melalui Node JS Server dan Akses Melalui Android

Pada tutorial kali ini saya akan mendemokan cara mengirim data serial arduino ke firebase melalui Node JS Server dan dapat diakses melalui Android. Pertama hal yang kita butuhkan yaitu sebuah framework Node JS, kemudian buatlah akun atau project baru di database google yaitu Firebase.com dan membuat project baru di sini : https://console.firebase.google.com/?pli=1 . 

Pertama, yaitu akses firebase console seperti ini

Kemudian buat project baru

Setelah itu buatlah seperti dibawah ini :

dengan rincian : data a bernilai 100 dan data b bernilai 100, nilai tidak boleh kosong harus terisi sebagai data awal.

Jangan lupa ubah pada aturan menjadi true semua :

Setelah itu untuk list program Arduino berikut ini :

ArduinoNodeJSFirebaseAndroid:

// Potmeter vars

const int analogInPin = A0;

int sensorValue = 0; // value read from the potmeter

int prevValue = 0; // previous value from the potmeter

void setup() {

// initialize serial communication at 9600 bits per second:

Serial.begin(9600);

}

// the loop routine runs over and over again forever:

void loop() {

// Potmeter

sensorValue = analogRead(analogInPin);

// read the analog in value:

if(prevValue != sensorValue){

Serial.print("B"); // begin character

Serial.print(sensorValue*5);

Serial.print(",");

Serial.print(sensorValue);

Serial.println("E"); // end character

prevValue = sensorValue;

}

delay(500); // Berikan waktu delay pengiriman minimal 1/2 detik.

}

Tahap Selanjutnya yaitu coding untuk node JS:

firebase.js :

var serialport = require("serialport");
var SerialPort = serialport.SerialPort;
var Firebase = require("firebase");

var dataKiri = new Firebase('https://monitoringserial.firebaseio.com/a');
var dataKanan = new Firebase('https://monitoringserial.firebaseio.com/b');

var receivedData ;
var sendData;
var serialPort = new SerialPort("COM7", { // Menggunakan COM 6
baudrate: 9600,
parser: serialport.parsers.readline("\n")
});

serialPort.on("open", function () { // Komunikasi serial dibuka
console.log('open');

serialPort.on('data', function(data) { //Menerima dan Mengirim data ke Arduino

receivedData += data.toString();
//console.log(receivedData);

if (receivedData .indexOf('E') >= 0 && receivedData .indexOf('B') >= 0) {
sendData = receivedData .substring(receivedData .indexOf('B') + 1, receivedData .indexOf('E'));
receivedData="";
k=sendData.split(",");
var a=k[0];
var b=k[1];
console.log("nilai A ="+a);
console.log("nilai B ="+b);

dataKiri.set(a);
dataKanan.set(b);

}

});
});

save coding di atas di users/dimas/firebase.js (ganti nama "dimas" dengan nama user PC anda)

Tahap Selanjutnya uji dengan node JS Server apakah sudah dapat terkirim ke firebase. Namun, terlebih dahulu install serial port pada node JS Server:

Buka command prompt node JS, dan masukkan kode "npm install --save-dev serialport@3.1.2"

Tunggu Proses nya :

Jika sudah selesai, lanjutkan dengan perintah : "npm install serialport@3.1.2"

Kemudian install firebase versi 2.4.2 dengan perintah : "npm install firebase@2.4.2" (referensi : https://libraries.io/npm/firebase/2.4.2)

Kemudian jalankan file : "node firebase.js"

Hasilnya seperti ini :

Tahap Berikutnya yaitu program Java di Android Studio :

Sebelum mulai mengcoding java, kalian harus mengaktifkan dulu firebase pada project android anda pada menu project structure dan pastikan laptop/PC anda sudah terkoneksi dengan wifi atau sedang online. Berikut ini :

Setelah itu kalian dapat memulai memprogram java dan XML nya

activity main.xml :

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout 

 xmlns:android="http://schemas.android.com/apk/res/android" 

 xmlns:tools="http://schemas.android.com/tools" 

 android:layout_width="match_parent"    

 android:layout_height="match_parent"    

 android:paddingBottom="@dimen/activity_vertical_margin"    

 android:paddingLeft="@dimen/activity_horizontal_margin"    

 android:paddingRight="@dimen/activity_horizontal_margin"    

 android:paddingTop="@dimen/activity_vertical_margin"    

 tools:context="com.example.dimas.firebaseandroid.MainActivity">

<TextView        

  android:layout_width="wrap_content"        

  android:layout_height="wrap_content"        

  android:textAppearance="?android:attr/textAppearanceLarge"        

  android:text="Large Text"        

  android:id="@+id/textView"        

  android:layout_centerHorizontal="true" 

/>

<TextView        

  android:layout_width="wrap_content"        

  android:layout_height="wrap_content"        

  android:textAppearance="?android:attr/textAppearanceLarge"        

  android:text="Large Text"        

  android:id="@+id/textView2"        

  android:layout_below="@+id/textView"        

  android:layout_alignLeft="@+id/textView"        

  android:layout_alignStart="@+id/textView"        

  android:layout_marginTop="155dp" />
</RelativeLayout>

Kemudian pada bagian Java :
mainactivity.java:

package com.example.dimas.firebaseandroid;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;

import com.firebase.client.DataSnapshot;
import com.firebase.client.Firebase;
import com.firebase.client.FirebaseError;
import com.firebase.client.ValueEventListener;

public class MainActivity extends AppCompatActivity {

    Firebase a,b;
    Button btnOn,btnOff;
    TextView datain1,datain2;
    @Override    

    protected void onCreate(Bundle savedInstanceState) 

    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        datain1=(TextView)findViewById(R.id.textView);
        datain2=(TextView)findViewById(R.id.textView2);
        Firebase.setAndroidContext(this);
        a = new Firebase("https://monitoringserial.firebaseio.com/a");
        b= new Firebase("https://monitoringserial.firebaseio.com/b");

        a.addValueEventListener(new ValueEventListener() {
            @Override            

            public void onDataChange(DataSnapshot snapshot) {
                System.out.println(snapshot.getValue());  
                Toast.makeText(getBaseContext(), "MASUK", Toast.LENGTH_SHORT).show();
                datain1.setText(snapshot.toString());
            }
            @Override 

            public void onCancelled(FirebaseError error) { }
        });

        b.addValueEventListener(new ValueEventListener() {
            @Override            

             public void onDataChange(DataSnapshot dataSnapshot1) {
                System.out.println(dataSnapshot1.getValue());  
                Toast.makeText(getBaseContext(), "MASUK", Toast.LENGTH_SHORT).show();
                datain2.setText(dataSnapshot1.toString());
            }

            @Override            

             public void onCancelled(FirebaseError firebaseError){ }
        });
    }
}

berikut hasilnya :