
Blackberry has recently come on board with full support of HTML5. This is so easy it's actually fun!! I've recently decided to jump head first into mobile development with HTML5, and this is the first step to a broader world of development. I'm going to start very simple and the blackberry is my first target. I'm using a Window 7, 64 bit machine, so let's walk through the process and see how this works.
The first thing we need is an HTML5 page. I'm using Visual Studio 2010 and have created a very simple Hello Blackberry page.

Next up, we'll need the Ripple emulator. This is a nifty way to view your web pages in the skin of many devices such as Blackberry, iPhone, iPad and many more. Currently Ripple doesn't exactly emulate the actual device to perfection, but it's still a great tool to see what your app will look like and a lot more than basic functionality quickly across multiple platforms.
**FYI - IE9 choked on the download, however Google Chrome worked. It seems that when it comes to Ripple only Chrome will work. Also, Ripple does not work out of the box behind a proxy server, which is likely the case while at work. A couple URL's would need to be opened up and at least in my case, our cyber security folks would flip out. So Ripple has basically no longer become an option for me where I work, PhoneGap is next up for the work scenario. At home it works great, so let's continue.
I downloaded and ran the setup wizard accepting the default setting which took all of maybe a minute in total. So now I have Ripple on my programs list. Clicking Start and Ripple gives me this screen.
I'm really excited about this so far. Right away the option of
PhoneGap is just cool. I plan on doing some work with PhoneGap in a later post, but for now, we'll go with WebWorks as that is what's native for Blackberry.
Nice! The phone itself actually took up more real estate on my screen than I had, but scrolling down actually does reveal the buttons on a blackberry phone. The next thing I did was click Devices and chose Blackberry Torch 9800 and this looks much better.
There's tons of cool information to play around with in Ripple, so before I lose my focus and get lost in all the goodies, let's see what my Hello Blackberry page looks like in the Ripple emulator.
Back in Visual Studio I simply hit play, this gave me the localhost address of the page, http://localhost:9556/BlackberryDemo/index.html. Copy and paste this into the Ripple emulator and click enter. PRESTO!
That's all there is to it. Now by simply changing the device you can see the app in many different Blackberry devices. What's even cooler is that by switching the Platform to PhoneGap, you can view your app in devices like iPad and iPhone. Sweet!
In the Part 2, I'll go over the WebWorks SDK and the steps required in the code for the app to work with WebWorks.