May 142013
 
 May 14, 2013  Posted by at 1:29 pm JS & TS, Life of Iris, Telerik Tagged with: ,  Add comments

This is part two of my programming session with mum where she creates her first application. So far we have spent one hour and ten minutes and we have created a first project with JavaScript using Icenium. We have an idea for an app with ten herbs translated to three languages, and we have created our model and the data. It was time to start working on the View and connecting the data with the view.

Our first attempt was with jQuery. Explaining what jQuery was turned out to be a bigger challenge than I thought, jQuery is many things, and we ended up looking the JavaScript and discussing the functions. WE spent one hour trying to work with a view, but we ended up creating a new project with Kendo instead. I spent some time explaining what Kendo does, and how the controls work.

Time passed: 2 Hours 10 minutes

We started by continuing on the hello world example (one of the templates that come with Icenium Mist), and removed everything we didn’t want. We had a look at which controls Kendo UI Mobile had
and decided that a listview that on click navigates the user to a detail page was what we wanted.

We copied an example we found and removed what we didn’t need, and used our own data instead.

Time passed: 3 Hours 40 minutes

Afterwards we used the Kendo UI Mobile Theme wizard to pick out a look for our app, and created four header images to fill out the empty app.

Time passed: 4 Hours

Once happy with the look and feel it was time to publish. I’ve already published an Android app so I’ve paid the 25USD (I believe it is) developer fee and registered.

Under properties for the app we removed the permissions we didn’t need for the application, used pixlr.com to create the required icons, and used this site  to create the 9-patch splash screen image for the Android application.

For certificate we selected Create => self signed identity. Once that was added we simply created the package. I logged into my Google Play account and uploaded the package, picked a name, set a description and added some images (I used Snagit for the screen shots).

Mum left to go to a Jazz concert with a friend, and I clicked ‘Publish App’

Time passed: 4 Hours 30 minutes

Mum said she really enjoyed it, and she would love to do it again – and add more functionality to the application. She came up with quite a few ideas that we didn’t have time for, but we wrote them all down for our next programming session. Nothing beats family time 🙂

Icenium lets you test the app on your phone by simply scanning a QR code

Icenium lets you test the app on your phone by simply scanning a QR code

When she came back from the Jazz concert she ran the app on the device, you simply create a QR code and scan it and it installs the app on your phone with Android. She was all smiles when she saw it on the phone, I know that feeling- the feeling of accomplishment! She asked for the code, ‘ I want the code’. Hm. I had signed in with my account when we made the app. I created a GitHub account for her, and with two clicks pushed the app to the repository. Then I created a Icenium Mist account for her and pulled down the app. I made sure to explain the basics of GitHub, and she carefully took notes.

Mums GitHub rep

Mums GitHub rep

Mums notes :) Nope, I can't read them either :D

Mums notes 🙂 Nope, I can’t read them either 😀

Time passed: 4 Hours 50 minutes

Here is the application, published on Google Play. We probably need some more functions to have it published in App Store so we’ll wait with that. I had such a great time, being able to share what I love so much doing – programming- with my mum and seeing her liking it as much as I do. And as for Icenium?- Well, I really like it and will absolutely use it more- so expect more blog posts on Icenium 🙂

The app

The app

This week and the week after that I’m organizing two User Group meetups on Kendo UI at the Sweden Pluralsight Study Group- so hopefully I’ll get to sharpen those skills a little bit more 😀

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)

What is 3 + 9 ?
Please leave these two fields as-is:
IMPORTANT! To be able to proceed, you need to solve the following simple math (so we know that you are a human) :-)