Next Generation Web Development Techniques with Cloud Foundry

•

0 likes•544 views

An introduction to the changing landscape of Web Development, how Cloud App Dev is supplanting Web Dev, and how PaaS plays into the picture.

Technology Business

Next Generation
Web Dev Techniques
with Cloud Foundry
Lucas Carlson

Web App History
• HTML • Thin frontend
• DHTML • Thick backend
• XHTML
• CSS
• AJAX • Thick frontend
• HTML5 • Thin backend

Early Web

• Network slow
• Browsers slow • Thick backend logic
• Servers fast

Middle Web

• Network fast
• Browsers slow • Thick backend logic
• Servers fast • Some client logic
• AJAX/DHTML

Modern Web

• Network fast
• Browsers fast
• Servers fast • Thick client logic
• HTML5
• Mobile

Thick Clients

• Gmail: 2007
• MobileMe: 2008
• Twitter redesign: 2011

Web Architectures

• Spaghetti
• MVC
• API Bindings
• Fat Client

Spaghetti

• PHP, Perl, Javascript
• Build everything from ﬁrst principles

MVC

• Rails, Django
• Apply MVC to backend server
• Client side code is still spaghetti

API Bindings

• Knockout, Backbone
• Client code framework, loose structure
• Flexible UI
• Simple API backends

Fat Client

• Cappuccino, SproutCore
• Apply MVC to frontend client
• Prescribed UI elements
• Simple API backends

Large scale web apps
• Monolithic
• One code base
• Feature creep
• Heavier and heavier
• Memory leaks
• Performance nightmare

Scaling issues

• Database grows
• 100+ tables
• SQL spaghetti queries

Pull them apart

• Create services
• Pull apart user registration
• A few services
• Big monolith hard to kill

Better Way?

• Start by building services
• Small, independent pieces of code
• Scale independently
• Compose in the front

Old Habits

• Old web development was based on old
limitations
• Old habits no longer serving us well

New SaaS

• SaaS is headed this way
• Stripe for billing
• Billing backend service on separate infra

What's hot

Full stackAhmed Al Bermawy

Introduction to Web Technology StacksPrakarsh -

Asp.netKIRTI PRADHAN

Azure Serverless ConfJose Javier Columbie

What is a good technology stack today?Netlight Consulting

Journey to a multi-tenant e commerce solution in the cloud with Kubernetes - ...Vlad Stanescu

Single Page AppsMax Claus Nunes

Porting ASP.NET applications to Windows AzureGunnar Peipman

Single Page Application Development with backbone.js and Simple.WebChris Canal

Single page AppGaurav Gawande

ReactPHP + SymfonyDavid Bergunder

Materi devcussion 1.0CodePolitan

Siebel training-course-navi-mumbai-siebel-course-provider-navi-mumbaiVibrantGroup

IWMW 2003: Content Management - Buy or Build?IWMW

Developing Cross-Platform Web Apps with ASP.NET Core1.0EastBanc Tachnologies

Project FiFo - ArchitectureLicenser

IWMW 2003: Content Management - Buy or Build?IWMW

Amazon.com's Web Services OpportunityTim O'Reilly

Kickstart android development with xamarinFoyzul Karim

ASP.NET MVC 4Danijel Malik

What's hot (20)

Full stack

Introduction to Web Technology Stacks

Asp.net

Azure Serverless Conf

What is a good technology stack today?

Journey to a multi-tenant e commerce solution in the cloud with Kubernetes - ...

Single Page Apps

Porting ASP.NET applications to Windows Azure

Single Page Application Development with backbone.js and Simple.Web

Single page App

ReactPHP + Symfony

Materi devcussion 1.0

Siebel training-course-navi-mumbai-siebel-course-provider-navi-mumbai

IWMW 2003: Content Management - Buy or Build?

Developing Cross-Platform Web Apps with ASP.NET Core1.0

Project FiFo - Architecture

IWMW 2003: Content Management - Buy or Build?

Amazon.com's Web Services Opportunity

Kickstart android development with xamarin

ASP.NET MVC 4

Viewers also liked

Rick LaBergeRick LaBerge

Manju & mallika 1Vinayaka Kundwadmath

Photoshynthesis chapter 9 xblindbanditx

Industrial Health Council Archived News Articles Show Rich HistoryIndustrialHealthCouncil

Rick LaBerge ResumeRick LaBerge

عرس المجد 1Iman Noor

اسم المفعول 2003Iman Noor

Photoscarpartart

What is system designJaehyun Park

Idea is nothingJaehyun Park

01 (software) design an analogy with my closetHenry Muccini

On the Use of Component-Based Principles and Practices for Architecting Cyber...Henry Muccini

00_Welcome to the Software Architecture CourseHenry Muccini

Processo Eleitoral BrasileiroLeonardo Caputo

الصف السادس الاسم الموصولIman Noor

1ST DISIM WORKSHOP ON ENGINEERING CYBER-PHYSICAL SYSTEMSHenry Muccini

تدريبات على درس الهمزة على الياءIman Noor

تلوث البيئةIman Noor

Viewers also liked (18)

Rick LaBerge

Manju & mallika 1

Photoshynthesis chapter 9

Industrial Health Council Archived News Articles Show Rich History

Rick LaBerge Resume

عرس المجد 1

اسم المفعول 2003

Photos

What is system design

Idea is nothing

01 (software) design an analogy with my closet

On the Use of Component-Based Principles and Practices for Architecting Cyber...

00_Welcome to the Software Architecture Course

Processo Eleitoral Brasileiro

الصف السادس الاسم الموصول

1ST DISIM WORKSHOP ON ENGINEERING CYBER-PHYSICAL SYSTEMS

تدريبات على درس الهمزة على الياء

تلوث البيئة

Similar to Next Generation Web Development Techniques with Cloud Foundry

6 weeks 6 months live project summer industrial training in cmc limited 2012CMC Limited

Escaping the yellow bubble - rewriting Domino using MongoDb and AngularMark Leusink

Javascript for Wep AppsMichael Puckett

Be faster then rabbitsVladislav Bauer

Full Stack Developer Course | Infinite Graphix TechnologiesInfinite Graphix Technologies

Ohio Devfest - Visual Analysis with GCPWesley Workman

Java web services soap rest training from hyderabadFuturePoint Technologies

Web services soap rest trainingFuturePoint Technologies

IWMW 2003: b8 implementation of a commercial content management systemIWMW

Bayt trainingGhazi Alhowari

Ubc presentationbmonkman

Scaling for Web - Architecting HootSuite for 5+ Million Usersbmonkman

Improving Perceived Page Performance with ASP.NET Web API and AJAXChris Bohatka

Google web toolkit gwt trainingFuturePoint Technologies

WCM-7 Surfing with CMISAlfresco Software

20120802 timisoaraRichard Rodger

RubyConf China 2015 - Rails off assets pipelineFlorian Dutey

Develop a vanilla.js spa you and your customers will loveChris Love

Materi Devcussion 1.0: 2 Keys to Becoming Great DeveloperTeknoEvent

Introduction to ASP.NET 5mbaric

Similar to Next Generation Web Development Techniques with Cloud Foundry (20)

6 weeks 6 months live project summer industrial training in cmc limited 2012

Escaping the yellow bubble - rewriting Domino using MongoDb and Angular

Javascript for Wep Apps

Be faster then rabbits

Full Stack Developer Course | Infinite Graphix Technologies

Ohio Devfest - Visual Analysis with GCP

Java web services soap rest training from hyderabad

Web services soap rest training

IWMW 2003: b8 implementation of a commercial content management system

Bayt training

Ubc presentation

Scaling for Web - Architecting HootSuite for 5+ Million Users

Improving Perceived Page Performance with ASP.NET Web API and AJAX

Google web toolkit gwt training

WCM-7 Surfing with CMIS

20120802 timisoara

RubyConf China 2015 - Rails off assets pipeline

Develop a vanilla.js spa you and your customers will love

Materi Devcussion 1.0: 2 Keys to Becoming Great Developer

Introduction to ASP.NET 5

Recently uploaded

(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...AliaaTarek5

The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptxLoriGlavin3

Potential of AI (Generative AI) in Business: Learnings and InsightsRavi Sanghani

Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Alkin Tezuysal

A Deep Dive on Passkeys: FIDO Paris Seminar.pptxLoriGlavin3

[Webinar] SpiraTest - Setting New Standards in Quality AssuranceInflectra

Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxLoriGlavin3

A Framework for Development in the AI AgeCprime

What is DBT - The Ultimate Data Build Tool.pdfMounikaPolabathina

Sample pptx for embedding into website for demoHarshalMandlekar2

Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentPim van der Noll

Generative AI for Technical Writer or Information DevelopersRaghuram Pandurangan

How to write a Business Continuity PlanDatabarracks

Testing tools and AI - ideas what to try with some tool examplesKari Kakkonen

A Journey Into the Emotions of Software DevelopersNicole Novielli

2024 April Patch TuesdayIvanti

Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptxLoriGlavin3

Manual 508 Accessibility Compliance AuditSkynet Technologies

So einfach geht modernes Roaming fuer Notes und Nomad.pdfpanagenda

TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc

Recently uploaded (20)

(How to Program) Paul Deitel, Harvey Deitel-Java How to Program, Early Object...

The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx

Potential of AI (Generative AI) in Business: Learnings and Insights

Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...

A Deep Dive on Passkeys: FIDO Paris Seminar.pptx

[Webinar] SpiraTest - Setting New Standards in Quality Assurance

Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx

A Framework for Development in the AI Age

What is DBT - The Ultimate Data Build Tool.pdf

Sample pptx for embedding into website for demo

Emixa Mendix Meetup 11 April 2024 about Mendix Native development

Generative AI for Technical Writer or Information Developers

How to write a Business Continuity Plan

Testing tools and AI - ideas what to try with some tool examples

A Journey Into the Emotions of Software Developers

2024 April Patch Tuesday

Use of FIDO in the Payments and Identity Landscape: FIDO Paris Seminar.pptx

Manual 508 Accessibility Compliance Audit

So einfach geht modernes Roaming fuer Notes und Nomad.pdf

TrustArc Webinar - How to Build Consumer Trust Through Data Privacy

Next Generation Web Development Techniques with Cloud Foundry

1. Next Generation Web Dev Techniques with Cloud Foundry Lucas Carlson

2. Lucas Carlson Circa 1996 PHP!!!?!?!

3. Lucas Carlson Circa 2005 RUBY!!!?!?!

4. Lucas Carlson ZOMG!!!?!?!

5. Lucas Carlson ZOMG!!!?!?!

7. Dave McCroy Derek Collison

10.

11. Web App History • HTML • Thin frontend • DHTML • Thick backend • XHTML • CSS • AJAX • Thick frontend • HTML5 • Thin backend

12. Early Web • Network slow • Browsers slow • Thick backend logic • Servers fast

13. Middle Web • Network fast • Browsers slow • Thick backend logic • Servers fast • Some client logic • AJAX/DHTML

14. Modern Web • Network fast • Browsers fast • Servers fast • Thick client logic • HTML5 • Mobile

15. Thick Clients • Gmail: 2007 • MobileMe: 2008 • Twitter redesign: 2011

16. Web Architectures • Spaghetti • MVC • API Bindings • Fat Client

17. Spaghetti • PHP, Perl, Javascript • Build everything from ﬁrst principles

18. MVC • Rails, Django • Apply MVC to backend server • Client side code is still spaghetti

19. API Bindings • Knockout, Backbone • Client code framework, loose structure • Flexible UI • Simple API backends

20.

21. Fat Client • Cappuccino, SproutCore • Apply MVC to frontend client • Prescribed UI elements • Simple API backends

22. SproutCore

23. Cappuccino

24. Large scale web apps • Monolithic • One code base • Feature creep • Heavier and heavier • Memory leaks • Performance nightmare

25. Scaling issues • Database grows • 100+ tables • SQL spaghetti queries

26. Pull them apart • Create services • Pull apart user registration • A few services • Big monolith hard to kill

27. Better Way? • Start by building services • Small, independent pieces of code • Scale independently • Compose in the front

28. Old Habits • Old web development was based on old limitations • Old habits no longer serving us well

29. Modern Web App Toolkit

30. New SaaS • SaaS is headed this way • Stripe for billing • Billing backend service on separate infra

31. New Frameworks

32. New Frameworks

33. New

Next Generation Web Development Techniques with Cloud Foundry

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (18)

Similar to Next Generation Web Development Techniques with Cloud Foundry

Similar to Next Generation Web Development Techniques with Cloud Foundry (20)

Recently uploaded

Recently uploaded (20)

Next Generation Web Development Techniques with Cloud Foundry