- Server Side / Cloud Service that she is going to use in order to create the API. Here we must answer some important questions like:
- What will I do if I get a huge spike in traffic?
- Will I need to manage it? Do I have to do it?
- How will I communicate with different clients?
- Which technology to use in order to store: data, state etc’
- Web technologies: HTML5, CSS3
- Mobile native app: Android, iOS and Windows.
Modern Web App
It’s not an easy definition since web technology is running very fast. Nevertheless, we can find certain features across successful web apps:
- Self Contained & Functional- They all have one specific goal and they do their best to provide the users the functionality to get to her goal. Few examples:
- “Offline first” – You will want your web app to work offline. It’s an important feature that will let your users be productive on places like: planes, subways and on spots like: Starbucks when you don’t have (always) good connection. Another very important benefit will be the improve in performance. Since the app will work locally (first) and then sync the state/data the users will get responsiveness that are far better from an app that need to ‘wait’ for network on every action that the user does.
|Ember.js – Don’t waste time making trivial choices||Angular.js -Lets you extend HTML vocabulary for your application||Backbone.js – gives structure to web applications by providing models with binding, collections and views|
- Device Aware – We all know that mobile is going ‘up and right’. So when you design your web app you should think on progressive enhancement and how it will fit to different screen sizes. Good examples to look at are: Gmail, Flipboard and Twitter. If you want to go deeper on this interesting subject there is a webcast on ‘mobile web apps’ I did with Oreilly three weeks ago. You can go over the slides as well.
Challenges and Solutions
- It save us the trouble to reinvent the wheel and built simple functionality like: CRUD operations, list, order, search etc’. It’s all baked in it.
- It provide us some powerful new features:
- Storing (static) assets: we can use AppCache. It’s our ability to save locally our html, js, css files and all the images, sound files etc’.
- Storing data: localStorage, IndexedDB, File API. This is a hot (and large) topic. I would suggest to read deeper on when and where to use each over at html5rock.com
Challenge: There are so many web services I would love to hook into my app – How can I do it without reinventing the wheel each time? In other words, I want to give my users the ability to edit photos, share on twitter, g+ and Linkedin (just to name few).
Solution: WebIntent! If you are familiar with the intent system that is flourishing in Android you know what I’m talking about. We now have a powerful solution for the web. Web Intents is a framework for client-side service discovery and inter-application communication. The code you need to add to your app is as simple as:
var sharingDetails = "Check out my...."; var intent = new Intent( "http://webintents.org/share", "text/uri-list", beerDetails); window.navigator.startActivity(intent);
Challenge: What can I do on old browsers that do not support HMTL5 very well?