www.seaside.stwww.lukas-renggli.ch

Lukas Renggli

AcademicsPhD Student, University of Bern

IndustryIndependent Software Consultant

CommunitiesCore-developer of SeasideAuthor of Magritte and Pier

Web ApplicationFramework

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

1Getting Started

Demo}VM

} Squeak, Seaside, Application(Platform Independent)

Demo

DemoClasses Methods

Source Code

Save & Compile(Command+S)

Smalltalk

Everything is an object

Single inheritance

Method invokation is late bound

Methods are public

Instance variables are private

Syntactic Elements

Comment "a lovely comment"Character $aString 'a nice string'Symbol #somethingInteger 123Float 2.718Array #( 1 2 3 )Receiver self

superBoolean true

falseUndefined nil

Syntax (I)

Temporary Variable | var |Assignment var := aNumberBlock Closures [ stmts ... ]

[ :arg1 | stmts ... ][ :arg1 :arg2 | stmts ... ]

1. Unary message receiver doThis2. Binary message receiver + arg3. Keyword message receiver doThis: arg

receiver doThis: 2 andThat: 1

Syntax (II)

Cascade receiver doThis: 123; doThatStatement stmt1. stmt2

stmt1. stmt2. stmt3Return ^ stmtParenthesis (stmt)

Demo

1Your Turn

2Components

We don’t think in pages ...

..., but in stateful components

Demo

Demo

Widgets

View + Controller

Persistent

WAComponent

HelloWorld

Canvas and Brush

Sou

rce:

sto

ck.x

chn

g, M

aart

en U

ilenb

roek

CSSDesigner

XHTMLDeveloper & 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>

2Your Turn

3Interaction

No freaking request parsing

Don’t ask me,I call you

Sou

rce:

sto

ck.x

chn

g, L

evi S

zeke

res

Callbacks

html anchor callback: [ self inform: ‘Hello World’ ]; with: ‘Show Message’

html textInput value: name; callback: [ :value | name := value ]

CallbacksAnchors

Form ElementsText FieldsText AreaRadio ButtonsCheck BoxesSelectable ListButtons

3Your Turn

4Control Flow

Demo

<form action="result.html"> <input type="hidden" name="value1" value="<% value1 %>"> <input type="text" name="value2"> <input type="submit" value="OK"></form>

<p> <% value1 + value2 %></p>

<form action="second.html"> <input type="text" name="value1"> <input type="submit" value="OK"></form>

<form action="result.html"> <input type="text" name="value2"> <input type="submit" value="OK"></form>

valu

e1, v

alue

2

/resultparsing

processingformatting

resu

lt

valu

e1

/secondparsing

processingformatting

valu

e1

/firstparsing

processingformatting

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.

AB

call:A Bx :=

AB

answer:B

A

x :=

4Your Turn

5Outlook

Web 2.0

XHTML

✓

CSS

✓

RSS

✓

AJAX

Sou

rce:

Flic

kr, B

enja

min

Jac

kso

n

Tight, but optional integration

Feature completeand up-to-date

Say it in Smalltalk

Demo

Comet

Sou

rce:

Flic

kr, p

srm

an's

Server Push

Demo

Applications

In productive usesince 2002

Demo

Demo

Demo

Demo

Demohttp://www.seasidehosting.st

Did you notice?

Web applications

No URL fiddling

No request parsing

Development toolsat your fingertips

Control flow at ease

www.seaside.stwww.lukas-renggli.ch