Matija Grcic

2

Session

Introduction PWA RESTSolution

Closing

1Progressive Web Apps

4

Reliable

Fast

Engaging

60%

user experiences

4

Progressive Web Apps

5

Why build a Progressive Web App?

Home Screen

5

Increased engagement

6

Why build a Progressive Web App?

Work reliably

6

Improved conversions

7

HTTPS

7

How to build a Progressive Web App?

Responsive

Offline

Metadata

3G

Cross-browser

Transitions

URL

8

Indexability& social

8

How to build a Progressive Web App?

User experience

Performance

Caching

Pushnotifications

CredentialManagement

API

PaymentRequest

API

PWA

2REST Api

10

A truly RESTful API looks like hypertext.

Roy T. Fielding

11

Constraints that identify a RESTful architecture

Statelessness

Resource-orientation

Uniforminterface

Hypermedia-driven

application state

REST (REpresentational State Transfer) is the name given to an architectural style for networked software. The REST architectural style

was first identified by Roy Fielding and is documented in his dissertation[Architectural Styles and the Design of Network-based Software

Architectures]. The same term ("REST") and related terms ("RESTful", "Pragmatic REST", "High REST/Low REST" and others) can also

be used to refer to a varying collection of design patterns for implementing services on the web over HTTP. Fielding addresses this

discrepancy in the use of the term "REST" in his 2008 blog post, "REST APIs must be hypertext-driven."

11

Mike Amundsen

12

HAL - Hypertext Application Language

12

13

HAL's design is well balanced and introduces hypermedia without compromising too much on the

simplicity of JSON.

Mike Kelly

HAL - Hypertext Application Language

3SOLUTION & ANALYSIS

UmbracoUsed as Headless CMSExposes structured data

ReactReact App Frame (PWA App Shell)Used for views

WebApi.HalAdds support for the Hal Media Type (and Hypermedia) to Asp.net Web Api

Architecture

15

Webpack 2Code-splittingTree-shakingDetecting bloat

16

17

18

19

20

21

22

23

24

25

26

4CLOSING

28

Moving from Multichannel to Omnichannel

28

Mastering Omni Channel B2B Customer Engagement Report

29

Reliable

Fast

Engaging

The Washington Post have seen load times average 400 milliseconds,an 88%

improvement over our traditional mobile website. Source

Add to Home Screen also delivers high-quality visits, with customers converting 70% more than average users. Source

The Weather Channel goal is to supply timely, accurate information when it

matters most. After upgrading their site to a PWA, they saw

a 80% improvement in load time. Source

30

THANKSMatija Grcic

@matijagrcic

matijagrcic

E: mgrcic_contractor@8west.ie

8 West Consulting

@8westconsulting

8-west-consulting

E: info@8west.ie

RESOURCES

32

Simpler web payments: Introducing the Payment Request APIDriving user growth with performance improvementsaspnet/JavaScriptServices@typesProgressive web appsNext-generation web apps for educationYour First Progressive Web AppProgressive Web App by airberlin - Presentation at Google I/OWhat, Exactly, Makes Something A Progressive Web App?Integrating Progressive Web Apps deeply into AndroidHow progressive web apps will change e-commerceProgressive Web Apps with React.jsBuilding Indexable Progressive Web AppsREST APIs must be hypertext-drivenWith lessons from Google, The Washington Post has brought its page load speed down to millisecondsPWA BuilderTechnical Seo For Progressive Web Apps (PWA)Progressive Web App Summit 2016Totally Tooling Tips: Progressive Web AppsThe Very Real Performance Impact on RevenueAvon.com: An Umbraco approach to a headless CMS