My Social Actions

How to Create a Fully Functional Social Actions Powered Application in Under Thirty-Five Lines of Code

Thirty-five? Thirty-five what? Thirty-five lines of code--it's all it takes to hit the ground running with a full-blown Social Actions powered application. It's really that easy, and I'm really going to show you how. We're not doing introductions (I'm Eric, and I do stuff...socially actiony stuff). There's no PR bits (Social Actions is giving you an absolutely incredible dataset to do some really, really amazing things with). And I'm not offering any witticisms (Really). This is about easy, and easy is typically short and to the point.

So, let's make this happen. How can you make a fully functioning Social Actions powered application in under thirty-five lines of code?

Well, any application starts with one thing, knowing what you want to do. Yeah, I know. Knowing what you want to do sounds simple right? It's not, and it's the most deceitful part any project. And, as you might have heard, a lot of amazing, useful data is already here. You need to know how you're going to make it better.

What do we want for our example? Hmm...For the sake of time and space (I need to be out of the hotel room in an hour), let's just build something that finds volunteer opportunities based on any given search term.

We can define what we want from Social Actions in a short list like this:

- We want volunteer opportunities based on a search term.
- We don't care what platform it's from.
- Since time moves fast on the Internets, we only want actions created in the last 30 days.
- We'll display the output in a simple list.

Now that we know what we want. How do we get it? That's where the “powered by Social Actions” bit comes in. Most times, when you see the term “powered by” it's referring to an API of some sort. Social Actions has its own API you can draw from. You can find a draft of the documentation for it here. Go take a look.

Doesn't make sense? That's okay. It doesn't need to.

Why? Every time you search for actionable opportunities on Social Actions, you use the API. Instead of spitting out an output for programming languages to read, the search just returns browser-readable HTML. If that didn't make sense, it's still okay. Just follow my lead...

Let's search for the data we want on via the Social Actions search. Click the advanced search link on the right of the interface. We'll need the fancy search features to really fine tune what we want from this search.

Enter “web developer” as your search term and change the “created” dropdown to “Last 30 days”. The final thing to do is change the “type of action” to “Volunteer” and then press search!

Today, the search gives you twenty-three results. Tomorrow that could change. Next week it could be drastically different. If you want more results, just loosen the time restraint to “Any time”. We can get even more relevant results by tweaking some special API parameters later.

The URL you're at should look something like this:

http://search.socialactions.com/actions?q=web+developer&created=30&commit=Search

To make a direct call to the API we just need to add four letters and some punctuation...”.json”. Look at the following URL.

http://search.socialactions.com/actions.json?q=web+developer&created=30&commit=Search

See the difference? Adding “.json” to “http://search.socialactions.com/actions” will change your search into a valid API call, and it will give you an output in something a programming language can eat right up.

So it should be pretty clear that making an API call on Social Actions is very, very easy. If you were confused by the draft API documentation the first time, take another look now that you've seen it in action. When all else fails, remember that the API is completely interchangeable with the Social Actions search.

[note: you can also add “.rss” to any search to create a RSS feed from your searches]

Great! We know what we want, we know how to get it...So let's do this. In this example, we'll use some very basic PHP and HTML. If you aren't familiar with PHP or HTML, I still encourage you to read the example code snippets. It's all very readable and easy to understand if you take it one line at a time.

Let's do the code!

[note:snippets are images so they can look pretty...if you choose to use them you should type them yourself anyway ; ) ]

First we should decided how we are going to use PHP to connect to the Social Actions API. In this example, we'll just use curl. It's pretty standard in the PHP arena. If you aren't familiar, a Google search will show you a bounty of tutorials and other info.

Okay, so some very basic use of curl will look like this:


So, that's six lines and in six lines we are able to make a request to the API and receive its response. Line 4 sets the request URL. It looks very similar to the example used earlier right? The variable $terms on that same line holds our search terms. We'll talk about where they come from in a second. Line 9 is the other important bit of this snippet. In line 9, the request is executed and the response is executed. Its stored in the $actions variable for later use. All in all, it takes six lines to connect, request, receive, and decode a response from the Social Actions API.

Okay, time to plop in some HTML. We'll make this very simple. I secretly loved the Internet back when it was text and boring. I'm going to use this as a chance to bring back the days of my youth:


Oh, jeez. I lied a little. There's some PHP in there. We can talk about that for a second. Lines 19 to 27 use a cocktail of PHP and HTML to list the actions stored in the $action variable we defined in the first snippet. If you're unfamiliar with PHP--or programming in general--you should still be able to get the rough idea of what's going on. If not, it's okay. Just know we're making a list. The other PHP infusion occurs on lines 29 through 31, which displays an error message if no actions are "defined". The rest of it is just very basic HTML.

We're still missing some glue, but what does it look like so far?


Certainly nothing spectacular, but simplicity makes me happy. As I mentioned, we need to add some glue to bring the application into working order. The "glue" in this case is just some simple form processing. In layman, we need to put your search term into $terms. We'll skip showing the glue since it's only a few lines and just show the entire thirty-three lines of code...


Woo! This is a Social Actions powered application in less than thirty-five lines of code. Let's take it for a spin and search for "web developer".


Huzzah. Let's search for "batman" this time!


Huh. No batman? Weird. Well, at least our error message works, right?

So, yeah...Thirty-five lines gets you a functioning Social Actions application. It can be squeezed down to well below twenty five lines, but it sort of looks weird when I do that. This isn't about size, anyway. This is about easy, and this was pretty easy. With minimal code, we can mashup the Social Actions dataset in any way and anywhere we want.

While this example is extremely basic [read:super-duper basic], all of the projects from Social Actions Labs follow the same process of connecting and processing data from the Social Actions API. The Related Ways to Take Action widget? It's just a prettier version of this with a bit of page interpreting code running on top. The Wordpress plugins? Same thing. The foundation of connecting to the Social Actions API is always the same, and it's always easy.

Views: 1552

Tags: API, curl, dev, developer, php, social actions labs, socialactions

Comment by Peter Deitz on January 10, 2009 at 4:33pm
Hey Eric, Amazing post. Thanks so much. I'm sure developers participating in our Change the Web Challenge are going to find this incredibly useful. Any chance you can change the title to something like, "How to Create a Fully Functional Social Actions Powered Application in Under Thirty-Five Lines of Code." Thanks again. This is a tremendous resource.
Comment by Adam W. Warner on March 23, 2009 at 1:42pm
Just getting started and followed the above, worked like a charm after finding a few of my own typos. Now to build on it and get it into a WP plugin...

Thanks for the handy tutorial, most appreciated!
Comment by Peter Deitz on March 23, 2009 at 2:41pm
Hi Adam, I'm glad the tutorial proved useful. I'll pass this note onto the author and coder extraordinaire, Eric Cooper.

Comment

You need to be a member of My Social Actions to add comments!

Join My Social Actions

Social Actions

Vision
A world formed by acts of generosity, empathy, and creativity.

Mission
To make it easier for people to find and share opportunities to make a difference.

Method
Openness, inclusivity, collaboration, and innovation at every opportunity.

Learn more

© 2014   Created by Erinn Andrews.

Badges  |  Report an Issue  |  Terms of Service