WebApp : une introduction

1. Application web ?

Web app ?

A web application or web app is any application software that runs in a web browser. It is created in a browser-supported programming language and relies on a web browser to render the application.Source : http://en.wikipedia.org

Rich Internet application ?

Rich Internet application (RIA) is a Web application that has many of the characteristics of desktop application software, typically delivered by way of a site-specific browser, a browser plug-in, an independent sandbox, extensive use of JavaScript, or a virtual machine.Source : http://en.wikipedia.org

Web service ?

A software system designed to support interoperable machine-to-machine interaction over a network.Source : W3C

Application native et / ou

Application web

Le dilemme

2. WebApp or not WebApp ?

2.1 Les avantages

Déploiement et maintenance

Ressources clients

Intégration de service tiers

faible dépendance du client

Multi device

2.2 Les inconvénients

Difficulté de développement

Online / Offline

Maitrise des données

Choix des versions

3. Web App & histoire du web

1990 - 1992 : les débuts du web

1993 - 1998 : tableaux & images

mrshowbiz.com - 1998

1998 - 2002 : Flash is king

http://free-flash-website.com/login/mm/flash/fla_4_5_6/applications/CD_roms/res_cd_rom/

BU/free4u_vCS5.html

2003 - 2005 : CSS devient le standard

myspace.com - 2003

2006 - 2009 : Javascript s’impose

mail.google.com - 2005

2010 - 2012 : responsive web design

mashable.com - 2012

2013 - 2014 : web app

spotify.com - 2014

4. WebApp et modèle économique

business model & open source

Software as a service

Freemium

in-app purchase

Publicité

5. Application web & technologies

5.1 Frontend

HTML, la structure

L’Hypertext Markup Language, généralement abrégé HTML, est le format de données conçu pour représenter les pages web.Source : wikipedia.org

CSS, le design

Les feuilles de style en cascade, généralement appelées CSS, forment un langage informatique qui décrit la présentation des documents HTMLSource : wikipedia.org

Coté client : le css

Le Javascript est un langage de programmation de scripts orienté objet.

Source : OpenClassrooms

Préprocesseurs CSS

Frameworks web

Bootsrap

Foundation

Frameworks mobile

Frameworks Javascript

5.2 Mobile

Plateformes

Cordova Phonegap

5.3 Backend

API ?

En informatique, une interface de programmation (souvent désignée par le terme API pour Application Programming Interface) est un ensemble normalisé de classes, de méthodes ou de fonctions qui sert de façade par laquelle un logiciel offre des services à d'autres logiciels.Source : http://en.wikipedia.org

Langage de programmation

Frameworks

5.4 Stockage des données

Local storage & Base de données

5.4 Infrastructure

Hébergement

6. Mise en pratique

TP1

Récupérer le template : http://graphicburger.com/time-zone-app-ui/

Intégrer le template pour une utilisation multi supports / multi navigateurs

Technologies libres

Merci pour votre attention.