Download - Web Development with Smalltalk
![Page 1: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/1.jpg)
Web Development with SmalltalkPhD. Mariano Martinez Peck [email protected] http://marianopeck.wordpress.com
![Page 2: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/2.jpg)
Mariano Martinez PeckAcademics
Software Engineer at UTN-FRBA, Argentina.
PhD in Computer Science at the Université de Lille.
Open-Source
Fuel, Pharo, DBXSuite (OpenDBX and Glorp), etc.
Industry
Previously, many years at different companies developing in different languages.
Currently, Independent Software Consultant
![Page 3: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/3.jpg)
Muchas Gracias!
![Page 4: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/4.jpg)
Context
![Page 5: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/5.jpg)
Objective-C
![Page 6: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/6.jpg)
![Page 7: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/7.jpg)
Why Smalltalk?
![Page 8: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/8.jpg)
Things are changing
![Page 9: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/9.jpg)
Smalltalk is powerfulPure Object Oriented.
Dynamically typed and reflective.
Closures.
Debug and changes “on the fly”.
Everything is an object.
Runs in a VirtualMachine.
![Page 10: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/10.jpg)
1. Domain specific logic. 2. Web logic (UI).
![Page 11: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/11.jpg)
Two common possibilities
Use Smalltalk for domain logic and building UI (using a web framework). The server will answer the generated HTML + Javascript.
Write a separate UI (web logic) in another language (a fully JS client) that connects somehow (rest/json for example) to a Smalltalk server (domain logic).
![Page 12: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/12.jpg)
Web frameworks
Seaside
AidaWeb
Many others…but above are most famous ones.
![Page 13: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/13.jpg)
![Page 14: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/14.jpg)
Quick intro
Open Source (MIT).
In production since 2002.
It is different to most web frameworks.
Fully written in Smalltalk.
![Page 15: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/15.jpg)
In a nutshell
It is component based (pure Smalltalk).
It provides natural flow.
Components are reusable and statefull.
![Page 16: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/16.jpg)
In a nutshell
It is component based (pure Smalltalk).
It provides natural flow.
Components are reusable and statefull.
![Page 17: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/17.jpg)
We don’t think in pages…
![Page 18: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/18.jpg)
We think in Components
There is no JSP, XML, PHP or whatever.
You never see HTTP requests or responses (unless you want to).
Simply Smalltalk.
There are no templates!
![Page 19: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/19.jpg)
![Page 20: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/20.jpg)
![Page 21: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/21.jpg)
Components are c☺☺l
![Page 22: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/22.jpg)
Reuseable
![Page 23: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/23.jpg)
Model, View, Controller
Model
View Controller
![Page 24: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/24.jpg)
You can debug!!!!
![Page 25: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/25.jpg)
We can read Seaside code and learn from it
![Page 26: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/26.jpg)
html div id: ‘title’; with: ‘Title’
<div id=”title”>Title</div>
Canvas and Brush
![Page 27: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/27.jpg)
html div id: ‘list’; with: [ html span class: ‘item’; with: ‘Item 1’. html span class: ‘item’; with: ‘Item 2’ ]
<div id=”list”> <span class=”item”>Item 1</span> <span class=”item”>Item 2</span> </div>
![Page 28: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/28.jpg)
html anchor callback: [ self inform: ‘Hello World’ ]; with: ‘Show Message’
<a href=”/seaside/example1 ?_s=Ru8ZKgqjy0uDX3kf &_k=K5EQyqKE &32”>Show Message</a>
![Page 29: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/29.jpg)
Demo
![Page 30: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/30.jpg)
Pros: • Great learning curve: only one language. • Manage all code the same way. • We use the same IDE tools. • Excellent debugging capabilities. • Reusability.
Cons: • More complicated graphic designer
integration.
![Page 31: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/31.jpg)
Demo
![Page 32: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/32.jpg)
In a nutshell
It is component based (pure Smalltalk).
It provides natural flow.
Components are reusable and statefull.
![Page 33: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/33.jpg)
Natural Flow
![Page 34: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/34.jpg)
value1 := self request: ‘First Number’.
![Page 35: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/35.jpg)
value1 := self request: ‘First Number’.
value2 := self request: ‘Second Number’.
![Page 36: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/36.jpg)
value1 := self request: ‘First Number’.
value2 := self request: ‘Second Number’.
self inform: value1 + value2.
![Page 37: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/37.jpg)
Not concerned about HTTP
No manual request parsing
No XML configuration files
![Page 38: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/38.jpg)
A
call:A Bx :=
![Page 39: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/39.jpg)
AB
call:A Bx :=
![Page 40: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/40.jpg)
AB
answer:B
![Page 41: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/41.jpg)
A
answer:B
![Page 42: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/42.jpg)
A
x :=
![Page 43: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/43.jpg)
This is thanks to Continuations…as we will see later.
![Page 44: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/44.jpg)
Demo
![Page 45: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/45.jpg)
In a nutshell
It is component based (pure Smalltalk).
It provides natural flow.
Components are reusable and statefull.
![Page 46: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/46.jpg)
¿Qué pasaría si todo lo que haces, lo que conoces y lo que te cuentan se te olvidara?
– Memento
![Page 47: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/47.jpg)
¿Qué pasaría si todo lo que haces, lo que conoces y lo que te cuentan se te olvidara?
– HTTP
![Page 48: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/48.jpg)
What happened in the movie?
![Page 49: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/49.jpg)
If it is so bad…why it has certain success?
![Page 50: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/50.jpg)
Well….
Good scalability.
It seems natural (because it is mainstream).
The database performs well so…
![Page 51: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/51.jpg)
But…it’s tedious and manual
![Page 52: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/52.jpg)
You must juggle to keep conversational context…
![Page 53: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/53.jpg)
Abusing of databases is not good either
![Page 54: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/54.jpg)
Seaside is based on reusable statefull components
![Page 55: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/55.jpg)
Continuations
1. Snapshots current estate.
2. “Jumps” to another place (.e.g #call:)
3. Do something.
4. When it comes back (.e.g #answer:), the state is available.
self call: (AnotherComponent new)
![Page 56: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/56.jpg)
Advantages of Continuations
It’s call and return.
Transparent management of the state and the threads.
It helps with double-request and back-button problems.
You can decide what is considered state.
![Page 57: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/57.jpg)
Is not paradise either…
![Page 58: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/58.jpg)
Using continuations I have be heavier!!!
![Page 59: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/59.jpg)
Scalability is a bit different
![Page 60: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/60.jpg)
Other characteristics
![Page 61: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/61.jpg)
Other characteristics
Very nice integration with JQuery, AJAX, Comet, etc.
We can use our preferred Web server when deploying.
It’s not tight to any persistency framework.
Tons of wrapped libs like Twitter Bootstrap, Highcharts, etc…
![Page 62: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/62.jpg)
MIT License
![Page 63: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/63.jpg)
• http://book.seaside.st • http://www.seaside.st
![Page 64: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/64.jpg)
Some conclusionsVery easy to learn, develop and debug.
Good integration with existing libs.
Great with web applications with complex logic and workflows.
It could be heavy (statefull) for certain scenarios.
A bit complicated to build app from graph designer template.
May not be the best choice for plain web pages.
![Page 65: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/65.jpg)
Write a separate UI (web logic) in another language (a fully JS client) that connects somehow (rest/json for example) to a Smalltalk server (domain logic).
![Page 66: Web Development with Smalltalk](https://reader034.vdocuments.us/reader034/viewer/2022052602/559bd7121a28abb4678b4669/html5/thumbnails/66.jpg)