Archive for March, 2012

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

Click on the Ubuntu App Button on the top.

Start typing the name of the application you are looking for.

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.

[sourcecode language="JavaScript" htmlscript="true"]

sudo apt-get update

[/sourcecode]

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.

[sourcecode language="JavaScript" htmlscript="true"]

sudo apt-get upgrade

[/sourcecode]

Now we need to get the Java JDK

You can install it from your open terminal:

[sourcecode language="JavaScript" htmlscript="true"]

sudo apt-get install sun-java6-jdk

[/sourcecode]

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:

[sourcecode language="JavaScript" htmlscript="true"]

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

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

[/sourcecode]

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.

[sourcecode language="JavaScript" htmlscript="true"]

java -version

javac -version

[/sourcecode]

And you should see something like this.

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.

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.

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.

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 !