My-2do

I wanted a todo list on my blog, that I could edit, and others could see, as a 'gadget'. I decided to make one myself. I won't give any details, that would become a multi-page tutorial, but I'll show you which components / platforms / techniques I used so you can for yourself decide what's out there.

Google Gadgets
Blogger's layout is very flexible. You can add gadgets (in my language, Blogger calls them widgets), made by Google, third parties, or yourself. These are defined / built like any other gadget for iGoogle. That was interesting for me for two reasons:
  1. Because of this there exists a lot of documentation already, from Google itself and probably also in communities on the web. Auto-didactic as I am, this can make or break a project!
  2. I could extrapolate my efforts to other Blogger as well as iGoogle users. Not a necessity but definitely an extra motivation: the effort / learning investment opens up a lot of new opportunities.
XML + http-request
Gadgets are defined as an XML file. You can host them with Google (I learned that afterwards) but I hosted it somewhere else. The XML file contains information for the user-settings dialog, as well as the HTML of the gadget itself. You can spice this up with JavaScript, including access to dedicated libraries from Google (for example to get the current blog's posts). I decided to host the app itself at Google's App Engine. Because of that, the XML was quite simple: just an empty DIV and a few lines of JavaScript that used 'gadgets.io.makeRequest' to fetch the list from App Engine.

App Engine
App Engine is 'part' of the gadget system, it was just my choice for making the server-side part of the application. I could have just as well installed a LAMP stack (Linux - Apache - MySQL - PHP) on my home server and host it from there. App Engine however offers a bunch of free resources and can scale up very easily. The main reason however is that I am currently learning App Engine.

I use Java (GAE/J) and decided to try out JDO persistence this time. Although others say JDO and JPA are comparable, I think there is more documentation for JDO available. Oh, I use Eclipse as my IDE, together with Google App Engine plugin, it makes life on App Engine a lot easier.

To get things rolling even faster, I decided to use the Google account login feature of App Engine. This means that I don't have to worry about the user system. 

Structure
Currently the whole system is very basic: one applet to edit your todo list (there's one list per email address), another applet that exposes your todo list to the outside world behind a 'custom' url. This url was first baked into the xml. That's stupid of course so I rewired it so the todo list ID is configurable by the user. 

Feature stuff
There's more to do: styling the edit page, making edits possible from within the blog (as long as you are logged in), multiple todo lists, styling the todo list, marketing, earning money, selling out, buying an Alfa Romeo Giulietta. :-D

Where?
Okay you want to be a beta beta beta test beta test test tester? Here's how to implement:

- Go to my-2do.appspot.com (and log in with your Google Account)
- Add items to your list
- Copy the ID to the clipboard
- Go to blogger, add gadget, use your own, paste this URL: http://hosting.gmodules.com/ig/gadgets/file/107797948841842070898/my-2do.xml
- Done

Let me know if this doesn't work or if you have cool feature requests :-D

2 opmerkingen:

  1. I tried to add this gadget, but I got a server error!

    BeantwoordenVerwijderen
  2. Hi Areinh! Thank you for trying my-2do! You should put the correct ID in the plugin's settings, in your case this is a string of characters that starts with an 'a' and ends with 'A'. You can find this (in the current version of the app) if you press the 'i' button and copy-paste the ID.

    BeantwoordenVerwijderen