Blogs

By Vasi Chindris 24th October 2012 Drupal

If you are a developer it is almost certain that you had to refactor code at some point. Refactoring is no joy, especially if it is not your code and badly written.

In the bigger picture refactoring is ever-present. Just take a look at the Drupal ecosystem. You could refactor content types, display suite fields or views.
 
In this blog post I will give you an insight in how we deal with code refactoring at Amazee Labs.
 

The three code states

I like to think that the code we write can have three states:

  • stable code: code that is subject to almost no changes, and at the same time permits to easily add new functionality.
  • code to be refactored: this is the code that we are working on, or it is marked with @todo and a comment regarding why and what should be refactored.
  • bad code: code that should be refactored, but nobody is aware of it - at least not yet... You will only notice when the client reports a bug or a feature request that cannot be implemented without changes in that portion of code.

Managing @todos

One of the though lessons learned is that when you set a @todo, unless you reserve exclusive time for code refactoring, you will not refactor that code until it is subject of a bug. Since, our first rule regarding code refactoring is actually to try to avoid it, or to make it really early in the development stage, and not let too many @todos go into production. But in the real world, this rarely happens, there always will be @todo in the code.
 
The next thing is how you report a @todo. A bad example is:
 
// @todo: This code has to be refactored.
 
This does not give a clue what the code does now or why the code should be changed. You should always point out the reason why the code needs to be refactored.
 
 

Refactoring

Then, when the time comes to actually refactor the code, the question is: How do you refactor? It depends on the code that has to be refactored, but most of the time it involves moving code into a separate function, changing the structure of a classes tree or moving the implementation from a function oriented to an object oriented approach.

Finally, you have to check if your refactored code really works. Because you refactored the code, this does not mean that you fixed the bugs. You could even have introduced new ones. So to ensure this didn't happen, the best thing is  to have automated tests that you run on your code, which is not always a trivial task to do.
 

The five conclusions

  1. If possible, try to avoid having many @todos in your code, especially in the one that goes to production.
  2. Always write good documentation for what you have to refactor. It would be good to specify why the code has to be refactored, the priority and optionally why you've chosen not to refactor yet. 
  3. Refactor the code as soon as possible. Ideally is in the development stage.
  4. Always test the new code. If you refactor it, it does not mean that that code is correct.
  5. Avoid writing code you know that you will have refactore it in the future.

If you are looking for a more general blog post on code refactoring you should take a look at SourceMaking's "Introduction to Refactoring".

This web week started with an epic event: The Red Bull Stratos jump. We hope you enjoy the selection!

Food for thought

Econsultancy: Five content marketing lessons from the Red Bull Stratos jump
This blog post looks the jump though the glasses of a marketer. If you are looking for lighter content regarding Red Bull Stratos, you might like t3n's blog post.

Technology

Wired: Google Throws Open Doors to Its Top-Secret Data Center

Ever wondered how a Google data center looks like? Now you can find out for yourself. You can even explore it on you own with Google Street View.

Naked Security: India spews more spam than ever before, report finds
Sophos' Naked Security blog published some findings regarding the source of spam in the last three months. More surprising than the main culprit is that three of Switzerland's five neighbor countries made the top 12.

Drupal

Erdfisch: Email and link module landed in core
Great news for all Drupal site builders: It appears that the Link and the Email module will be part of Drupal 8.

Tweets that cut through the noise.

We love to see framed copies of our periodic table of Drupal modules. :)

By Michael Schmid 18th October 2012 Drupal

A few hours ago, the Drupal Security Team informed about a highly critical Drupal 7 core issue: http://drupal.org/node/1815912

The vulnerability allows an attacker to reinstall an existing Drupal site with an external database server and then execute custom PHP code on the web server.

As usual, to mitigate a highly critical vulnerability, a new Drupal 7 version (7.16) was released which fixes this issue. Since it is not always possible to update or patch every customer website immediately there is an accepted workaround for this: Deny access to install.php.

Add this to .htaccess the file:

# Deny access to install.php because of SA-CORE-2012-003 http://drupal.org/node/1815912
<Files install.php>
  Order allow,deny
  ErrorDocument 403 "Sorry, no access to install.php. If you need access you will have to change .htaccess"
</Files>

This will prevent everybody from accessing install.php and rule out that an attacker can use it for an attack.

But overall it is best to update Drupal as fast as possible and also deny write access for settings.php as described in the Drupal security best practices.

You can deny the access to install.php by using this patch and applying it with: "patch < SA-CORE-2012-003_deny_access_install_php.patch"

By Sascha Eggenberger 17th October 2012

For a web designer the most obvious place for inspiration is the web, especially with so many amazing resources like The Best Designs, Mediaqueries or CSS Mania. But how organize all the inspirational nuggets? Not long ago I collected them as bookmarks in my browser but my library grew out of hand.

Say hello to LittleSnapper

Then I came across the LittleSnapper app, a screenshot collecting tool for Mac OS X, which changed the way I collect and organize my inspirations.
 
With LittleSnapper you can easily snap entire websites, webpage elements, your entire desktop or just add jpg or png files to your collection. You can also tag your snapshots, add notes, create folders and add them to collections. But the real benefit is that you actually have a visual preview of all your inspirational designs.
 
 

LittleSnapper + Dropbox = Inspiration in the cloud

 
The only thing that I really miss is a syncing feature. But I found a workaround for this: Dropbox.
 
In the advanced settings of LittleSnapper (Preferences -> Advanced) you can change the path to your LittleSnapper Library. Set the path to a folder on your Dropbox. Do this for every Mac you would love to have your Library on. It's that easy and has proven to be an excellent solution.
 

Here comes the traditional collection of stories that caught our weekly attention. Enjoy!

Drupal

Drupal Association: Election Results
This week the results for the community election to choose two at-large Directors for the board of the Drupal Association were announced. Congratulations to Morten Birch Heide-Jørgensen and Pedro Cambra!

Social Media

Beevolve: An Exhaustive Study of Twitter Users Across the World
Beevolve, a provider of a Social Media Monitoring platform shares some statistics of its mined data.

AllThingsD: Very Pinteresting! Facebook Cranks Up Another (Potential) Revenue Stream With “Collections.”
Remember the times when every Facebook update included many Twitteresque features? Now the world largest social network turns its attention to Pinterest.

Food for thought

Wired: Fend Off Trolls, Bots and Jerks With ‘Empathy’ Test
CAPTCHAs can be annoying. Why not use that opportunity to stand up for human rights.

Tweets that cut through the noise

By Boris Baldinger 10th October 2012 Drupal

After a few weeks of using Sublime Text 2 (ST2) it is time to draw a conclusion. Did Sublime Text 2 manage to be a good replacement for a fully integrated development environment like NetBeans or PhpStorm?

Yes, ST2 is good, but skip the hype.

I joined the flock when ST2 was released and was really into it. Now, after the party, ST2 has just become another working tool. A very comprehensive text editor. That's all. And still, at certain points I miss the quick access to features I get in an integrated development environment. My modest advice: Only switch if you are not happy with your current setup, or have enough time to play around and google your plugins. ST2 is a very modular and highly configurable tool and this makes it fun, - no doubt.

Do I sound a bit hung over? If you are looking for more comprehensive arguments to switch to Sublime Text then you should look at Stuart Herbert's blog posts. He gives 10 reasons why you should switch to ST2 and made a YouTube series on how to setup your ST2 for PHP development. I included the playlist below.

Any final tips for Sublime Text 2?

I recently ran into an issue, where my Git configuration was overwritten by a plugin update. If you are having the same issue, just copy the Git.sublime-settings from the Git package folder to the User folder.

And if you wonder how to check for plugin-updates manually. Just hit CMD+SHIFT+P and type upgrade.

This week brought the following stories to our attention. We hope there something to your liking in our selection.

Drupal

Linux Journal: Drupal Special Edition, October 2012

This month the Linux Journal published a 167 page supplement dedicated to Drupal. You can download your free copy of this edition courtesy of New Relic.

Food for thought

Marginal Revolution: Can mobile phones boost educational outcomes?
As N. Gregory Mankiw famous principles of economics state people respond to incentives. This study made in Niger underlines this thesis.

Technology

Yandex.Browser
Russia's answer to Google launched its own browser this week for Windows and OS X. The first impression, by the early adopters in the office, is that it appears to be really fast and snappy.

Opinion

The Verge: In Mark Zuckerberg's world, lying is the only way to be yourself
Trent Wolbe argues that without the odd lie there's no freedom an Facebook.

Events

Amazee Labs Events: 6th Web Monday Zurich 2012
This month's edition of the Web Monday still has a few free seats. The presentations will be held by Microsoft's Michael Epprecht, Squirro's Dorian Selz of and stablish.me's Fabio Carlucci. Don't forget to register.

By George Papadongonas 5th October 2012 Drupal

This is the third and final part of this blog series. In the first part we installed and customized the Google Analytics Reports module and in the second part we created a Social Media Dashboard that displays the data in table format using Views.

The dashboard that we created in the previous part displays useful information, but the real fun starts when we create charts to visualize the data and make them easily understandable to everyone.
 
Following a similar procedure as in the previous post, you first have to create different Views panes for every specific metric and then use Page Manager to display all of them together in the dashboard.
 
Unfortunately, the Google Analytics Views module does not still support the “Chart” format, so you have to use the Views Dataviz module. After the installation, there is a new “Dataviz” format in Views, which you can use to create the charts.
 
 
The Dataviz settings are really simple, allowing you to customize the chart display:
 
 
Grouping field: If your report contains multiple dimensions, you have the ability to group your chart by one or more fields and display it in a more meaningful way.
 
Type: From this menu, you can select the type of the chart. Depending on your selection, there may be a secondary menu with more options. For example, for the line chart you can select if you want line smoothing or not and for the pie chart you can define if the text on the pie slices will be a percentage, the actual value, the label of this figure, or just nothing. Usually, it makes sense to experiment with different chart types, trying to find the optimal way to present the data. 
 
Width, Height: You can also define the exact width and height of every chart, or just leave it blank to use the default values.
 
Colors: In this field, you can select the specific colors for your chart, separated by a comma. Accepted values are hex colors (like #6495ED) and color names (like LightCoral).
 
Enable interactivity:  This checkbox defines if the charts will be interactive or not. 
 
So, by keeping the same field definition that we used in the previous post and changing the format from Table to Dataviz, you can easily transform your dashboard. For the specific reports that we built, I preferred to use the Pie Chart type for the three top ones, the column chart for the two next ones and the line chart for the last one. Of course, you can experiment with different types and decide what makes more sense for your case.
 
The final result can be seen in the following image:
 
 
Using Views to display Google Analytics data is the easiest way to do it, but sometimes it’s not that flexible. If you have specific requirements for a report, which cannot be created with Views, you can always write your custom code, using the Google Chart API module.  There are some code examples on the module's documentation page. We will examine more complex use cases with custom code, in one of our future blog posts.  

This week the essence takes a look at the following topics: Drupal, HTML5 & internet trolls. Enjoy!

Food for thought

TED: How great leaders inspire action

Great talks don't have a sell-by date. Simon Sinek shows that the question "Why?" can be a source of inspiration.

The Guardian: The day I confronted my troll
An insightful story by Leo Traynor, who was the victim of an internet troll and how he got to meet him in real life.

Switzerland

User Experience Sux: SBB Apple
Last week we mentioned that the Swiss Federal Railways accused Apple of copying its railway clock design for the iPad clock app. UX Consultant Björn Amherd created a mockup of how the Swiss Federal Railways website would look if they used the Cupertino based company's as inspiration.

HTML5 / iOS 6

Breaking the Mobile Web: iPhone 5 and iOS 6 for HTML5 developers, a big step forward: web inspector, new APIs and more
The iPhone 5 was rolled out in Switzerland today. Max Firtman takes a look at what iOS 6 means for HTML5.

Drupal

Angry Donuts: VDC Update And Announcement
One of Drupal's most important contributed modules is one step closer to becoming a part of Drupal 8's core.

By George Papadongonas 27th September 2012 Drupal

In the first part of this series, we discussed how to install and configure the Google Analytics Reports module for Drupal and display some basic metrics. In this second part, we are going to examine how to create your own custom dashboards, using the Google Analytics Core Reporting API. The latest update of the API on September 18th, added a lot of new Metrics and Dimensions related to social and mobile and now gives us the ability to create more useful marketing reports.

So, for our example, we are going to create a Social Media Dashboard, to track social activities and see if and how they drive engaged users and qualified traffic. Here’s how the final Dashboard will look like:

To create these reports, you have to to use the 7.x-3.x-dev version of the GA Reports module, as it offers integration with Views 3. You also need to apply this patch that adds all the new "datapoints" as Views Fields.

After the module installation, you will be able to create a new view, with the option to use Google Analytics data:

In order to build the Dashboard, first you have to create different Views Content Panes and then, using Page manager to build a custom Dashboard page with Panels. To create the Views, you can use all the available GA dimensions and metrics as fields, filters and sort criteria.
The first pane, named Social Visits, displays the most important Social Networks that drive traffic to the site, sorted by the number of visits.. In order to build it, you have to use the following settings:

There are three fields: The dimension ga:socialNetwork will represent the different Social Networks as rows in the table and the metrics ga:visits and ga:visitBounceRate will represent the two columns that display visits and bounce rate.

The second pane, Social Mobile Visits, displays identical data, but only for visitors that used a mobile device. The view is similar, but this time you have to use an extra filter for the mobile users.

The next pane, Social Mobile Visits by Device, displays the specific mobile devices that the visitors from Social Networks used. Google Analytics provides again the right metrics to track this kind of data:

In our fourth report, Landing Pages for Social, tracks the major Landing Pages for Social Networks Visits, helping to understand and optimize the visitor’s flow.

The fifth report, Social Actions, tracks the social actions that visitors perform in the site. If you’re using social buttons, you have to follow the directions from Google Analytics documentation, in order to track Facebook likes or tweets in the website.

In the final report, Goal Completion by Source, we display the total number of conversions for the main social sources.

The final step is to create a Page from Page Manager (admin/structure/pages/add) and add the View Panes to the Panels Layout:

Using the same method and with a little help from the Google Analytics API Documentation and Query Explorer, you can create any dashboard for different departments or specific needs (ex. Newsletter Dashboard, SEO Dashboard etc) and you can give access only to specific users or roles.

In the next part of this series, we are going to examine how we can use the Google Charts API to produce charts and present the Google Analytics data in a more interesting and useful manner.

Pages

Subscribe to Amazee Labs Blog

Latest comments

  • home business software programs's picture

    Good day! I simply wish to give a huge thumbs up for the nice info
    you have got here on this post. I will probably be coming again to your weblog for more soon.

    home business s...
  • Agentur Typo3 Programmierung at Steilstarter's picture

    Hello,

    I must say that you are going great. you are sharing your information with us so thanks for that.

    Agentur Typo3 P...
  • Daniel's picture

    By the way, by "no documentation" I´m referring to Views Autorefresh. It is either not complete or conflicting.

    Daniel