Dancer Presentation FrOSCon 2010

Einleitung Projekt Beispiel WebApp RandomNumber Resourcen Fragen

Einf¨hrung in Dancer - Eﬀortless Web Framework
u
for Perl

Thomas Fahle

FrOSCon 2010, St. Augustin, 22. August 2010

Thomas Fahle Einf¨hrung in Dancer - Eﬀortless Web Framework for Perl
u


¨
Ubersicht

¨
Uber diesen Vortrag

Einf¨hrung in Dancer
u
Dancer Grundlagen - Routing, Logging, ...
Projekt - Beispiel WebApp Random Number Generator“
”
Resourcen im Netz - Mehr Infos

u


¨
Uber Dancer

Dancer?
Micro Framework f¨r Webapps
u
urspr¨nglich Port von Ruby’s Sinatra
u
leichtgewichtig
standalone
PSGI/Plack kompatible

u


Eine einfache Webapp

Hallo Welt!

Hallo Welt

1 #! / u s r / b i n / p e r l
2
3 u s e Dancer ;
4

5 g e t ’ / ’ => sub {
6 r e t u r n ” Hello Frontpage ” ;
7 };
8
9 g e t ’ / h e l l o / : name ’ => sub {
10 r e t u r n ” H e l l o t h e r e ” . params−>{name } ;
11 };
12
13 dance ;

u


Eine einfache Webapp

Run It!

Ein Dancer Programm verf¨gt uber einen eingebauten Webserver
u ¨
$ ./hello.pl
>> Dancer server 3303 listening on http://0.0.0.0:3000
== Entering the development dance floor ...

u


Dancer Routes

Dancer Routen
sind Unterprogramme (subs), die an HTTP Methoden
(GET,POST usw.) und einen Pfad gebunden sind

1 get ’/ ’ => sub {};
2 get ’ / bar /: var ’ => sub {};
3 get ’ / baz / ∗ . ∗ ’ => sub {};
4 any ’/ foo ’ => sub {};

u


Parameter

Parameter
Request-Parameter stehen uber die Methode params als
¨
Hashreferenz zur Verf¨gung
u

1 #! / u s r / b i n / p e r l
2 u s e Dancer ;
3
4 g e t ’ / h e l l o / : name ’ => sub {
5 r e t u r n ” H e l l o t h e r e ” . params−>{name } ;
6 };
7
8 p o s t ’ / f o r m u l a r ’ => sub {
9 my $vorname = params −>{vorname } ;
10 my $nachname = params−>{nachname } ;
11 # ...
12 };
13 dance ;

u


Parameter

Wildcard Parameter/Pfade

splat liefert die Bestandteile eines Wildcard Pfades

1 #! / u s r / b i n / p e r l
2 u s e Dancer ;
3 g e t ’ / d o w n l o a d s / ∗ . ∗ ’ => sub {
4 my ( $ l h s , $ r h s ) = s p l a t ;
5 };
6 dance ;

u


Templates

Templates sind Views

Template mit Parametern als R¨ckgabe
u

1 #! / u s r / b i n / p e r l
2 u s e Dancer ;
3 p o s t ’ / f o r m u l a r ’ => sub {
4 my $vorname = params −>{vorname } ;
5 my $nachname = params−>{nachname } ;
6 return template ’ formular ’ , {
7 vorname => $vorname ,
8 nachname => $nachname ,
9 };
10 };
11 dance ;

u


Logging

Logging Level

Dancer stellt 3 Logging Level zur Verf¨gung
u

1 #! / u s r / b i n / p e r l
2 u s e Dancer qw / : s y n t a x / ;
3 debug ” Custom Debugging Message ” ;
4 w a r n i n g ” Custom Warning Message ” ;
5 error ” Custom E r r o r Message ” ;

u


Eine einfache WebApp

In sieben Schritten zur WebApp
1 Vorbereitung
2 Dancer Projektger¨st erzeugen
u
3 Modell Zufallszahlen Generator
4 Layout anpassen
5 View erstellen
6 Controller schreiben
7 Fertig

Tests
werden ja ohnehin bei jedem Schritt geschrieben

u


Vorbereitung

Kick-Oﬀ

WebApp Zufallszahlen Generator
User kann Zufallszahl aus einem Zahlenbereich ziehen lassen
dient als Starthilfe f¨r den Einstieg in Dancer
u

Screen-Shot

u


Vorbereitung

Inspired by Apple - Web apps - Random Number

http://www.apple.com/webapps/calculate/randomnumber.html

u


Vorbereitung

Live-Demo

Live-Demo

u


Vorbereitung

Zufallszahlen Generator Math::Random

Math::Random

1 u s e Math : : Random qw/ : a l l / ;
2
3 my $low ;
4 my $ h i g h ;
5 my $n = 1 ;
6
7 my $ r a n d o m i n t =
8 r a n d o m u n i f o r m i n t e g e r ( $n , $low , $ h i g h ) ;
9

10 # L i e f e r t im s k a l a r e n K o n t e x t e i n e Z u f a l l s z a h l
11 # a u s dem B e r e i c h $low . . $ h i g h . $n w i r d
12 # nicht beruecksichtigt .

u


Vorbereitung

Template Engine - Template Toolkit

http://template-toolkit.org/

u


Vorbereitung

Validierung des User Inputs

CPAN to the Rescue
Regexp::Common
Provide commonly requested regular expressions
Data::FormValidator
Validates user input (usually from an HTML form) based on
input proﬁle

u


Vorbereitung

Variablen¨bersicht
u

Hauptvariablen
low - Eingabe untere Bereichsgrenze
high - Eingabe obere Bereichsgrenze
random - Ausgabe Zufallszahl

Hilfsvariablen
missing low - Falls untere Bereichsgrenze nicht eingegeben
wurde
missing high - Falls obere Bereichsgrenze nicht eingegeben
wurde

u


Vorbereitung

CPAN-Module installieren

Ben¨tigte Module installieren
o
$ cpan
cpan> install Dancer
cpan> install Template
cpan> install Math::Random
cpan> install Regexp::Common
cpan> install Data::FormValidator

Optional: Weitere Dancer::Plugins installieren
cpan> install Task::Dancer

u


Dancer Projektger¨st
u

Bootstrap -Scaﬀold

Projektger¨st erzeugen
u
$ dancer -a RandomNumber

+ ./RandomNumber
+ RandomNumber/app.psgi + RandomNumber/public
+ RandomNumber/config.yml + RandomNumber/public/css
+ RandomNumber/environments + RandomNumber/public/css/style.css
+ RandomNumber/environments/development.yml + RandomNumber/public/css/error.css
+ RandomNumber/environments/production.yml + RandomNumber/public/images
+ RandomNumber/views + RandomNumber/public/404.html
+ RandomNumber/views/index.tt + RandomNumber/public/dispatch.fcgi
+ RandomNumber/views/layouts + RandomNumber/public/dispatch.cgi
+ RandomNumber/views/layouts/main.tt + RandomNumber/public/500.html
+ RandomNumber/RandomNumber.pl + RandomNumber/t
+ RandomNumber/lib + RandomNumber/t/002_index_route.t
+ RandomNumber/lib/RandomNumber + RandomNumber/t/001_base.t
+ RandomNumber/lib/RandomNumber.pm + RandomNumber/Makefile.pl

u


Modell Zufallszahlengenerator

Package RandomNumber::Generator 1

RandomNumber::Generator Teil 1

1 p a c k a g e RandomNumber : : G e n e r a t o r ;
2 use warnings ; use s t r i c t ;
3
4 u s e Math : : Random qw / : a l l / ;
5 # Dancer L o g g i n g
6 u s e Dancer ’ : s y n t a x ’ ;
7
8 use Exporter ;
9

10 our $VERSION = ’ 0 . 0 1 ’ ;
11 our @ISA = qw/ E x p o r t e r / ;
12 our @EXPORT = ( ) ;
13 our @EXPORT OK = qw/ random number / ;

u


Modell Zufallszahlengenerator

Package RandomNumber::Generator 2

RandomNumber::Generator Teil 2

1 sub random number {
2 my $low = s h i f t @ ;
3 my $ h i g h = s h i f t @ ;
4 i f ( $low > $ h i g h ) {
5 ( $low , $ h i g h ) = ( $ h i g h , $low ) ;
6 }
7 my $n = 1 ;
8 my $random number =
9 r a n d o m u n i f o r m i n t e g e r ( $n , $low , $ h i g h ) ;
10 debug ”Random Number : ’ $random number ’ ” ;
11 r e t u r n $random number ;
12 }

u


Layout anpassen

Template Engine festlegen

Statt Dancer::Template::Simple kommt TT2 zum Einsatz
(conﬁg.yml)
template: "template_toolkit"

Dancer verwendet <% als Start-Tag und %> als End-Tag.
TT2 konﬁgurieren (optional)
template: "template_toolkit"
engines:
template_toolkit:
start_tag: "[%"
stop_tag: "%]"

u


Layout anpassen

Layout anpassen

Layout in views/layouts/main.tt beliebig anpassbar
Die Variable content ist von Dancer/TT2 vordeﬁniert und erh¨lt
a
den Content aus den Templates.
1 <html>
2 <head> . . . </ head>
3 <body>
4 ...
5 <d i v i d=” c o n t e n t ”>
6
7 <% c o n t e n t %>
8
9 </ d i v>
10 ...

u


View erstellen

Eingabe der Daten 1

Template views/index.tt: Formular zur Eingabe der Daten Teil 1

1 <form a c t i o n=” / ” method=” p o s t ”>
2 < t a b l e>
3 < t r>
4 <% I F m i s s i n g l o w % >
5 <t d><f o n t c o l o r=” r e d ”>S t a r t w e r t ( von ) :</ f o n t> </ t d>
6 <% ELSE % >
7 <t d>S t a r t w e r t ( von ) : </ t d>
8 <% END % >
9 <t d><i n p u t t y p e=” t e x t ” name=” low ”
10 v a l u e=”<% low % >” /> </ t d>
11 </ t r>

u


View erstellen

Eingabe der Daten 2


1 < t r>
2 <% I F m i s s i n g h i g h % >
3 <t d><f o n t c o l o r=” r e d ”>Endwert ( b i s ) :</ f o n t> </ t d>
4 <% ELSE % >
5 <t d>Endwert ( b i s ) :</ t d>
6 <% END % >
7 <t d><i n p u t t y p e=” t e x t ” name=” h i g h ”
8 v a l u e=”<% h i g h %>” /> </ t d>
9 </ t r>

u


View erstellen

Eingabe der Daten 3


1 < t r>
2 <t d>&nbsp ;</ t d>
3 <t d><i n p u t t y p e=” s u b m i t ”
4 v a l u e=” Z u f a l l s z a h l z i e h e n ” />
5 </ t d>
6 </ t r>
7 </ t a b l e>
8 </ form>

u


View erstellen

Ausgabe der Daten

Template views/index.tt: Ausgabe der Zufallszahl

1 <% I F random OR random == 0 % >
2 < t r>
3 <t d c o l s p a n=” 2 ”> Z u f a l l s z a h l a u s dem B e r e i c h
4 <b><% low % ></b> b i s <b><% h i g h % ></b> :
5 <f o n t c o l o r=” r e d ”><b><% random % ></b></ f o n t> .
6 </ t d>
7 </ t r>
8 <% END % >

u


Controller schreiben

Controller GET

GET Request in lib/RandomNumber.pm

1 p a c k a g e RandomNumber ;
2 u s e Dancer ’ : s y n t a x ’ ;
3 u s e RandomNumber : : G e n e r a t o r qw/ random number / ;
4 u s e RandomNumber : : V a l i d a t o r qw/ v a l i d a t e l o w h i g h / ;
5
6 o u r $VERSION = ’ 0 . 1 ’ ;
7
8 g e t ’ / ’ => sub {
9 template ’ index ’ ;
10 };

u



Controller POST
POST Request (ohne Validierung)

1 # im p a c k a g e RandomNumber ;
2 p o s t ’ / ’ => sub {
3 my $ h i g h = params−>{h i g h } ;
4 my $low = params−>{low } ;
5
6 my $random = random number ( $low , $ h i g h ) ;
7
8 template ’ index ’ ,
9 {
10 random => $random ,
11 low => $low ,
12 high => $ h i g h ,
13 };
14 };
15 true ;
u



Input Validierung

Aufruf und Verwendung

1 u s e RandomNumber : : V a l i d a t o r qw/ v a l i d a t e l o w h i g h / ;
2
3 my $ r e s u l t s = v a l i d a t e l o w h i g h (
4 { low => $low , h i g h => $ h i g h }
5 );
6
7 i f ( $ r e s u l t s −>s u c c e s s ) {
8 # ...
9 }

u



Input Validierung

validate low high Teil 1

1 p a c k a g e RandomNumber : : V a l i d a t o r ;
2 u s e Regexp : : Common qw / number / ;
3 u s e Data : : F o r m V a l i d a t o r ;
4
5 sub v a l i d a t e l o w h i g h {
6 my $ a r g s = s h i f t @ ;
7 d i e ” Not a Hash R e f e r e n c e ’ $ a r g s ’ ”
8 u n l e s s r e f ( $ a r g s ) eq ’HASH ’ ;
9 my $low = $ a r g s −>{low } ;
10 my $ h i g h = $ a r g s −>{h i g h } ;

u



Input Validierung

validate low high Teil 2 (Proﬁl)

1
2 my $ p r o f i l e = {
3 filters => [ ’ t r i m ’ ] ,
4 required => [ qw ( low h i g h ) ] ,
5 constraints => {
6 low => q r /ˆ$RE{num}{ i n t }$ / ,
7 h i g h => q r /ˆ$RE{num}{ i n t }$ / ,
8 },
9 };

u



Input Validierung

validate low high Teil 3

1 my $ r e s u l t s =
2 Data : : F o r m V a l i d a t o r −>c h e c k (
3 { low => $low , h i g h => $ h i g h } ,
4 $profile );
5

6 return $results ;
7 }

u



Controller POST

POST Request mit Validierung Teil 1

1 # im p a c k a g e RandomNumber ;
2 p o s t ’ / ’ => sub {
3 my $ h i g h = params−>{h i g h } ;
4 my $low = params−>{low } ;
5
6 my $ r e s u l t s = v a l i d a t e l o w h i g h (
7 { low => $low , h i g h => $ h i g h }
8 );

u



Controller POST


1 my $ m i s s i n g l o w =
2 not d e f i n e d ( $ r e s u l t s −>v a l i d ( ’ low ’ ) ) ;
3 my $ m i s s i n g h i g h =
4 not d e f i n e d ( $ r e s u l t s −>v a l i d ( ’ h i g h ’ ) ) ;

u



Controller POST

1 my $random = u n d e f ;
2 i f ( $ r e s u l t s −>s u c c e s s ( ) ) {
3 $random = random number ( $low , $ h i g h ) ;
4 }
5

6 template ’ index ’ ,
7 {
8 random => $random ,
9 low => $low ,
10 high => $high ,
11 missing low => $missing low ,
12 missing high => $missing high ,
13 };
14 };

u


Fertig

Fertig!

Have Fun!

Source Code at GitHub
http://github.com/tomfahle/Dancer-RandomNumber

u


Dancer Resources

RTFM

Dancer wird mit umfangreicher Dokumentation ausgeliefert
Dancer - Eﬀortless Web Framework for Perl -
http://perldancer.org/
Dancer::Introduction - http:
//search.cpan.org/perldoc?Dancer::Introduction
Dancer::Cookbook -
http://search.cpan.org/perldoc?Dancer::Cookbook
Dancer::Conﬁg
http://search.cpan.org/perldoc?Dancer::Config
Dancer::Session
http://search.cpan.org/perldoc?Dancer/Session.pm
Dancer::Deployment -
http://search.cpan.org/perldoc?Dancer::Deployment
u


Dancer Resources

IRC und Mailing-Liste

Direkter Kontakt zu Entwicklern und Usern
IRC - irc.perl.org #dancer.
Dancer-users - Perl Dancer users mailing list -
http://lists.perldancer.org/cgi-bin/listinfo/
dancer-users

u


Dancer Vortr¨ge Artikel Blogs
a

Vortr¨ge
a

Slides
Alexis Sukrieh -Writing webapps with Perl Dancer -
http://www.slideshare.net/asukrieh/
writing-webapps-with-perl-dancer
Alexis Sukrieh -Perl Dancer, FPW 2010 -
http://www.slideshare.net/asukrieh/
perl-dancer-fpw-2010-4482016

u


a

Artikel

Allgemeine Artikel
A Website in a Minute Using Dancer,
the Eﬀortless Web Framework -
http://www.perl.org/pub/2010/04/
a-website-in-a-minute-using-dancer-the-effortless-web-
html
The Dancer Ecosystem http://lumberjaph.net/blog/
index.php/2010/04/19/the-dancer-ecosystem/

u


a

Beispiele

Blogbeitr¨ge mit Beispielen und Code
a
Juan J. Mart´ınez - Screencast: aplicaci´n de ejemplo con
o
Dancer - http://blackshell.usebox.net/archive/
screencast--aplicacion-de-ejemplo-con-dancer.html
Poison Bit - Web login form Vs Microsoft Active Directory -
http://poisonbit.wordpress.com/2010/04/06/
web-login-form-vs-microsoft-active-directory/
Poison Bit - Login form validating operative system users (no
DDBB), in 6 steps -
http://poisonbit.wordpress.com/2010/07/14/
login-form-validating-operative-system-users-no-ddbb-i

u


Recommended Readings

Dancer vs. Mojo

Alias: Building Top100 2.0
Pitting Mojo vs Dancer in a competition to build Top100 2.0
http://use.perl.org/~Alias/journal/40270
Mojo vs Dancer Week 1 - Installer, Support and Hello World
Mojo vs Dancer Week 2 - Templates and Images

u



Additional Readings

TT2, PSGI/Plack
Template Toolkit - http://template-toolkit.org/
PSGI/Plack - Perl Superglue for Web Frameworks and Web
Servers - http://plackperl.org/

u



Related Web Frameworks

Weitere Frameworks zum Vergleich
Mojolicious - a Merb and Sinatra inspired web framework -
http://mojolicious.org/
Catalyst - The elegant MVC framework -
http://www.catalystframework.org/
Sinatra - http://www.sinatrarb.com/

u


Fragen

Fragen?

Fragen?
Fragen!

u


Danke!

Vielen Dank!

Danke!
Vielen Dank!

u


Perl.org

Perl.org

When you need Perl think Perl.org
http://www.Perl.org
http://learn.Perl.org
http://blogs.Perl.org
http://jobs.Perl.org

Flexible & Powerful
That’s why we love Perl!

u

Dancer Presentation FrOSCon 2010

Recomendados

Recomendados

Mais conteúdo relacionado

Destaque

Destaque (20)

Dancer Presentation FrOSCon 2010