Archive for March, 2012

How to set up Ubuntu Linux for Android Development

I’ve been developing cross platform apps using HTML5 for deployment across Desktops, Tablets, and Phones. Lots of interesting apps can be built without talking to the hardware but sooner or later, we always want to go deeper. Mozilla is working Won an exciting “Web Runtime” ( read more here ) and there is a version of Firefox for Android.

Though I don’t want to build native Android Apps, I do want to get under the covers and experiment with building the Open Web Apps runtime components (it’s so cool working for an organization where EVERYTHING we build is open source and available for download WHILE it’s being developed.)

Since I hit a couple of snags getting things set up I though I’d share the steps that I used in the hopes that it would help someone else who is just getting started.

Though there are good commercial Java / Android Development tools available, the standard is to use Eclipse and the ADT, so that’s what I’ll be setting up in the steps below.

Eclipse is itself a Java App. On my Ubuntu machine the default Java Runtime was OpenJDK which is not recommended for running Eclipse.

So the first thing that we want to do is make sure that we have our Ubuntu system up to date, the latest version of the Java run-time and JDK installed and our Ubuntu box configured to use the Sun versions by default.

Start by opening up a terminal window.

If you are brand new to Ubuntu you can find any application (including apps you haven’t yet installed) by using the Unity Launcher Bar

The Ubuntu Unity Task Launcher

  1. Click on the Ubuntu App Button on the top.
  2. Start typing the name of the application you are looking for.
  3. If it appears in Installed Apps – click to run it. If it appears in available apps, install it.

Terminal will be installed. Click on it to run.



sudo apt-get update


Enter your password when the sudo command in the terminal prompts you for it.

Leave the terminal window open when the command completes.

Next run upgrade.



sudo apt-get upgrade


Now we need to get the Java JDK

You can install it from your open terminal:



sudo apt-get install sun-java6-jdk


The command above installs only the JDK. I wanted to make user everything Java was installed on my machine and up to date to avoid problems with unresolved dependencies later on so I ran this command:



sudo apt-get install sun-java6-bin sun-java6-jre

sudo sun-java6-jdk sun-java6-plugin sun-java6-source


You can run them all at once but I broke them up for formatting here on my blog.


Now we want to check and confirm that Java and the JDK / Java Compiler installed and being used are the latest. This is necessary because you can have as many different versions installed on your machine but only one will be the default.



java -version

javac -version


And you should see something like this.

Check Java Versions on Ubuntu

Check Java Versions on Ubuntu


If some other version appears (like the Open JDK) then you can change the default by running this command and choosing the version that you just installed.



sudo update-alternatives --config java


Once done, we need to instal lthe Adroid SDK.

Get it here : http://developer.android.com/sdk/

Downloading the Android SDKDownloading the Android SDK

You can decompress the files and place them in a location that makes sense for your Linux usage.

I put mine in /usr/apps/android-sdk

We also want to add the Android SDK to our shell path.

To do this, open a Nautilus instance (File Explorer) and navigae to your Home directory.

/home/joesstagner” in my case.

Then use the menu to select View->Show Hidden Files

Ubuntu Show Hiden FIles

Ubuntu Show Hiden FIles

Find the .bashrc file and open it with the text editor of your choice.

Append the following line, changing the entry to reflect the location that you chose for the Android SDK


export PATH=${PATH}:/home/apps/android-sdk/tools

Save and close the file.

Now we can install Eclipse.

There are two ways that you can do this – but the important part is that you install “Eclipse for Java Developers“.

If you install the bare bones version of Eclipse you may find yourself in dependency hell when you try to set Eclipse up for Android.

You can download Eclipse for Java from www.eclipse.org

Download Eclipse for Java

Download Eclipse for Java

In my case I will use Ubuntu’s synaptic package manager to install Eclipse.

You can find and run the Synaptic Package Manager using the technique referenced above.

Install Eclipse with the Synaptic Package Manager on Ubuntu

Install Eclipse with the Synaptic Package Manager on Ubuntu

Note that I installed both Eclipse and Java development components.

Now we are ready to download and install the Eclipse plugin for Android Development.

1. Start Eclipse, then select Help -> Software Updates….
2. In the dialog that appears, select the Available Software tab.
3. Click Add Site…
4. Enter the Location: http://dl-ssl.google.com/android/eclipse/

Note: It’s probably better to use https for the download but I had problems in doing so.

Add the Android Developer Tools to Eclipse

Add the Android Developer Tools to Eclipse

Then select the tools :

Add ADT - Select Tools

Add ADT - Select Tools

Click next until you get to the EULA and agree to it (click yes)

Eclipse will download and install the ADT.

Installing the Android Developers Kit - ADT

Installing the Android Developers Kit - ADT

You may see a warning that the code to be downloaded is unsigned.

ADT Unsigned Security Warning

ADT Unsigned Security Warning

I chose to install anyway.

When everything is installed, Eclipse will prompt you to re-start Eclipse.

Restart Eclipse

Restart Eclipse

When you restart, Eclipse may ask you about updating the Android SDK

Eclipse Add Reference to Android SDK

Eclipse Add Reference to Android SDK

Eclipse will ask you a couple of permission questions – say yes.

When it’s all done we can select New -> Project

New Android Project in Eclipse

New Android Project in Eclipse

Now we’re ready to start building an Android App !


HTML5: The difference between an App and a Page.

Cross-posted from my entry to the Mozilla Developer Network – HTML5: The difference between an App and a Page.

HTML5 is only one part of the”Stack”

HTML5 is really more than one thing. In the strictest sense, HTML5 is fifth major revision of the W3C specification of the markup language that is used to create web pages.

But in a practical sense, HTML5 is far more than that. For developers, HTML is a wave of technologies that are evolving and gaining browser implementations along roughly the same time-line as the markup language itself. Many of the related technologies are being spearheaded by the Web Hypertext Application Technology Working Group (whatwg.org), but still other technologies in this genre are driven from elsewhere. For example WebGL, the 3D rendering en/Apps/Getting_Started)engine for Web Apps, is driven at Khronos (http://www.khronos.org/), and Mozilla’s WebAPI team (https://wiki.mozilla.org/WebAPI) is leading a collection of relevant API work including a comprehensive array of device-specific APIs. And the W3C was a Device APIs Working Group ( http://www.w3.org/2009/dap/] )

Mozilla is also investing heavily in an initiative to facilitate the use of standards-based Web technologies to build applications that can be installed and used in the same way a “native” applications would be.

There are many reasons that doing so might be desirable, not the least of which is the ability to build much or all of your application for use on many different devices and platforms using a single set of development technologies.

Developers can already build HTML Applications (with help from the HTML5 Apps documentation https://developer.mozilla.org/en-US/apps ) and submit their applications to the Mozilla Marketplace (https://marketplace.mozilla.org/ ).

App versus Page ?

When people start talking about building apps with HTML5, one of the early questions that comes to the conversation is “What’s the difference between an app and a page?”

This is bit of a difficult question to answer because of the very wide range of answers which can all be true, but which may be completely different.

While your HTML5 app should be more than a simple HTML5 page, technically speaking it doesn’t have to be. Using the steps outlined in the guide “Getting Started with making (HTML5) apps” (https://developer.mozilla.org/en/Apps/Getting_Started ), you could simply create an apps manifest file and submit your HTML page as an app.

Read the rest of this entry »

Back to Technical Evangelism

I joined Mozilla about 5 months ago.

My manager, Stormy, warned me that getting up to speed at Mozilla would be more difficult than I expected, and of course, I didn’t really believe her. My manager at Microsoft told me the same thing on my first day of work there, and it wasn’t really true. Microsoft was just big, not hard to adjust to.

Mozilla is DIFFERENT.

When I interviewed with Mozilla, my impressions were the same as most people who are not participating Mozillians.

Mozilla makes FireFox and Thunderbird and is Open Source, does standards stuff, etc. It all sounded cool and I “thought” I “got it”, but I didn’t. In truth, I still don’t completely, but learning is fun.

During the interview process I was impressed with everyone’s passion about “The Mission”, though, even having read “The Mission Statement”, I still had no idea what it all meant. The passion, though, was clear to see.

My first day of work at Mozilla was day one of the organization’s yearly “all hands” gathering. That event lasted a week and I met literally hundreds of my new co-workers. I also came to begin to understand that “The Mission” had almost nothing to do with “products” and everything to do with helping to change the world by propelling the Open Internet.

People at Mozilla tend to be idealistic in that they believe they actually can change the world. After just spending a decade at Microsoft this seemed unrealistic to me. The funny thing is that in the short five months that I have been here at Mozilla, I’ve actually seen a number of examples where Mozilla IS changing the world !

I flew home after the ALl Hands Week and I expected that, on Monday, I would start my efforts helping people learn and use open web technologies.

Instead, by the end of that Monday, I had been hijacked to work with the Business Development Team for the new Mozilla Marketplace. It made sense, I was new – so I had time, and I do have a “technology in business” background as well as much experience consulting with organizations large and small about solving there specific problems, using specific technologies.

So, over the past five months I’ve talked with hundreds of great organizations, large and small. Organizations that are doing amazing and NEW things with the Web. I’ve attended events in the USA, England and Spain and, unexpectedly learned more than I ever expected about Mobile computing. (I was never really interested in Mobile prior to coming to Mozilla)

Now after five months – I’m getting back to “Technical Evangelism”. The Apps Business Development team has had a bit of time to catch it’s breath and start to distribute the “partner engineering” function and my hope is that this will let me detach from all the “consulting” and tech support that I’ve been going and get back to building and offering GUIDANCE.

I’ve become very passionate about both HTML5 and multi device development and I think there is great opportunity to help people that are new to HTML/JavaScript/CSS, as well as people that are experienced but adapting their skill sets to HTML5 “Apps” development.

So my plan is to continue to focus on HTML5 from an Applications perspective. You will be surprised at how much you think you can NOT do with HTML5 that you actually can do. I know I’m surprised every day.

So, how about some help ?

What questions / problems do you need solved or answered that fit in the following question/statement.

I’m building an Application using HTML 5 and I don’t think it’s possible to (fill in here).

Example: Example: Protect my source code.

I’m building an Application using HTML 5 – how do I (fill in here)?

Example: Include my Twitter Feed without a Server Proxy

I’ll post articles here on MisfitGeek.com, but I’ll also post them on Mozilla Hacks (http://hacks.mozilla.org/) you should read them on Hacks because you get articles from ALL the folks in MDN !