Tag Archives: Programming

Simple URI Tip for HTML

You may already know this, in which case you ran across it randomly, or are the kind of developer that reads specs. But if you haven’t run across this, prepare for a face-palm moment wondering why you didn’t know this years ago.

Using a uri like the following tells the browser to get the content over whatever protocol the current document was fetched from.

<script src="//platform.twitter.com/widgets.js"></script>

Think of all the little annoying server side script you’ve written to determine the protocol based on the request variables in order to avoid security warnings. Never again. Enjoy.

One warning… don’t do this in phonegap.

More detail, and links to rfcs at stackoverflow.

Strange NuGet Error

One of the projects that I work on uses NuGet for library management. We have a rake task that runs build, clean, etc. One of the rake tasks runs NuGet.exe which is stored in a tools directory. That way, everyone uses the same version of NuGet even if they have different versions installed in their program files directory.

For some strange reason I was getting errors when running the rake task that updated the packages. Sometimes it was a generic error, sometimes “Archive file cannot be size 0”. I verified that the NuGet version hadn’t changed. I tested on other machines. I tried running the command by hand to take rake out of the equation. On one machine, it wouldn’t work. Every other machine fine.

I even wiped the folder and checked out again with git. No luck. Finally, I decide to look for a NuGet local cache and see if I had bad packages. Delete the contents of C:\Users\YourUsername\AppData\Local\NuGet\Cache\ and this problem will go away. Hopefully this info saves you some time.

VicinityBuzz: Writing A Mobile App

This post is intended to go through the process of writing and publishing an app. It will be a high-level introduction. The idea is that future posts that will dig into specific topics in depth. This post will be updated to link to those future posts as an index of mobile development topics. The app I’m describing is VicinityBuzz and it’s available here.

Product Vision

While I had been thinking about writing a mobile application for a while, I needed an idea to stick with to completion. The app stores are relatively young, but they are fairly saturated, and bringing something new to the table was a challenge. Recently I read Eric Ries’ The Lean Startup and I do like the idea of MVP(Minimum Viable Product), so I didn’t feel the need to have a telephone book of requirements. I was just looking to have an original idea for the app stores.

In the case of VicinityBuzz, I have always felt that there are not enough good ways to search social media, particularly by location. There are social media sites like FourSquare solely dedicated to location, but I’m referring to something else. Using networks where content is the reason (not location) but by location. For instance, at a conference, users often hashtag their tweets with the name of the conference. But not always. And the hashtag will draw attention from people not at the conference. That’s fine, and there can be useful conversation by just using the hashtag, but what if I want to see posts of all users that are actually at the location.

app screenshot

This is particularly true of news events. On the day of the shootings at Chardon High School, I used the application to see what students and families in the area were posting about. They were each telling their own version of the story. It was heartbreaking and much more informative and up to date than the news being released to the public. Hashtags were useless in this case, for two reasons. First, the students weren’t hashtagging their posts, they didn’t need to. They were posting to their real-life friends and thus already connected on twitter. Second, the tag was full of a lot of the reaction from the public around the globe. That was interesting too, but it wasn’t was I looking for. I wanted facts and eye-witness accounts. It was like CNN’s iReport, but on steroids.

Platform Selection

Native or not? As a web developer, I chose PhoneGap. It’s a mobile platform framework that uses html and JavaScript, which are skills I already have. And the application didn’t have very many device needs that would require native access. GPS is the only device call I make, and that is easily accessible from the PhoneGap JavaScript API. I knew it would be faster than for me to learn the ins and outs of the Cocoa framework and Objective-C, although I am in the process of doing that now for future apps. I have written some small applications in the native iOS sdk, and even paired with some developers to help bootstrap their iOS work, but I just didn’t feel comfortable writing an app consumable by the general public yet. Along with PhoneGap, I’m using jQuery mobile.

Essentially PhoneGap provides project templates for your platform (Android, iOS, WP7, and more) that create a shell of an application that hosts a browser control. All of your files go in a directory (like resources) and get loaded up by the browser control.

app screenshot featuring controls

Using PhoneGap gives me a version that is easily ported to Android and WinPhone 7. Although those markets lag Apple’s AppStore in terms of developer revenue, I want to cast the widest net possible with this application for obvious financial reasons, and also to learn. The more feedback I can get on the application, the better I can make it.

At some point I may go ahead and do a native rewrite. But for now, I’m very happy with what is possible in PhoneGap and jQuery mobile.

Prototyping

I started development with jQuery UI in a browser. Using the built in JavaScript debugger in Chrome was easy. Note you could just as easily use Firebug in Firefox, or the IE Developer tools. Once I was satisfied with functionality, I swapped jQuery mobile in place of jQuery UI and moved the app into the PhoneGap container. More on that in the next section.

One note: If I had to do this over again, I would have simply started with jQuery mobile. It’s not that hard to get started with as the docs are great, and it’s best to just start down that path.

App Store Submission

Thus far, I can only speak to the Apple Store submission process. After going through the steps provisioning portal, it was fairly easy to test the app on a device. In order to submit to Apple, you then create a profile for the application (screenshots, contracts, payment details, etc) and submit a signed binary to Apple for review. The process of signing a binary for release can be a little tricky, but the walk-through on Apple’s developer portal helps a lot.

One thing to note: Apple requires you have a support page. I stole an idea from the Trello folks, and used a public trello board for this purpose. It took less than 5 minutes to setup.

Marketing

I created a basic web page with a description of the application. Apple has a page for making the link to their store. If you are interested in opening the store automatically, either see the options in this stackoverflow post, or add the query paramter “ls=1” to the url you get from the link maker.

What’s Next?

Apple just announced “the new iPad” so I have to do some updating to support that. I haven’t read the new docs, but I assume this means a high-res iPad splash screen and icon. All of my other assets are web assets and scale accordingly.

My next steps are to add a simpler user workflow, a refresh button to update your current search, and add some social networks like Facebook and Instagram.

After that, I’m going to start porting to Android and WinPhone 7. Since the application is already written, it should be as simple as getting a PhoneGap project running for each environment. I have also considered the Mac App Store and the upcoming Win 8 Marketplace for desktop application versions.

Finally, I’ll blog more in depth about some of the topics covered, and provide links to those posts on this page. Mobile development is rewarding, but can be challenging for those coming from a web or desktop background. I’d like to pass on some of the things I learned so that others working in mobile can save some time.

Feel free to provide feedback and questions if you have something in particular you’d like me to cover. And checkout the application!

Getting Started With iOS Development

I’ve been playing with development in several of the mobile platforms over the last year, and for iOS in particular. Many developers are intimidated because of the differences between objective-c and other languages and the differences between cocoa touch and other frameworks. How to get started is one of the most common questions around.

First you’ll need an apple computer. There are some ways around this, but they are on the gray-side of the law and certainly outside of the OS X terms of use.

Next, you’ll need Xcode. Download it for free at https://developer.apple.com/xcode/. Xcode is the development environment for both OS X and iOS based applications. You can develop for free, and even test iOS apps in a simulator. If you join the iOS developer program, for $99 / year you can deploy to devices (up to 100) for testing purposes. You can sign up for the program at the iOS portal, which also hosts all kinds of tutorials and guides available to members and non-members.

Apple just recently posted this a getting started guide that will walk you through the basics. They have many other great docs available on the iOS developer site, including this objective-c primer and a longer version here.

I recommend The Big Nerd Ranch Guide for iOS. Among the iOS developers I know, it’s considered the best book to start with.

And for troubleshooting, no post about iOS would be complete without mentioning stackoverflow. It is the best site for any programming question, not just iOS / objective-c questions.

If you take the time to use the resources available, and work with (not against) the platform and supporting guidance, I think you’ll find iOS to be a friendlier platform than it’s reputation would suggest.

Flex is a Relic and Silverlight is a Zombie

…or some other catchy metaphor that will grab your attention. These technologies were hot over the last 5 years. Flex gained a particular amount of popularity in the Java community where UI technologies have a bit of a spotty record (that’s like saying my Bengals have a bit of a spotty record over a lifetime). Silverlight gained a lot of traction among Microsoft developers who actually cared about design and UX. Many alpha-geeks of the Microsoft space were running around giving conference talks about the MVVM pattern, and sharing code on codeplex. So what happened?

Both of these technologies are going to fade on the public web. Tablets and mobile devices are too big a share to ignore. Html5, phones and tablets did them in. The heavy hand of Steve Jobs probably gets credit for the coup de grĂ¢ce. The browser vendors and phone OS creators have really put their weight behind Javascript and Html5. If you have have that skill-set right now you can create:

  • Web Content
  • Mobile Web Content
  • Mobile Apps via Appcelerator
  • Mobile Apps via PhoneGap
  • Windows 8 Metro Apps

That’s a pretty wide reach for a markup / scripting language set.

So what do you do if that’s your trade? You work as an AIR/Flex developer or Silverlight developer, what do you do? There are good options for each camp, and some universal options.

Flex Developers

I think this is the slightly less promising path in the long term (despite it hitting a much higher peak than Silverlight). That said, Flash and Air will live on for a while, and you have some time to make a transition. Additionally, the ability to use the Adobe tools to make mobile applications provides a bridge to the hot mobile market. And you can make long term plans to transition to another cross-platform tool (PhoneGap, Appcelerator, etc), or go native. If you’re in the Adobe camp, new tools like Edge are likely to ease the transition to the standards-based technologies of the web.

Silverlight Developers

Similarly, Silverlight won’t be gone tomorrow. Intranet applications that need rich functionality (and simple deployment) are still a nice fit for Silverlight Desktop applications. And the adjustment to WindowsPhone 7’s flavor of Silverlight is straightforward, though I would be cautious and investigate the financial realities of that market. Finally, while Windows 8 Metro Apps don’t specifically use Silverlight, they can use C# with XAML and a subset of the .Net libraries that emphasize a security sandbox and async data connections. Sound familiar? That’s because they re-animated the corpse of Silverlight and made it an option for writing Metro apps. Long term, you should probably learn to use the Html5 / JavaScript hooks for Metro due to the ubiquitous nature of those skills. But isn’t it nice that you can learn the new API (WinRT) while keeping C# and XAML, and then make the languages switch at your leisure.

For Everyone

Both camps should embrace these newer web technologies and the UI skills they picked up during their time with the respective technologies. Good user experience and design are rare skills in developers, and retraining the languages and tools should be the easy part. Keep your black turtlenecks and invest in the next tools rich applications. You already have a leg up.