State of the Web Development

Marco ParenzanEdition 2014

Click icon to add picture

Marco ParenzanFormazione & Divulgazione con 1nn0va

Formazione & Progettazione con ITS Kennedy

Ricerca e Innovazione con Servizi Cgn

www.slideshare.net/marco.parenzan

marco [dot] parenzan [at] libero/live [dot] it

www.innovazionefvg.net

Developer e Architect in .NET e Web

Cloud (Candidate) Developer

Loves functional programming

Some videogames for fun

WEB PILLARS

Web is build upon…

Information is Content or Data HTML to explain Content

JSON to explain Data

CSS3 Content Presentation

JAVASCRIPT Content and Data Manipulation

HTTP Content and Data Transport

Client HW/SW appliance for content and data consuming

Modern Html

Html5 is pure content Old Html (1-4) is pure presentation; useful content only for humans

Modern Html is just Syntax and Semantic, no more presentation

Html is adorned with qualification (class attributes)

JSON

Modern Data representation

One of the pillars of the Rich Client (Web) Revolution AJAX

No more XML (unuseful in Web Clients)

Difference between Content and Data

Data is information organized as a name/value containers

Content is information organized as a role/meaning container

When Information is Content?

Think for example about Tables

Information is content when you load table information server side Page take longer to load

But table is full

Your html page come from a web SITE

When Information is Data?

Think for example about Tables

Information is data when you load table information client side Faster loading

More responsiveness

But table is initially empty

Your html page come from a web APPLICATION

Google indexing don’t execute AJAX

So you need to model information as HTML and load it server side

Take care of your informationsInformations don’t depend on presentation

Html is no (more) free

Writing Html is not a waste of time (it’s not mapping)

And modern web is a polyglot environment

So learn HTML and write it by hand

CSS3

CSS3 gives presentation information to the meaning (expressed by classes)

Cascading is on classes Not on style attributes

Real role separation between Designer and Developer

LESS & SASS are your new friends Find which is best for you (not absolute best)

CSS frameworks offer (Bootstrap)

JAVASCRIPT E TYPESCRIPT

Content and Data Manupulation

In the client (browser)

New Opportunities OOP and DDD

On the Client (Browser)

Javascript Fullstack

Gives Javascript based applications “enterprise class” organization http://www.smashingmagazine.com/2013/11/21/introduction-to-full-stack-javascript/

Architectural Pattern View Models

Data Binding

Modularization AMD

Build systems Tasks

Compilers/Code Generators

Http, the web protocol

Protocol for transfer of various data formats between server and client. Plaintext

Hypertext

Json

Images

Video

Sound

HTTP is a stateless protocol In other words, the current request does not know what has been done in the previous

requests.

ReST

Http is no more just Request/Response, GET and POST

REpresentational State Transfer

Url A URL (Uniform Resource Locator) is used to uniquely identify a resource over the web. URL

has the following syntax: protocol://hostname:port/path-and-file-name

Http Verbs Http is a full Web Services with actions (verbs) on resource

No need for SOAP

Client

A three dimensional problem

1. Information Content

Data

2. With Tool Browser

Apps

3. On Device Desktop

Mobile

HOSTING THE WEB

Legacy Hosting

Where On Premise

Provider

Features Tailored on a fixed scenario – sized for maximum capacity

Modern Hosting

Where

On Premise

Cloud

Features

On demand

Self Service

Multi Tenant

Elasticity

Scaling

Availability

Ubiquitous

Flexibility

In one word: quality of service

Microsoft Cloud Initiative

Windows is Microsoft Cloud Platform… …From Windows Server is for Private (On Premise) Cloud…

…to Azure is for Public Cloud…

…through the Hybrid Cloud

Same code base, same tools, same experience

ON THE WEB WITH ASP.NET

Server: the missing part (up to now )

Web is content and data availability through HTTP protocol

Which tools expose HTTP protocol?

History of Web Server Models

Request (GET) of static content

Request/Response of dynamic content CGI

ASP

PHP

Designer era (event base) Web Forms

Structure/Enterprise class models MVC

Ruby On Rails

ASP.NET MVC

Modern Web Applicationswith One ASP.NET

Legacy ASP

Web Forms

Modern Web Pages/Razor

MVC

Services Web API

Real Time SignalR

Apps Single Page Apps

State of the Web Development

Marco ParenzanEdition 2014