Teevio

PHP Google Analytics API

January 29th, 2016

Yesterday, I was wanting to pull specific Google Analytics data with their API. I started following their Hello Analytics API: PHP QuickStart guide and quickly found out that their quick start does not use the latest Client PHP Library. After struggling a while to get the new stuff working, I finally got it all set up correctly. If you have never used their Analytics API you ought to.

After getting everything worked out I decided to take their current docs and update them with the latest API info. Most of what’s below is their documentation with some critical changes made by me. Enjoy!

Step 1: Enable the Analytics API

To get started using Google Analytics API, you need to first create or select a project in the Google Developers Console and enable the API. Using this link guides you through the process and activates the Google Analytics API automatically.

Alternatively, you can activate the Google Analytics API yourself in the Developers Console by doing the following:

  1. Open the Credentials page.

In either case, you end up on the Credentials page and can create your project’s credentials from here.

Create a client ID

  1. Open the Service accounts section of the Developers Console’s Permissions page.
  2. Click Create service account.
  3. In the Create service account window, type a name for the service account and select Furnish a new private key. If you want to grant Google Apps domain-wide authority to the service account, also select Enable Google Apps Domain-wide Delegation. Then, click Create.

When prompted for the Key type select JSON, select your Service Account and then click Create. Once you create the service account a JSON file will be downloaded. Your new public/private key pair is generated and downloaded to your machine; it serves as the only copy of this key. You are responsible for storing it securely.

Add service account to Google Analytics account

The newly created service account will have an email address, <projectId>-<uniqueId>@developer.gserviceaccount.com. Use this email address to add a user to the Google analytics account you want to access via the API. For this tutorial only Read & Analyze permissions are needed.

Step 2: Install the Google Client Library

The preferred method is via Composer. Follow the installation instructions if you do not already have Composer installed.

Once Composer is installed, execute the following command in your project root to install the PHP API library:

composer require google/apiclient:^2.0.0@RC

Finally, be sure to include the autoloader:

require_once '/path/to/your-project/vendor/autoload.php';

Step 3: Setup the sample

You’ll need to create a single file named HelloAnalytics.php, which will contain the sample code below. The only difference in this code and the original is seen in the getService function.

Move the previously downloaded .json within the same directory as the sample code and make sure you update the filename for this line putenv('GOOGLE_APPLICATION_CREDENTIALS=file.json');

Step 4: Run the sample

After you have enabled the Analytics API, installed the Google APIs client library for PHP, and set up the sample source code the sample is ready to run.

Run the sample using:

php HelloAnalytics.php

When you finish these steps, the sample outputs the name of the authorized user’s first Google Analytics view (profile) and the number of sessions for the last seven days.

With the authorized Analytics service object you can now run any of code samples found in the Management API reference docs. For example you could try changing the code to use the accountSummaries.list method.

If you have any questions feel free to comment on the Gist

  Posted in programming & php

Chordin + Creative Market - A Case Study

March 16th, 2015

Chordin started out as a personal side project a year ago. The original designs that I came up with were more like a wireframe, meaning, flat, white and lacking personality. Over the course of the year I started thinking about how I might bring some kind of personality to the site.

I knew I stunk at creating my own visuals and the genre of the site didn’t exactly lend itself to many inspiring ideas, that is until Creative Market came into the picture. I was surfing the Recent Products section on Creative Market and ran across Danil Cetvericov’s illustrations. I really loved his abstract, funk, 80s style of illustration and knew immediately that this was exactly what I was looking for.

To complement the illustrations and design, I used a font called Electro by Alex Haigh and icons by Gasper Vidovic. Through Creative Market resources alone I was able to bring a skeleton of an idea to life. The total costs were $114, pocket-change for such a great set of design tools. You can see all the products I used below, and you can visit Chordin to see them in action.


  Posted in Design

Illustrations As Design Elements

March 4th, 2015

I like to design things. The only problem is that while I’m good at layout, color and typography I’m just not that good at the artistic design-y part of designing. Maybe that’s what people call a UX or UI designer? I’ll let you decide what I am. What I do know is that if there’s a crutch to be used I’ll use it. Since I’ve been posting a ton of free illustrations, I thought I’d show you how I use them and how you can too. So raid the infirmary, stick those crutches under your pits and let’s get started.

Have an idea

The first order of business is to come up with something you want to design. If you notice in my site footer, I have a really cool old map of New York. I also have a really old pamphlet thingy with a nice drawing on it. Both of those design elements were pulled from illustrations that I found on the internet. The water color in the header is pulled from a page in Scuffy the Tugboat. I had ideas and then I figured out how to get those ideas implemented without actually having to do it myself and without stealing of course.

Ultra Hi-Res

Once you have your idea and the source material for that idea, you’ll need to make sure that the source material is as hi-res as possible. I found the New York map via Google Images and the pamphlet illustration via Flickr. Since I owned Scuffy the Tugboat I had no problem getting a hi-res scan of the page that I liked most.

Extraction

The reason for a hi-res source is so you can extract out the part you want. The higher the resolution the more forgiving the extraction will be. You’ll want to open up your source graphic in Photoshop (or similar program) and then you’ll want to use the Magic Wand to select and delete out the background. I usually start with the following settings:

  • Tolerance - 30
  • Anti-alias - Checked
  • Contiguous - Unchecked

thumb thumb

Oftentimes there will still be some straggling color. Do your best to magic wand that out as well, but don’t sweat it too much. The next step will actually cover over a multitude of straggling background colors.

Implementing

After you’ve deleted out the background and have the illustration left, you can slap this baby on top of whatever you want. The trick here is to experiment with color overlays, opacity and blending modes to get the desired effect you want.

Using a color overlay will get rid of any non-uniform color and gives a nice solid look to the illustration. But, changing the blending mode sometimes resolves this issue without having to put a color overlay on top. I use opacity mainly for aesthetics. In the following 2 photos I used all of these to achieve the desired look that I wanted.

thumb thumb

That’s all there is to it folks! If you’d like to practice with the assets I used, here’s a handy list of links. Some are free, some are not:

  Posted in Design & Illustrations

New Catechism of the Steam Engine

March 3rd, 2015

I don’t know how many more of these I’ll be doing, but this is the 4th installment of free illustrations (see also Valve Gears, Ernst Haeckel and Audubon) that I’m making available here. This particular set of mechanical illustrations is from the book New Catechism of the Steam Engine by Nehemiah Hawkins. You’ll find a slew of beautifully illustrated Corliss based steam engines in this set.

The one thing that really stuck out to me regarding the Corliss steam engines in this book are their monumental size. I found myself marveling at the engineering genius that went into developing and ultimately building these engines. I would have loved to walk into a giant steam engine building factory, or stand by the engine pictured in the header.

Nostalgia aside, marvel at and download all 170 illustrations for free.

  Posted in Illustrations

Client-Side View Caching ā€“ Part 1

March 2nd, 2015

I’ve been building a web-app call Chordin for a while now. It’s a work in progress and it has been letting me scratch an itch that I have related to programming an isomorphic app. There’s plenty of Google juice on what an isomorphic app is (in case you don’t know) and how it differs from a single-page app. The main draw for me is to be able to serve fully-formed HTML from the server for performance and SEO, while retaining the speed and flexibility of client-side application logic (paraphrased from Airbnb’s article on the topic).

To start, I decided that I wouldn’t use any tools that are already out there, tools like Meteor.js, Node.js, React, Angular, etc. Yes, I am crazy, but my main goal was to force myself to learn concepts, not rely on tools. I wanted to experiment with my own theories, even if they might fail. In the end I hoped to have a better understanding of the problems that these various tools are trying to solve. I by no means know what I’m doing, I’m definitely in way over my head, but it has been a lot of fun throughout the process.

The speed of an isomorphic app was my main concern. I knew that Chordin would be used on all devices and various internet connections and therefore it needed to be fast. As I said above, I purposely limited myself to what I could use, but I also had my own limitations as to what I knew. On the server side I decided to use PHP (it’s what I know, don’t hate), Memcached (for caching SQL queries) and ElasticSearch (for near instant song searches of large amounts of database data). This server setup gave me all the speed for the requests being made.

On the client-side of things I rolled my own Javascript to handle view loading, caching and uncaching. The code interfaces with the server and has its own layer of view caching. I was most interested in solving client-side caching as it can provide some of the best results in speeding up a user experience. Another reason is that caching on the client-side is a very complex beast, and unless I’m mistaken, Javascript frameworks don’t address this particular issue. There’s a lot of room to explore viable solutions. Most solutions that I’ve seen try to make the client ā†’ server, server ā†’ client communication as fast as possible. But in the end, there is still an exchange taking place somewhere. The logical next step in my mind is to eliminate those exchanges all together.

In subsequent posts I plan on describing in more detail the ideas that I have implemented in Chordin, as well as more conceptual ideas I hope to implement. Stay tuned for more!

  Posted in Programming

Valve Gears, Steam Engine Design, Steam Boiler Design

February 17th, 2015

In this 3rd installment of illustrations (see also Ernst Haeckel and John James Audubon) I bring you over 100 year old mechanical illustrations of valve gears, steam engines and boilers. These illustrations come from a 1908 I.C.S Reference Library book, Valve Gears, Steam Engine Design, Steam Boiler Design. I picked this particular book up from Shop Goodwill for a decent price.

It hurt me to scan this book as I had to open and push it down on the scanner to get the best scan. I could hear the brittle binding screaming in pain, but I managed to get 178 illustrations scanned from the book and made them available for you to download for free. I did a bit of minimal processing of the scans like cropping, sharpening and brightening, but other than that, they are as is from the book.

I hope you enjoy these illustrations and if you happen to use them, please give me some link love.

  Posted in Illustrations

Frozen

February 11th, 2015

Sometimes I feel like my heart is frozen, but even frozen things will eventually melt.

  Posted in Photography

John James Audubon

February 10th, 2015

I’ve been slowly building up a collection of ultra hi-res images that would work really well for printing. I initially got inspired when I ran across the Ernst Haeckel prints. My goal is to decorate my office (whenever that gets completed) with prints. It was to my amazement and joy that I ran across the new Audubon website. They have made all of John James Audubon’s Birds of North America watercolor illustrations available as free hi-res downloads. It’s definitely worth your while to look through them all. If you’re looking to download all the images, made your life easy by making all 435 images available on Dropbox.

  Posted in Illustration

Gotham Sunrise

January 19th, 2015

The rising sun pierces through the metallic skeleton of New York City.

  Posted in Photography

Chordin

December 10th, 2014

In case you missed it last night, I finally launched the beginnings of something that I hope becomes much bigger and eventually revolutionary. At the offset, Chordin is just a simple web-app that lets you search for guitar chords by song, album or artist on any device.

For the short-term, I plan on integrating favorites and playlists, allowing me to scratch an itch I’ve had with managing all the guitar music that I play.

In the long-term, I hope to bring a new, open standard for how guitar tablature is written. You might wonder why a new format is even needed, but take a look at any tablature site and you’ll see that we’ve been stuck with monospace fonts for as long as anyone can remember. There needs to be change and I have a scheme for that change.

In the meantime, enjoy my little web-app, follow along on Twitter and enjoy this fine December day.

  Posted in Internet