analytics_and_ionic

Google Analytics e Ionic Framework

O Google Analytics é um serviço gratuito do Google para monitoramento e análise do comportamento dos usuários de sua aplicação, seja ela um site ou um app mobile. Quem já trabalhou com web provavelmente já o utilizou em algum momento, mas no contexto de aplicativos, principalmenete os híbridos, pouco se é dito a respeito dele.

Entender os fluxos que o usuário segue, quais ações ele executa, quanto tempo ele passa na aplicação, etc. são de extrema importância para sabermos onde e o que melhorar em nossas aplicações para atingirmos um maior engajamento e uma maior taxa de conversão.

Para utilizarmos o Google Analytics em nossa aplicação Cordova/Ionic Framework nós precisamos adicioná-lo ao projeto usando o comando:

cordova plugin add https://github.com/danwilson/google-analytics-plugin.git

Após adicionado ao projeto nós devemos setar nosso tracking Id como no código a seguir:

var myApp = angular.module('myApp', ['ionic'])
    .run(function($ionicPlatform, $ionicPopup) {
        $ionicPlatform.ready(function() {
            if(typeof analytics !== undefined) {
                // No lugar de "UA-XXXXXXXX-XX" você deve colocar o seu tracking id
                analytics.startTrackerWithId("UA-XXXXXXXX-XX");
            } else {
                console.log("Google Analytics indisponível");
            }
        });
    });

O plugin do Google Analytics só funciona nas plataformas Android e iOS, por isso, nesse artigo, nós sempre verificamos se o analytics está disponível para que o código não quebre em outras plataformas e/ou no ambiente de desenvolvimento no browser.

Para realizarmos o acompanhamento de nossa aplicação podemos fazer como no exemplo a seguir:

myApp.controller('HomeController', function($scope) {
    if(typeof analytics !== undefined) {
        analytics.trackView("Home Controller");
    }

    $scope.doTheHarlemShake = function() {
        if(typeof analytics !== undefined) {
            analytics.trackEvent("Category", "Action", "Label", 25);
        }
    }
});

No código acima, assim que o HomeController é chamado nós o reportamos como uma view para o Analytics. E quando o usuário executa o método doTheHarlemShake (que pode ser disparado ao clicar em um botão, ao carregar mais itens em um infinite scroll, etc.) nós o reportamos como um evento para o Analytics.

O plugin possui outras opções de tracking que podem ser consultados na documentação e como cada aplicação possui próprias métricas e metas, caberá ao desenvolvedor saber quais dos métodos presentes no Google Analytics serão mais úteis para o contexto de sua aplicação.

Jean Lucas de Carvalho

Instrutor at Futuring
Desenvolvedor Front-end na HE:labs e instrutor na Futuring, especialista em aplicativos híbridos com Cordova e Ionic Framework, faxineiro do Frontend Goiás, ex-subcelebridade do Google Developer Bus Brazil, sedentário e o lindão ali da foto. Tudo isso quando não está com preguiça demais pra fazer alguma coisa.

Latest posts by Jean Lucas de Carvalho (see all)

Comentários