Data, Maps, Usability, and Performance

API canvas d3 data geo GeoJSON html5 image JavaScript json maps mysql PHP WordPress

Resources for Icons and Buttons

icons and buttons

I was looking at some icon Pinterest boards and it inspired me to start a collection of Icon and Button resources. I have found some neat icon and button sets but I have also found some new websites that specialize in creating your own icons from web fonts. I am focusing on only free resources below but I did want to mention ShiftIcons, as it is pretty cheap and very easy to create your own custom icon web fonts. Pictos is another good example and their server offering is currently free for the first 10 days. Here are all the other custom font and icon resources:
Read more

Tumblr API Example using oAuth and PHP

Tumblr API with PHP

I was recently looking at the Tumblr API and oAuth implementation in PHP. At the time, I did not have access to my server to install John Jawed’s oauth pecl package so I looked elsewhere. I did not find a lot of good examples of using oAuth with just PHP, most demos showed using username and password credentials through the old version of the Tumblr API. I wanted to see a complete oAuth example with PHP. Finally, I did find the a thread on the Tumblr API discussion group which had a really simple and well commented example of using oAuth with a modified version of Abraham’s TwitterOAuth library adapted to support the new Tumblr API. I downloaded the zip and was able to make it work, connecting to Tumblr, pressing Allow, and then making some API calls.

But, the example did not show how to make API calls without constantly needing to authenticate the application (press Allow) and I wanted to see an example of just uploading pictures to Tumblr without the extra step. When you register an application with Tumblr, you get an OAuth Consumer Key and a Secret Key for you API calls and oAuth authentication. You also specify a callback url, a place where Tumblr will send you upon successful authentication. Now, it’s important to note that some methods only require the API key (blog info, posts, likes) but any content creation requires oAuth authentication and below I will go over the basic steps of OAuth and explain how to make a post to Tumblr using oAuth, PHP, and a single API call:
Read more

Understanding JavaScript Closures and Scope

JavaScript Closures and Scope

This is going to be my attempt on trying to explain JavaScript scope and closures in the most basic and intuitive way. Scope refers to where variables and functions are accessible, and in what context they are being executed. You can think of scope as a current location and access to variables, so without any functions, variables belong to the global scope and are stored in the window object (everyone can access it – the top-level execution context). Inside a function, variables defined using the var keyword are “boxed in” and running within the function scope (or local scope): contained within the function and cannot be accessed from a higher level scope (ie. global window object). Inside the function, the JavaScript interpreter searches for the most local variable it can find, and uses that one. If it can’t find it inside a function, it looks outside in the global scope as any variable defined in the global scope is available to everything. Consider this example:
Read more

Most Popular Image Sources on Pinterest

popular picture sources on pinterest

Have you ever wondered where do most of the photos on Pinterest come from? What are the most popular Pinterest photo sources? While Tumblr, Flickr, and Etsy make sense, I was surprised to see recipes websites make the top 10 (but I guess that is due to my lack of interest in food recipes – it also explains their acquisition of PunchFork).

Zoomsphere collects a lot of interesting data on social sites and below you will see the top 12 most popular websites (image sources) on Pinterest:
Read more

Amazing CSS Demos

CSS Experiments

Since my previous post covered some cool JavaScript visualizations, I also wanted to talk about some amazing CSS demos. I am focusing on CSS only, especially CSS3, where you really have the power to create interesting experiments and animations. Just take a look at these CSS shadow experiments or how about some CSS patterns? Simurai also has some awesome CSS experiments. Below you will find a list of some amazing pure CSS demos:
Read more

HTML5 Experiments and JavaScript Visualizations

HTML5 Experiments

I often stumble across some interesting demos and experiments and today I wanted to share some of these cool animations, visualizations, and other experiments. If you just browse DemoJS or the js1k project, there are many awesome demos there of various JavaScript effects and visualizations. The Outside of Society blog has a nice collection of Javascript and WebGL experiments as well as Javascript and Canvas experiments. Tim Holman and Hakim el Hattab also has some amazing demos and experiments worth checking out. These animated sketches, HTML5 interactive experiences, and CANVAS demos are also interesting. Besides these collections, here are some other fun HTML5 visualizations and animations.
Read more

Exploring GitHub Repositories

Exploring GitHub

GitHub is awesome. It’s a great place to store your projects and it’s an excellent revision system. You can setup a page on GitHub, use GitHub as a CDN, and use their Gists for quick snippets of code. But, I personally use GitHub the most for exploring and finding great projects, libraries, plugins, frameworks, and more. You can start with their explore page but today I want to share some advanced search features which really help in finding interesting projects on GitHub.
Read more

jQuery Plugin Development Template

Developing jQuery plugin

Update: Here is my current favorite jQuery Plugin Dev Template

Since I wrote about HTML5 boilerplates and WordPress starter frameworks in the past, I also wanted to mention some jQuery plugin development templates and boilerplates. Most people out there point to the revisted jquery plugin boilerplate from Stefan Gabos but below I will show some other options for starting on your plugin development.
Read more