SlideShare a Scribd company logo
1 of 88
Download to read offline
www.seaside.st
www.lukas-renggli.ch
Lukas Renggli
Academics
  PhD Student, University of Bern
Industry
  Independent Software Consultant
Communities
  Core-developer of Seaside
  Author of Magritte and Pier
Web Application
 Framework
MIT License
Seaside is
different by design
We share as much
state as possible
We don’t use
meaningful URLs
We don’t use
 templates
Seaside Applications
are written in Smalltalk
5 Steps to Mastering


The Art of Seaside
Agenda

Getting Started — 15 min
Components — 15 min
Callbacks — 15 min
Control Flow — 15 min
Outlook — 15 min
Getting Started
}   Squeak, Seaside, Application




            }
      (Platform Independent)




Demo                  VM
Demo
Classes          Methods




    Demo
       Save & Compile
        (Command+S)


Source Code
Smalltalk

Everything is an object
Single inheritance
Method invokation is late bound
Methods are public
Instance variables are private
Syntactic Elements
Comment      quot;a lovely commentquot;
Character    $a
String       'a nice string'
Symbol       #something
Integer      123
Float        2.718
Array        #( 1 2 3 )
Receiver     self
             super
Boolean      true
             false
Undefined     nil
Syntax (I)

Temporary Variable    | var |
Assignment            var := aNumber
Block Closures        [ stmts ... ]
                      [ :arg1 | stmts ... ]
                      [ :arg1 :arg2 | stmts ... ]
1. Unary message      receiver doThis
2. Binary message     receiver + arg
3. Keyword message receiver doThis: arg
                   receiver doThis: 2 andThat: 1
Syntax (II)



Cascade       receiver doThis: 123; doThat
Statement     stmt1. stmt2
              stmt1. stmt2. stmt3
Return        ^ stmt
Parenthesis   (stmt)
Demo
Your Turn
Components
We don’t think in
   pages ...
..., but in stateful
   components
Demo
Demo
Widgets
View + Controller
Persistent
WAComponent




 HelloWorld
Canvas and Brush




Source: stock.xchng, Maarten Uilenbroek
CSS
Designer
XHTML
Developer & Seaside
DSL
HelloWorld

renderContentOn: html

                        html render: 'Hello World'
html div id: ‘title’; with: ‘Title’




<div id=”title”>Title</div>
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>
Your Turn
3
Interaction
No freaking
request parsing
I call you
                                     Don’t ask me,




Source: stock.xchng, Levi Szekeres
Callbacks
html anchor
  callback: [ self inform: ‘Hello World’ ];
  with: ‘Show Message’
html textInput
  value: name;
  callback: [ :value | name := value ]
Callbacks
 Anchors
 Form Elements
   Text Fields
   Text Area
   Radio Buttons
   Check Boxes
   Selectable List
   Buttons
3
Your Turn
Control Flow
Demo
<form action=quot;second.htmlquot;>
   <input type=quot;textquot; name=quot;value1quot;>
   <input type=quot;submitquot; value=quot;OKquot;>
</form>

<form action=quot;result.htmlquot;>
<form action=quot;result.htmlquot;>
   <input type=quot;hiddenquot; name=quot;value1quot; value=quot;<% value1 %>quot;>
   <input type=quot;textquot; name=quot;value2quot;>
   <input type=quot;textquot; name=quot;value2quot;>
   <input type=quot;submitquot; value=quot;OKquot;>
   <input type=quot;submitquot; value=quot;OKquot;>
</form>
</form>


<p>
   <% value1 + value2 %>
</p>
/first                   /second                        /result
  parsing                   parsing                       parsing
processing                processing                    processing




                                       value1, value2
formatting                formatting                    formatting


             value1




                           value1




                                                         result
                      Web Browser
Who cares about
HTTP anyway?
Seaside is different
| value1 value2 |
value1 := self request: ‘First Number’.
value2 := self request: ‘Second Number’.
self inform: value1 asNumber + value2 asNumber.
x :=   A   call:   B




       A
       B
B   answer:




     A
     B
x :=




  A
Your Turn
5
Outlook
Web 2.0
✓
XHTML
✓
CSS
✓
RSS
AJAX




Source: Flickr, Benjamin Jackson
Tight, but optional
    integration
Feature complete
 and up-to-date
Say it in Smalltalk
Demo
Comet




Source: Flickr, psrman's
Server Push
Demo
Applications
In productive use
    since 2002
Demo
Demo
Demo
Demo
Demo
http://www.seasidehosting.st
Did you notice?
Web applications
No URL fiddling
No request parsing
Development tools
 at your fingertips
Control flow at ease
www.seaside.st
www.lukas-renggli.ch

More Related Content

What's hot

What's hot (20)

Avoiding Callback Hell with Async.js
Avoiding Callback Hell with Async.jsAvoiding Callback Hell with Async.js
Avoiding Callback Hell with Async.js
 
Learning Svelte
Learning SvelteLearning Svelte
Learning Svelte
 
Understanding Asynchronous JavaScript
Understanding Asynchronous JavaScriptUnderstanding Asynchronous JavaScript
Understanding Asynchronous JavaScript
 
Callbacks, promises, generators - asynchronous javascript
Callbacks, promises, generators - asynchronous javascriptCallbacks, promises, generators - asynchronous javascript
Callbacks, promises, generators - asynchronous javascript
 
JavaScript 101
JavaScript 101JavaScript 101
JavaScript 101
 
High Performance web apps in Om, React and ClojureScript
High Performance web apps in Om, React and ClojureScriptHigh Performance web apps in Om, React and ClojureScript
High Performance web apps in Om, React and ClojureScript
 
$q and Promises in AngularJS
$q and Promises in AngularJS $q and Promises in AngularJS
$q and Promises in AngularJS
 
JavaScript Good Practices
JavaScript Good PracticesJavaScript Good Practices
JavaScript Good Practices
 
Optimizing a large angular application (ng conf)
Optimizing a large angular application (ng conf)Optimizing a large angular application (ng conf)
Optimizing a large angular application (ng conf)
 
Javascript: A sneak preview
Javascript: A sneak previewJavascript: A sneak preview
Javascript: A sneak preview
 
JavaScript
JavaScriptJavaScript
JavaScript
 
The evolution of asynchronous javascript
The evolution of asynchronous javascriptThe evolution of asynchronous javascript
The evolution of asynchronous javascript
 
Asynchronous programming done right - Node.js
Asynchronous programming done right - Node.jsAsynchronous programming done right - Node.js
Asynchronous programming done right - Node.js
 
JavaScript promise
JavaScript promiseJavaScript promise
JavaScript promise
 
4Developers: Dominik Przybysz- Message Brokers
4Developers: Dominik Przybysz- Message Brokers4Developers: Dominik Przybysz- Message Brokers
4Developers: Dominik Przybysz- Message Brokers
 
Promise pattern
Promise patternPromise pattern
Promise pattern
 
Introduction to reactive programming & ReactiveCocoa
Introduction to reactive programming & ReactiveCocoaIntroduction to reactive programming & ReactiveCocoa
Introduction to reactive programming & ReactiveCocoa
 
Workshop 12: AngularJS Parte I
Workshop 12: AngularJS Parte IWorkshop 12: AngularJS Parte I
Workshop 12: AngularJS Parte I
 
Avoiding callback hell with promises
Avoiding callback hell with promisesAvoiding callback hell with promises
Avoiding callback hell with promises
 
4Developers: Michał Szczepanik- Kotlin - Let’s ketchup it
4Developers: Michał Szczepanik- Kotlin - Let’s ketchup it4Developers: Michał Szczepanik- Kotlin - Let’s ketchup it
4Developers: Michał Szczepanik- Kotlin - Let’s ketchup it
 

Similar to 5 Steps to Mastering the Art of Seaside

Similar to 5 Steps to Mastering the Art of Seaside (20)

Seaside - Web Development As You Like It
Seaside - Web Development As You Like ItSeaside - Web Development As You Like It
Seaside - Web Development As You Like It
 
Ruby For Startups
Ruby For StartupsRuby For Startups
Ruby For Startups
 
Seaside
SeasideSeaside
Seaside
 
Bpmn2010
Bpmn2010Bpmn2010
Bpmn2010
 
Robotlegs on Top of Gaia
Robotlegs on Top of GaiaRobotlegs on Top of Gaia
Robotlegs on Top of Gaia
 
Java scipt
Java sciptJava scipt
Java scipt
 
Java script
Java scriptJava script
Java script
 
Comet from JavaOne 2008
Comet from JavaOne 2008Comet from JavaOne 2008
Comet from JavaOne 2008
 
Seaside Portability
Seaside PortabilitySeaside Portability
Seaside Portability
 
Angular JS2 Training Session #1
Angular JS2 Training Session #1Angular JS2 Training Session #1
Angular JS2 Training Session #1
 
Lecture 5: Client Side Programming 1
Lecture 5: Client Side Programming 1Lecture 5: Client Side Programming 1
Lecture 5: Client Side Programming 1
 
Adventurous Merb
Adventurous MerbAdventurous Merb
Adventurous Merb
 
When dynamic becomes static : the next step in web caching techniques
When dynamic becomes static : the next step in web caching techniquesWhen dynamic becomes static : the next step in web caching techniques
When dynamic becomes static : the next step in web caching techniques
 
Jenkins Online Meetup - Automated SLI based Build Validation with Keptn
Jenkins Online Meetup - Automated SLI based Build Validation with KeptnJenkins Online Meetup - Automated SLI based Build Validation with Keptn
Jenkins Online Meetup - Automated SLI based Build Validation with Keptn
 
05 seaside
05 seaside05 seaside
05 seaside
 
Our Puppet Story – Patterns and Learnings (sage@guug, March 2014)
Our Puppet Story – Patterns and Learnings (sage@guug, March 2014)Our Puppet Story – Patterns and Learnings (sage@guug, March 2014)
Our Puppet Story – Patterns and Learnings (sage@guug, March 2014)
 
JavaScripts & jQuery
JavaScripts & jQueryJavaScripts & jQuery
JavaScripts & jQuery
 
Serverless, The Middy Way - Workshop
Serverless, The Middy Way - WorkshopServerless, The Middy Way - Workshop
Serverless, The Middy Way - Workshop
 
MySQL Proxy tutorial
MySQL Proxy tutorialMySQL Proxy tutorial
MySQL Proxy tutorial
 
Up and Running with Angular
Up and Running with AngularUp and Running with Angular
Up and Running with Angular
 

More from Lukas Renggli

Dynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool SupportDynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool Support
Lukas Renggli
 
Seaside — Agile Software Development
Seaside — Agile Software DevelopmentSeaside — Agile Software Development
Seaside — Agile Software Development
Lukas Renggli
 
Seaside Status Message
Seaside Status MessageSeaside Status Message
Seaside Status Message
Lukas Renggli
 

More from Lukas Renggli (18)

Mastering Grammars with PetitParser
Mastering Grammars with PetitParserMastering Grammars with PetitParser
Mastering Grammars with PetitParser
 
Natural Language Checking with Program Checking Tools
Natural Language Checking with Program Checking ToolsNatural Language Checking with Program Checking Tools
Natural Language Checking with Program Checking Tools
 
The Dynamic Language is not Enough
The Dynamic Language is not EnoughThe Dynamic Language is not Enough
The Dynamic Language is not Enough
 
Dynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool SupportDynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool Support
 
Seaside — Agile Software Development
Seaside — Agile Software DevelopmentSeaside — Agile Software Development
Seaside — Agile Software Development
 
Dynamic grammars
Dynamic grammarsDynamic grammars
Dynamic grammars
 
Domain-Specific Program Checking
Domain-Specific Program CheckingDomain-Specific Program Checking
Domain-Specific Program Checking
 
Embedding Languages Without Breaking Tools
Embedding Languages Without Breaking ToolsEmbedding Languages Without Breaking Tools
Embedding Languages Without Breaking Tools
 
Language Boxes — Bending the Host Language with Modular Language Changes
Language Boxes — Bending the Host Language with Modular Language ChangesLanguage Boxes — Bending the Host Language with Modular Language Changes
Language Boxes — Bending the Host Language with Modular Language Changes
 
jQuery for Seaside
jQuery for SeasidejQuery for Seaside
jQuery for Seaside
 
Seaside Status Message
Seaside Status MessageSeaside Status Message
Seaside Status Message
 
Seaside - The Revenge of Smalltalk
Seaside - The Revenge of SmalltalkSeaside - The Revenge of Smalltalk
Seaside - The Revenge of Smalltalk
 
Magritte Blitz
Magritte BlitzMagritte Blitz
Magritte Blitz
 
Seaside - On not getting bogged down
Seaside - On not getting bogged downSeaside - On not getting bogged down
Seaside - On not getting bogged down
 
Magritte
MagritteMagritte
Magritte
 
Seaside - Past, Present and Future
Seaside - Past, Present and FutureSeaside - Past, Present and Future
Seaside - Past, Present and Future
 
Magritte - A Meta-Driven Approach to Empower Developers and End Users
Magritte - A Meta-Driven Approach to Empower Developers and End UsersMagritte - A Meta-Driven Approach to Empower Developers and End Users
Magritte - A Meta-Driven Approach to Empower Developers and End Users
 
Transactional Memory for Smalltalk
Transactional Memory for SmalltalkTransactional Memory for Smalltalk
Transactional Memory for Smalltalk
 

Recently uploaded

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 

Recently uploaded (20)

DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 

5 Steps to Mastering the Art of Seaside