Extreme webdevelopment met Seaside

October 30, 2006

Ik ben nog bezig met de frontend van mijn sudoku game, maar merk dat ik daar nog wat kennis mis. Ik ga me eerst even serieus verdiepen in het hele stylesheet gebeuren. In Seaside heb je een mooie scheiding tussen designer en programmeur, maar als je geen designer tot je beschikking hebt moet je de klus maar zelf klaren.

Ik merk dat Firefox met de juiste extensions je behoorlijk kan helpen hierin. Ik deed het eerst nog ouderwets een stylesheet file in een text editor aanpassen en dan de pagina reloaden, maar dat past natuurlijk in het snelle feedback verhaal. Met de webdeveloper extension in firefox kan ik on the fly wat stijlen aanpassen en zie ik meteen het effect op de pagina.

Als je dit combineert met het vanuit de webbrowser aanpassen van je Smalltalk code dan heb je echt een super interactieve omgeving om je Seaside componenten zowel qua layout als gedrag aan te passen.
Het is dan niet echt testdriven, maar het gaat om gedrag van de frontend wat vaak toch moeilijk in unittesten is vast te leggen.

Nog meer beginnende smalltalkers

October 29, 2006

Ik kwam hier en hier nog een aantal blogs tegen van mensen die ook zijn verleid tot malltalk. Men stapt nog niet massaal over, maar er zit een kleine beweging in. De verleiding is wel groot om over te stappen op het Engels zodat je wat makkelijker kennis kunt uitwisselen.

The Planning Game: iteratie 1

October 28, 2006

IMG_0061.JPG
Om te voorkomen dat deze blog net zo strand als al de andere Nederlandstalige smalltalk initiatieven op het internet zet ik even een planning op voor de komende periode. Belangrijk is natuurlijk om, volgens het Extreme Programming principe, zo snel mogelijk een minimale werkende applicatie te hebben.

In grote lijnen wil ik het volgende doen voor het einde van dit jaar:

  • een sudoku web applicatie bouwen met behulp van seaside.

  • mogelijk nog een ‘boter-melk-kaas’ of ‘zeeslag’ spel als ik nog niet helemaal comfortabel ben in de omgeving.

  • daarna een wat serieuzere web applicatie bouwen met een database erachter, dit zal waarschijnlijk een thuis budget applicatie worden.

Voor deze iteratie heb ik de volgende user story gepland:

  • Een puzzelaar kan een sudoku puzzel invoeren en krijgt met behulp van de solver een oplossing terug.

Dit weekend wil ik het ‘eliminatie’ algoritme hebben gebouwd en me daarna concentreren op het ‘opleuken’ van de frontend met stylesheets en misschien wat ajax. Daarnaast moet ik ook nog wat aan de layout van deze blog doen, omdat de code niet goed leesbaar is met firefox 2.0.

Ik hou de taken lijst bij op een tadalist, een Ruby on Rails applicatie.

Smalltalk en Extreme Programming (deel 2)

October 27, 2006

In eerste instantie was ik van plan om test driven een oplossing te gaan zoeken voor de sudoku puzzel, maar ik heb toch besloten om eerst aan de web interface te gaan werken. Hiermee krijg je dan eerder het gevoel dat je ook iets nuttigs met dat rare squeak kan doen.

Om het sudoku spel te tonen hebben we een seaside WAComponent nodig. In het model-view-controller paradigma bevat dit component zowel de controller als de view. We hebben daarnaast natuurlijk het model, onze game, nodig. Met de volgende code definieren we Sudokucomponent als subclass van WAComponent met een ‘game’ instance variabele.

WAComponent subclass: #SudokuComponent
instanceVariableNames: 'game'
classVariableNames: ''
poolDictionaries: ''
category: 'Sudoku'
We initialiseren onze game.

initialize
  game:= Matrix new: 9.
  game
atRow: 1 put: #(7   9   nil nil nil nil 3   nil nil);
atRow: 2 put: #(nil nil nil nil nil 6   9   nil nil);
atRow: 3 put: #(8   nil nil nil 3   nil nil 7   6  );
atRow: 4 put: #(nil nil nil nil nil 5   nil nil 2  );
atRow: 5 put: #(nil nil 5   4   1   8   7   nil nil);
atRow: 6 put: #(4   nil nil 7   nil nil nil nil nil);
atRow: 7 put: #(6   1   nil nil 9   nil nil nil 8  );
atRow: 8 put: #(nil nil 2   3   nil nil nil nil nil);
atRow: 9 put: #(nil nil 9   nil nil nil nil 5   4  ).
Dit is de code om ons spel te tonen:

renderContentOn: html
  html heading: 'Sudoku Puzzel' level: 1.
    html form:
       [html table:
          [1 to: 9 do:
             [:row | html tableRow:
                [1 to: 9 do:
                   [:col | html tableData:
                     [html textInputWithValue: (game at: row at:col)
                               callback: []]]]]]]
Nog even ons SudokuComponent registreren in de Seaside server:

SudokuComponent registerAsApplication: 'sudoku'.
En we hebben een simpele tabel met text vakken dat onze matrix voorspelt. Met wat stylesheet info geven we het een wat leukere layout:

style
^'
INPUT {
WIDTH: 20px
}
'

Ik heb een class met drie methodes nodig gehad om een simpele sudoku spel op een webpagina te plaatsen. En dit is ook echt alle code. Geen xml configuratie files, ook geen yaml files, ook geen jsp of rhtml. Ok, de taal is wat cryptisch als je smalltalk nog niet kent, maar het leren lezen van smalltalk is niet moeilijk. Er zijn namelijk maar vijf keywords en het enige moeilijke vind ik af en toe het lezen van de codeblocks.

Het doet allemaal nog niets, maar je kunt wel al wat feedback krijgen van een potentiele gebruiker.

Ik wil ook codeblocks in Java

October 26, 2006

Vandaag moest ik een stukje code aanpassen. Een composite object dat een soort wrapper is om een xml document heen. Het kan gevoed worden door twee verschillende types xml documenten, maar representeert wel altijd het zelfde object. Je moet alleen andere xml elementen uitlezen om tot dezelfde informatie te komen. In eerste instantie dacht ik twee factory methods te maken met verschillende input die uiteindelijk hetzelfde soort object opbouwen. Dit is uiteindelijk de nette oplossing, maar het betekende wel dat ik heel veel moest gaan ombouwen. De huidige implementatie keek on demand naar de juiste xml elementen om een waarde terug te geven.

Maar als ik nou per property een codeblock opgeef met het algoritme om de juiste waarde op te halen? Dan geef ik in de factory method aan de hand van het type input document de juiste implementatie mee. Dit kan in java ook met een anonymous inner class. Ik moest daarvoor wel eerst een interface definieren en uiteindelijk is de code er qua leesbaarheid niet op vooruit gegaan. Toen ik pas met java begon was dit altijd het moeilijkst voor mij: het lezen van code met anonymous inner classses. Veels te veel curly braces. Gelukkig hoef ik met beginners geen rekening te houden op dit project, maar toch…

Codeblocks in smalltalk zijn veel leesbaarder en leer je er ook vanaf het begin mee omgaan. Ik zit me wel af te vragen in hoeverre ik door smalltalk beinvloed ben in het kiezen van deze oplossing en of dit voor java wel “The Simplest Thing That Could Possibly Work” is.

todo: code van zowel smalltalk als java toevoegen

Prolog

October 25, 2006

Bij het zoeken naar Nederlandse bloggers die wat met smalltalk hebben kwam ik een blog entry over prolog tegen, nog een taal die dood schijnt te zijn. Misschien een volgende uitdaging voor als ik smalltalk geleerd heb. Over smalltalk wordt er in Nederland helaas nog weinig geschreven.

En nu hoe je Seaside configureert.

October 24, 2006

Tekkie heeft een post over het configureren van Seaside met Apache en ook hier nog wat extra info. Het lijkt erop dat er wat beweging zit in de community.

Stylesheets en javascript in Seaside

Op OnSmalltalk wordt uitgelegd hoe je stylesheets en javascript aan je seaside componenten koppelt. Dit was mij nog niet duidelijk geworden uit de tutorial van David Shaffer, dus is dit een welkome aanvulling. Het is over het algemeen erg slecht gesteld met tutorials en informatie over smalltalk technologie, het meeste is jaren oud, is niet af of wordt niet meer bijgewerkt of is gericht op de in-crowd. Op OnSmalltalk komt er bijna dagelijks nog iets nuttigs bij en het is zowel qua inhoud als presentatie gericht op onze mere mortals.

Smalltalk en Extreme Programming

October 22, 2006

Aan de hand van het oplossen van het sudoku spel zal ik proberen de link tussen smalltalk en extreme pogramming te leggen. Hoe meer ik smalltalk begrijp, hoe meer ik zie dat het geen toeval is dat extreme programming vanuit de smalltalk hoek komt en dat het er heel anders uitgezien zou hebben als het door het java kamp bedacht zou zijn.

Het sudoku spel bestaat uit een buitenste 3×3 matrix gevuld met 3×3 matrixes gevuld met cellen waarin de nummers 1 tot en met 9 geplaatst kunnen worden. Een nummer kan binnen een matrix, rij of kolom maar een keer gebruikt worden.


[print version]



Visit www.dailysudoku.com for more puzzles, solutions, hints, books and other resources.



Elke cel heeft dus initieel 9 mogelijke waarden. Aan de hand van reeds geplaatste nummers binnen zijn bereik, kun je een aantal mogelijkheden elimineren. Dit is dan de eerste stap.

Maar voordat we daaraan beginnen moeten we natuurlijk wel eerst een spel hebben. Ik begin heel simpel: ik wil gewoon de nummers kunnen plaatsen in een 9×9 matrix.

Vanuit een workspace roep ik de volgende code aan.

game := Matrix new: 9.
Een constructor met een argument zoals we dit in java ook kennen. Het geeft mij een 9×9 matrix waarin ik alles kan plaatsen. Mijn zojuist gecreeerde game object kan ik bekijken in de object inspector en ik zie daar inderdaad een matrix met 81 nil waarden. Het matrix object slaat de cellen intern blijkbaar in een array op en niet in een matrix. Als ik nu een nummer wil plaatsen voer ik opnieuw wat code in de workspace uit, terwijl ik de inspector window open hou:

game at:1 at: 1 put: 7.
En we zien dat de inspector zich vanzelf update en een waarde 7 bijkomt in de matrix. Het een voor een invoeren van een cel waarde is misschien omslachtig. Is er een mogelijkheid om in een keer een hele regel toe te voegen? Inderdaad er is ook een atRow: put: methode. Aan onze game object kunnen we hiermee een berichtje sturen:

game atRow: 1 put: #( 7   9  nil nil nil nil  3  nil nil).
In de inspector zie je de wijzigingen weer verschijnen. En laten we maar meteen de rest van de nummers in de puzzel vullen door wat berichtjes te sturen naar onze game:

game atRow: 2 put: #(nil nil nil nil nil  6   9  nil nil).
game atRow: 3 put: #( 8  nil nil nil  3  nil nil  7   6 ).
game atRow: 4 put: #(nil nil nil nil nil 5   nil nil  2 ).
game atRow: 5 put: #(nil nil  5   4   1   8   7  nil nil).
game atRow: 6 put: #( 4  nil nil  7  nil nil nil nil nil).
game atRow: 7 put: #( 6   1  nil nil  9  nil nil nil  8 ).
game atRow: 8 put: #(nil nil  2   3  nil nil nil nil nil).
game atRow: 9 put: #(nil nil  9  nil nil nil nil  5   4 ).

Conversaties


Code schrijven in smalltalk kun je zien als converseren met het systeem. Een soort instant messaging met een bot. Je stuurt een regel smalltalk en krijgt ‘immediate feedback’. Een kortere cyclus bestaat niet.

Natuurlijk schrijf je niet je hele applicatie op deze manier, maar kijken hoe het systeem zich gedraagt is wezenlijk onderdeel van het software ontwikkelings proces. Doe eens een diff aan het einde van de dag met de code aan het begin van de dag. Valt wel mee, wat er allemaal gewijzigd is. Waar heeft al die tijd in gezeten? Juist, in kijken hoe het systeem zich gedraagt. jUnit helpt je wel om snel feedback te krijgen en ik misbruik mijn jUnit testcase ook weleens als een soort workspace, maar dan moet je nog eerst nog je assertions schrijven of de debugger gebruiken om in je objecten te kunnen kijken.

IMG_0641.JPGFeedback is een van de kern waarden van Extreme Programming en dit wordt in smalltalk van nature ondersteund. De volgende stap is om het gewenste gedrag vast te leggen in een testcase, in de originele sUnit!!

Smalltalk in podcasts

October 21, 2006

MijnBezit 003
James Robertson is begonnen met smalltalk podcasts. Vanwege zijn baan als product manager bij Cincom ligt de nadruk toch meer op visualworks en objectstudio dan squeak, maar het gaat in elk geval over smalltalk. In veel van de uitzendingen komt het open sourcen van StrongTalk terug. StrongTalk is een smalltalk virtual machine implementatie met strong typing. StrongTalk is in handen van Sun gekomen en is gebruikt voor de ontwikkeling van de java virtual machine. Sun heeft de StrongTalk code nu vrij gegeven en er is nu een discussie gaande in de smalltalk wereld over wat er mee moet gebeuren. Met name de performance van de StrongTalk schijnt interessant te zijn. De code schijnt echter niet zo makkelijk herbruikbaar te zijn voor bestaande smalltalk implementaties.

Smalltalk wordt ook genoemd in de afleveringen met David West in de polymorphicpodcast, een dot net podcast. David West heeft een boek, Object Thinking, geschreven dat nogal controversieel schijnt te zijn. Hij gelooft in elk geval sterk in de extreme programming methodiek.

Get free blog up and running in minutes with Blogsome | Theme designs available here