What is Karafka? Karafka is a microframework used to simplify Apache Kafka based Ruby applications development. Up until now there was only a sending library called Poseidon and its extension called Poseidon Cluster that could be used to work with Kafka clusters. Unfortunately there was no Sinatra “like” framework to rapidly develop message based applications. […]
Read more at the sourceCategory Archives: events
Plataformatec at Erlang Factory San Francisco 2015
Two weeks ago José Valim and I went to Erlang Factory San Francisco and we had a great time. Erlang Factory San Francisco is one of the biggest events in the Erlang community. One of the things that got me most excited about it was how many people were excited and talking about Elixir throughout … »
Read more at the sourceAgile trends
Last month our team went to Agile Trends, an event in São Paulo where discussions revolved mainly around Agility in software projects. Starting the event activities, Niels Pflaeging presented a keynote where he defends Agile alone is not sufficient to taking organizations to the Knowledge Era, and that deeper transformations are necessary for doing that. […]
RailsConf 2014
This year’s RailsConf was held in Chicago, from April 22 to 25, and Plataformatec was there, as in previous years, and this time it was represented by George Guimarães, Lucas Mazza, Rafael França, and myself included. Even though I’ve attended the last 5 RubyConf / Rails Summit here in Brazil, this was my first time […]
Tracking Google Analytics events in development environment with GoogleAnalyticsProxy
As mentioned in a recent article1, I’ve been diving deep into Google Analytics lately while working on a few client projects. We’re aiming to use much more of the features of Google Analytics and have been hitting some roadblocks with the development versus production application environments. Once you begin to dive into event tracking and AJAX-driven goal conversions, relying on just the sample code that Google Analytics provides you is going to result in you looking at a handful of JavaScript errors.
another example from the firebug javascript console…
We see JavaScript errors like this because we don’t load the google analytics code in our development environments. As you can see, we are only loading this in our production environment.
<% if RAILS_ENV == 'production' -%>
<!--// Google Analytics //-->
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-XXXXXX-1");
pageTracker._trackPageview();
</script>
<% end -%>
To track an event with Google Analytics, you’d need to trigger something like:
pageTracker._trackEvent('Button', 'Click', 'Get in touch');
As you can see from our code earlier, in development, the pageTracker
variable isn’t defined and that’s why we’re getting those JS errors. We also don’t want to add conditionals everywhere in our application to check if we’re in development or production environment.. as that’d just make our views uglier than they need to be. So, I decided that I’d create a proxy class in JavaScript that would allow us to trigger _trackEvent()
and _trackPageview()
and handle it appropriately.
This class works with the following logic:
- if google analytics is loaded, pass the parameters to the real
pageTracker
- if google analytics is NOT loaded, output the information to
console.log()
for debugging purposes
For example, on a gallery on our web site… we track when people navigate next and/or previous through the photos. In our development environment, I can watch the JavaScript console output the following:
And in our production environment, we can see that this was sent to Google Analytics.
We’re able to do this by initializing the GoogleAnalyticsProxy class and calling these functions through it. For example:
_gap = new GoogleAnalyticsProxy();
_gap._trackEvent('Video', 'Play', 'Homepage video');
_gap._trackEvent('Video', 'Pause', 'Homepage video');
_gap._trackEvent('Button', 'Click', 'Call to action X');
You’ll see that we’re just calling _gap
versus pageTracker
. We then replace all the instances of pageTracker (except where it is defined in the google analytics code block they provide you). You’ll find this located near the bottom of our application.html.erb
file.
<% if RAILS_ENV == 'production' -%>
<!--// Google Analytics //-->
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-XXXXXX-1");
pageTracker._trackPageview();
</script>
<% end -%>
<script type="text/javascript">
var _gap = new GoogleAnalyticsProxy();
</script>
We now have _gap
available throughout our project and can call _trackEvent()
and _trackPageview()
with it. Note: You can use any JS variable name that you want, _gap is just what I went with.
Get GoogleAnalyticsProxy
I’ve gone ahead and tossed this small JavaScript class (known as GoogleAnalyticsProxy) on Github for your enjoyment. I have some more articles in the works that will show you some tips for how to make the most of Google Analytics. If you have any questions and/or ideas for related article topics, don’t hesitate to let me know.
1Tracking AJAX-driven events in Ruby on Rails for Google Analytics conversion goals
Read more at the source