Web Applications Are Technically Awesome

How can we do [this]?When creating a complicated solution there are traditionally two choices.

Website or native application?

What are the benefits?

Available to all internet connected devices

Singular code based

Can use existing infrastructure

WebsiteAccess to device functionality

Compiled application has great performance

Only requests data as needed

Application

How about a web application?

A web application is not a website...

A web application is an application utilizing web and [web] browser technologies to accomplish one or more tasks over a network, typically through a [web] browser.

Separation of application from resources

Request only the data needed

Allows user to work with data in the device, limiting requests to remote resources

Allows offline use

Future proofing: application and resources can be altered separately

The Magic

HTML5 Specifies a massive array of tools for developers to build rich ecperiences within the browser

Angular JS A toolset for building the framework most suited to your application development needs

Smart views Dynamic template switching delivers just the content needed to the targeted device

HTML5

It’s not a buzz word or the next big thing. It’s a long boring set of specifications for the latest version of HTML.

What it specifies is a massive array of tools for developers to build rich experiences within the browser.

Superheroic JavaScript MVW Framework

HTML is great for declaring static documents, but it falters when we try to use it for declaring dynamic views in web-applications

AngularJS is a toolset for building the framework most suited to your application development.

Every feature can be modified or replaced to suit your unique needs.

MODEL VIEW WHATEVER- It’s like MVC but way cooler

MODELLive data

VIEW CONTROLLER/WHATEVER

DEVICE

USER

Sees

Update

s

Manipulates

Uses

WEB APPLICATION FRAMEWORK

MODEL

VIEW CONTROLLER/WHATEVER

SERVICES

RESOURCES

Update

s

ManipulatesLOCAL DATA STORAGEDATA API’SPARAMETERSLANGUAGE

Resources

Data

Logic

Display

Interactions

Full separation of

Reusable directives

Template switching

Variable view states

CSS first approach

SMART VIEWSALL DEVICES

SWITCHDevice size (small,normal)TouchResolution (pixel ratio)User types: Trial, registered, anonymous

VIEW STATEDevice size (small,normal)TouchUser types: Trial, registered, anonymous

CSSDevice size (small,normal)Browser typePrintApplication state

Compass / SASS

Vector font icons

SVG’S

Fully fluid and responsive

CSS Transitions and animations

HTML5 Elements

Live input validation

Built for expansion

DIGITALLY PIMPED

By combining the best available technologies and practices we've successfully proved that web applications are a robust solution for delivering web services to internet enabled devices.