DEVELOPERS BLOG

From idea to app in < 2 weeks: Creating an app for Herrle’s Country Farm Market

App preview

When Brian Zubert approached me with a great idea he had to create an app for Herrle’s Country Farm Market, I was pretty excited to help out. He explained to me the premise of what needed to be built: a simple app that wrapped a few pages from Herrle’s existing website, did some basic integration with core apps, and highlighted Herrle’s existing social channels. This approach offered an easy way for them to have a presence on the platform, and since their website already uses a responsive design they could make use of their existing web assets and resources.

Web or Native?

When it came down to choosing which platform to build the app in, my initial thought was that I could do it really fast using BlackBerry WebWorks, and I could have, but when it was mentioned that perhaps I could use Cascades and QML, I was intrigued.

 

Those of you who know me know that I’m a web guy. I live in a world full of JavaScript, HTML, and CSS. Very rarely do I poke my head outside of the proverbial web-developer-box, but for some crazy reason I decided to look over the fence to see what Cascades and QML had to offer me, and it was AWESOME.

By making use of WebViews in Cascades, I was able to get the best of both web and native worlds: an app that displayed web content, driven by a sleek Cascades chrome. What was especially great about this approach was that it allowed Herrle’s to update their website at will, and the app automatically displayed the new content to users.

This past week we published some amazing resources, the Built for BlackBerry Boilerplate templates, for both WebWorks and Cascades. These boilerplates allow developers to rapidly develop an app that possesses the signature BlackBerry 10 look and feel the users have come to expect. While in this case I wasn’t necessarily looking to create a true Built for BlackBerry app, the boilerplate still provided me with a solid place to start right out of the box.

The App

To get started, I downloaded the Cascades Built for BlackBerry Boilerplate sample and imported the project into Momentics. That’s really about it! Within two minutes, I had an app that integrated with BBM (Invite to download, BBM Channels), the Invocation framework (for sharing content to Facebook, Twitter, etc.) and had features like Window Covers, Splash Screens, Application Menu (swipe down), etc. As a web guy, this was a great place for me to start modifying the code, and more importantly, learn from.

The next step was to figure out how I wanted the application to function. I didn’t want to hard code a ton of information, or any for that matter, into the app itself because perhaps we’d end up reusing it in the future. Again, I looked back to my web roots and what came natural to me (no, not XML, how dare you!) and decided to use JSON to store all of app settings. For bonus points, I even created a handy web form to generate the JSON for me.

JSON

Since nearly everything in the app needed to be dynamic, the entire app was customizable, including the text labels for Tabs and which URL the tab would load. Extra details were also stored in the settings JSON like Herrle’s Twitter username, Facebook page, and even a unique UUID, which is needed during BBM registration.

JSON2

The web form provided two output methods; Download JSON or Display JSON, in the end all that really matters is that JSON data is stored in a file aptly named settings.json within the assets folder of the project.

And with that, an app is born! Check out the Herrle’s Country Farm Market app in BlackBerry World.

Summary

I learnt quite a bit during the development process.

As terrible as it is to admit, before I began working on the app I literally had no clue how to use Momentics, let alone write a native app with Cascades and QML. I was shocked at how user friendly Momentics was, and how natural QML felt to me, a JavaScript coder. After setting up my environment I was up and running within minutes, able to import the Built for BlackBerry boilerplate sample, and have it running on my shiny new BlackBerry Z30.

If you find this post useful, have questions, or just want to keep up-to-date on the world of BlackBerry Development, follow me on Twitter @chadtatro


 

Built for BlackBerry “Boilerplates”

Cascades
WebWorks

Chad Tetreault

About Chad Tetreault

A developer at heart, I’ve been coding in some shape or form since the age of 13. Nowadays I focus on building awesome cross-platform (Android, iOS, BlackBerry) mobile web applications powered by Cordova, JavaScript, and AngularJS.