vrijdag 21 juni 2013

Dropbox apps part 1 of 2

Last week I was working on a little project for my EO forum and I wanted to interface it with my Dropbox account. I stumbled upon dropbox.js, a great javascript library that lets you use the Dropbox API from any javascript environment like node.js or a browser. I was suprised to learn however that you can host an entire HTML5 / Javascript application right within your dropbox. Since my App's only requirement was to store a handfull of documents in my dropbox account, I realized that I didn't have to write any serverside logic at all. Isn't that cool?
Since I had a little fight to figure it all out from the Dropbox documentation and the dropbox.js documentation, I'm sharing my notes here on how to build your first Dropbox app.

In this article, we're going to create a static web app. It's just a bunch of html, js and css files living in your Dropbox that happens to have a public url.

  1. Get a Dropbox account.
  2. Create a link to your application using this console app.
    Type a name for your application and hit the ADD button. This will create a new index.html document in your dropbox and it will show you a url to that file. The name you choose will be part of the url so pick a suitable one. This url shows where your app lives on the internet. You can test the link right away, it will show you a little stub file if nothing went wrong.
    You can find the file in your dropbox under the Apps --> Static Web Apps folder. This folder and everything in it will be visible to the rest of the world so don't store anything there that doesn't belong there.
That's it. It's that simple!
If a static website is all you're looking for, here it is.

But wouldn't it be great if we could use our dropbox files from within the javascript code of our new site? Turns out we can and I'll show you how in my next post.