from server generated pages to client app in a micro-services world

20
From Server Generated Pages to Client App By Assaf Gannon FullStack Developers Israel 28.01.2014 Google Campus Hosted by:

Upload: assaf-gannon

Post on 12-May-2015

2.808 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: From server generated pages to client app in a micro-services world

From Server Generated Pages to

Client App

By Assaf Gannon

FullStack Developers Israel

28.01.2014Google Campus Hosted by:

Page 2: From server generated pages to client app in a micro-services world

Evolution of the ‘View’ in Monolithic MVC

text

Page 3: From server generated pages to client app in a micro-services world

MVCMost Monolithic applications use MVC Model• Provides a well proven structure for web applications• Model - logic & data• View - Presentation layer• Controller - Glue & Routing

text

Page 4: From server generated pages to client app in a micro-services world

Micro Service Worldtext

Service (MVC)

Client

Service (MVC)

Service (MVC)

Page 5: From server generated pages to client app in a micro-services world

Micro Service Worldtext

Service (MVC)

Web Server (MVC)

Service (MVC)

Service (MVC)

Client

Page 6: From server generated pages to client app in a micro-services world

Forces Influencing the View

• Marketing - Trend to ‘native’ like apps UX

• Performance - Offload some of the work to the client

• Business - Web applications need more hits to make a $

text

Page 7: From server generated pages to client app in a micro-services world

The View Evolution

What makes it possible?• Improved browser JS performance• Improved client hardware• HTML 5 Standards

text

Move to Single Page Applications

Page 8: From server generated pages to client app in a micro-services world

Single Page App

Result:• We get a “Standalone” Client• The “V” in server MVC almost disappears• Client becomes more complex• Asset management importance hits a new peak• Both server and client become more robust

text

Move all presentation logic to the client

Page 9: From server generated pages to client app in a micro-services world

Micro Service Worldtext

Service (MVC)

REST API

Service (MVC)

Service (MVC)

Client

Page 10: From server generated pages to client app in a micro-services world

Basic Architecture text

Page 11: From server generated pages to client app in a micro-services world

New Web Client Complexities

• Lots of assets (JS, CSS, HTML, Images)

• Lots of 3rd party libraries

• Lots of events and logic

• Complex data models and logic

• State management

• Routing management

text

Page 12: From server generated pages to client app in a micro-services world

Introducing Web Client Development

text

Page 13: From server generated pages to client app in a micro-services world

Web Apps Development Keys

• Start treating web apps with respect (as software)

• Adopt standard development flows and tools

• Test your code

• Separation of concerns and concise modules

• Manage assets with designated tools

• Use dependency management tools

text

Page 14: From server generated pages to client app in a micro-services world

The Web Dev Toolkit

text

Page 15: From server generated pages to client app in a micro-services world

Yeoman

• Project Scaffolding• Code Generation

text

Page 16: From server generated pages to client app in a micro-services world

Grunt

• JS Task executor• Used for:

○ JS & CSS file concatenation andminification

○ Asset versioning○ Code linting○ CSS - Sass, Less, Compass○ HTML optimisation○ Test execution○ Many many more…

text

Page 17: From server generated pages to client app in a micro-services world

Bower

• Client dependency manager

text

Page 18: From server generated pages to client app in a micro-services world

Summary

• Web apps should be treated as software

• Web Client should be developed as a separate

project

• Coding paradigms (MVC) should be applied to web

apps

• Use tools to increase efficiency

text

Page 19: From server generated pages to client app in a micro-services world

Further reading

• http://yeoman.io/ • http://gruntjs.com/• http://bower.io/

text

Page 20: From server generated pages to client app in a micro-services world

THANK YOU

ASSAF GANNONEmail: [email protected]