Last week I was in Paris for a Yahoo Developer Network evening and Paris Web and one of the talks I gave was an introduction to Yahoo Open Applications. These are applications that you can embed in the Yahoo homepage or My Yahoo and thus allow you to reach millions of users – or extend the Yahoo homepage with your own personal app. Here are the slides and the audio recording of the talk delivered by Sophie Davies-Patrick (aka “my boss”) and me at La Cantine in Paris:

• Audio of Introduction to Yahoo Open Applications – 33MB MP3 (other audio options on archive.org)

Yahoo Open Applications use the Yahoo Application Platform – YAP. In essence, you write a small app using CSS, JavaScript and HTML and it will get embedded into the Yahoo Homepage.

TweetTrans – translate Twitter updates

The example I showed was a tool that adds little translation links to a Twitter stream:

The code of TweetTrans is available on GitHub and I’ve built it initially as a bog-standard Ajax web application.

The main step afterwards was to convert the app over. This is less hard than it seems upfront but the fact that YAP uses Caja to make the whole application more secure means you need to restrict yourself. Things you cannot use are:

Caja and HTML

• Custom attributes
• Custom tags
• Unclosed tags
• EMBED
• IFRAME
• javascript:void(0)
• Radio buttons in IE
• Relative URLs

Caja and CSS

• star hacks
• _ hacks
• IE conditionals
• Insert-after clear fix
• expression()
• @import
• Background images in IE

Caja and JavaScript

• eval()
• new Function()
• Strings as event handlers (node.onclick = ‘...’;)
• Names ending with double / triple underscores
• with function (with (obj) { ... })
• Implicit global variables (specify var variable)
• Calling a method as a function
• document.write
• window.event
• OpenSocial gadgets.io.makeRequest return JS

Get the SDK

The easiest way to build Yahoo Open Apps is to use YML which is a markup language that gives you access to the Yahoo social connections and creates Ajax functionality for you without having to write any JavaScript.

If you want to use the full Yahoo social stack the best place to start is to download the SDK which makes the oAuth authentication very easy for you.

Distribution

Once you have your app done you can easily make people install it by sending them a link. This link contains the application ID. In the case of TweetTrans this is:

http://yahoo.com/add?yapid=zKMBH94k

More info

To get more information, check out the YOS section on the Yahoo Developer Network and the forums on YAP.

Things that made me happy this morning.

• Changing a staircase into a massive piano makes 60% more people use it instead of the escalators – fun is the best way to make people use things.
• You can do vocoding with a Piano
• YQL meets SPARQL
• Kayak releases trends data – sadly enough not as a data API but as graphs
• Twig is a PHP5 templating engine with security baked in.
• Rails 3.0 now has XSS protection built in – congrats, guys.
• Michael Moore’s new web site is based on Django and here’s some info how they made it scale.
• This site is under construction is probably the best “under construction” animation collection ever.
• Google Moderator is a great app to collect questions for a final panel of a conference.
• Lego Mindstorm robots solving Rubik’s cubes – SkyNet has nothing on them
• Old point and click adventures in Canvas – play Leisure Suit Larry as a multiplayer game.
• The YQLEX builder is a nice mashup of the YUI grids builder and YQL

Things that made me happy this morning:

• I’ve built my first Yahoo App to add to your Y! homepage TweetTrans is a Twitter search with translation options
• In case you ever wanted to install linux on a dead badger – there is a tutorial for that. You could also case mod a beaver.
• If you ever need to define irony, simply point to the MOD manual on preventation of information leaking on the internet at Wikileaks (also on the Telegraph)
• PhotoSketch is an amazing tool to sketch a scene and stitch it together from pictures on the internets (also check the gallery)
• The best logo design tutorial in the world ever – word (art)
• Remy Sharp has a nice interactive jQuery documentation
• Yahoo Meme now comes with an API powered exclusively by YQL!
• Good trick on how to compress Keynote presentations – you go through PDF export and Preview
• The podcast and transcript of my Accessibility 2.0 keynote are now available
• Quite some disturbing info on Dark Stalking on Facebook – made me happy as this is something that can be fixed
• Interesting information about Logos in Lego Town – those minifig design agencies are not very consistent

Things that made me happy this morning:

• YUI 3 is out of beta – the changes to YUI needed to run the new Yahoo homepage, smaller, faster, less code to write.
• Google Docs now has an experimental OCR conversion API – post an image to the API endpoint and get a text version as a Google Doc.
• A nice bookmarklet to show the HTML 5 structure of a document
• Mockflow is an online collaborative wireframing tool
• Kalle Saas has some good JavaScript localisation tips
• We are colorblind is a pattern library for color blindness concerns
• One sentence contained in every HTML tag there is
• Paul Carvill of the Guardian explains why front end developers matter to the future of businesses
• Another way to fix bad CSS support – eCSStender is finally live
• @mediajunkie new book features thehairofchristianheilmann

Just a quick reminder that there are still lots of spaces left for the Open Hack Day in New York city on the 9th and 10th of October. Much like Yahoo’s other open hack days you’ll get 24 hours time to play with any API and built something amazing with people you always wanted to work or got to know there.

If your company doesn’t allow you to play much, this is your chance. The event is free, and you’ll get to play not only with the things you already see here or on developer.yahoo.com but also with the new Yahoo Application Platform for apps running on the homepage and the new TV widgets.

• Sign up for NYC Open Hack here