Using Phonegap Developer Tool with Ionic

While working on my app for the 30 day challenge, I was looking at the Phonegap site about how to build the final app and I saw the Phonegap Developer App.

This app is in two parts, there's the CLI and an app you install on your phone that allows you to run the app you're building on your phone. Kind of like a live reload, but on your phone, how cool is that.

The problem was I'm building an Ionic app that is served through the Ionic CLI, so how do I get my app to run on my phone through the Phonegap developer tool.

Looking into it I found this great article on Devgirl Holly Schinsky's blog, in which she says that you need to run the Ionic app through the Phonegap CLI then when you run it you are given an IP address. Then you open the Phonegap Developer app on your phone and this gives you another IP address, double click on the IP address and change this to match the IP address that the Phonegap CLI has given you and boom your app appears running on your phone.

Then if you go back to your IDE and make any changes they appear automatically on the phone, which is awesome.


30 Day App Challenge

Recently on the Ionic forum Bjorn Holdt announced that he was going to make an app  and get it released to the app store in 30 days. He then encouraged others to join him and see if they could make an app and get it released in 30 days.

After reading this I thought that it would be a great challenge and get me moving on an idea I have had for an for awhile.

The idea I have is related to my other passion in life (besides working with Ionic) which is Brazilian Ju Jitsu. I'm planning on building an app that allows people training in Brazilian Ju Jitsu (BJJ for short) to take notes and record small videos of techniques they are learning in lessons. Then later they can go through the notes/videos they've created and remind themselves how to do a certain technique.

The current status of my app is I've created the first few screens in Ionic and started planning the flow through the app for a user.

Like Bjorn has I plan to write some more posts on the progress of the app, but this is the start for the 30 day challenge.


Email clients for Android and hopes for Google Inbox

Over the years I've tried a number of email clients on my Android phones. I've used MailBox, CloudMagic and the default Gmail client. Now Google is about to release a new Gmail client which looks really interesting. I've just sent off my request for an invite to use Inbox, hopefully I'll get one.

One thing I do use a lot in Gmail is labels, I have a number of them for the different type of emails that I get, ones for newsletters, ones from agencies and friends. For each label I have a filter that automatically puts any email that comes in with its label, sometimes completely skipping the Inbox.

When I was using MailBox (which from time to time I go back to) the main problem I did have with it was that it didn't support the label/filter system that I already had in place. I do like the MailBox feature that allows you to mange your emails, e.g. snooze your emails, read at the weekend etc. All great features, but I would like to be able to manage an incoming email, then forward to one of the labels I already have set up in case I need to find it later.

Hopefully Google Inbox still supports the labels I've got set up, if not then maybe I should change how I manage my email then Google Inbox or MailBox will be ideal.


Ionic app coming along

Lately I've been working on my first Ionic based app, I've found that working those 20 minutes I have on the train into London,really helps in getting that consistency that is needed to get a side project going.

The app I'm working on is for martial artists to record short videos of techniques they are shown in class. Then later they can go back review the video of a technique and remind themselves of how it should go before they go to their class. A lot of martial artists I know watch a lot of technique videos on YouTube and spend a lot of time searching for videos that show the current technique they are learning, even if it is being demonstrated by someone other than their instructor. So my idea is to allow them to create their own personal video library that the can refer back to.

The app has two main views, the first is where they can add a title and the date of the video entry they are going to make and the second view is of all the saved videos they've made ordered by date.

The first problem I had when starting development was how to manage the navigation between screens. I was use to the way jQuerymobile handles this by creating complete pages all with a header that is repeated in each separate page. Ionic doesn't do this, and I needed a way to have multiple pages and be able to navigate back and forth between views.

I found some great examples on Codepen.io one of them showed how to use views within Ionic and manage the navigation between view using the ion-view directive.

So my application is made up of a series of templates, each containing a ion-view component that loads into the ion-view component within my main index page. The ion-nav-view component keeps track of the current view and can navigate back to the previous view when the user clicks on the back arrow.

One of the things I love about Ionic is how it uses smooth CSS3 animations for the transitions between views, all that are available by default. Transitions don't need to be set up as they do in jQuerymobile.


Using Brackets

I've been using the latest version of Brackets this evening. It's really improved since I last used it. The themes are great and switching between them has improved. 

I also install a plugin for Ionic, this is great. It allows you to create a project through the plugin, you point to where you want the project to be created, what type of starter project you want and off it goes and sets up the project for you. I've also found a good tabs plugin that creates tabs in the top of each page (it also uses the icon for the file type e.g. HTML5 icon or the JS icon). Brackets is really becoming a powerful editor for HTML, and it is also a great example of what you can build now with web technologies. 

I'll carry on using Brackets for a while, see how it goes, but the current version looks good.


Two Years Contracting

I’m coming up to two years of contracting and it’s been a voyage of discovery. After contracting for a short while now I do think that it is still the way forward for me, but it has always been plain sailing. Here’s what I’ve learnt over my first few years of being a contractor:

Get yourself a good accountant from the start. One that is available to answer your questions, ideally one that gives you a single point of contact.

If you aren’t 100% happy with your accountant, change them as soon as possible. This is your business so you must do what is best for your business and if your accountant doesn’t answer your questions then change them.

Keep track of all the invoices you send and the receipts that you get every time a invoice is paid by an agency. When agencies pay your invoice they usually send a receipt, keep it and keep a spreadsheet to track which invoices go with which receipts (not all agencies put the invoice ref on the receipt).

Have a good accounting system, spreadsheets are ok but a good accounting system like Freeagent are really helpful.

If possible get the agency to pay weekly, it keeps money coming into your business account and if you get bills coming like VAT bills or corporation tax you have the money there to pay and you aren’t waiting for invoices to be paid once a month.

Learn to be able to sell yourself to agencies, while they can be a pain they are also help get you work so a means to a end.

So far I have enjoyed being a contractor I’m not suck in a role that I’m not enjoying, I have more control over the work I do and what technologies I work with.

But you have to remember that you are running a business and it’s your business so you have to make decisions that help make your business grow. Something I’m still learning.


Using Ionic Framework

I'm working on my first Ionic framework based app, a training app for Brazilian Ju Jitsu practitioners. It is the first time I've used Ionic, but from what I've seen of the framework it looks awesome.

I've just finished my first AngularJS project so I know the basics of AngularJS, which is a great JS framework (reminds me a lot of how I use to work with RobotLeg, the ActionScript framework, something I'll have to write about later). 

So the main things I like about Ionic are, one its using AngularJS, and two the great set of components that Drifty have created.

So for the first part of my app I've decided to use the basic starter app that Ionic provides. All this does is give you a empty shell of an app that you can start working with. There's other types of app that you can get through the Ionic. There is the tabbed view, a app that has tabs. The slide menu app, one with a slide in from the left menu and the blank app, which I'm using.

The reason I went for the blank version of the starter app is because I'm still deciding how I want the app to work. 

The first task I tackled is adding UI-Router to manage the views and states of my app. I haven't used UI Router before so should be interesting.