From: Charles McGarvey Date: Mon, 11 Jul 2016 23:02:10 +0000 (-0600) Subject: initial commit X-Git-Url: https://git.brokenzipper.com/gitweb?a=commitdiff_plain;h=499f996ae29359b7fd5179cad7e6cb367023354d;p=chaz%2Ftalk-introduction-to-psgi initial commit --- 499f996ae29359b7fd5179cad7e6cb367023354d diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..eb0b95f --- /dev/null +++ b/Makefile @@ -0,0 +1,38 @@ + +SLIDES = introduction-to-psgi +BROWSER = chrome +DOT = dot + +dotfiles = $(shell find . -iname '*.dot') +svgfiles = $(patsubst %.dot,%.svg,$(dotfiles)) + +all: $(svgfiles) + +clean: + rm -f slides-offline.html remark.min.js $(SLIDES).pdf $(svgfiles) + +offline: slides-offline.html remark.min.js $(svgfiles) + +pdf: $(SLIDES).pdf + +run: $(svgfiles) + $(BROWSER) slides.html + +run-offline: offline + $(BROWSER) slides-offline.html + +%.svg: %.dot + $(DOT) -Tsvg -o$@ $< + +$(SLIDES).pdf: slides.html $(wildcard css/*) $(wildcard img/*) $(svgfiles) + docker run --rm -v `pwd`:/pwd astefanutti/decktape /pwd/slides.html /pwd/$(SLIDES).pdf + +slides-offline.html: slides.html + sed -e '1 a ' \ + -e 's!https://.*remark-latest\.min\.js!remark.min.js!' <$< >$@ + +remark.min.js: + curl -Lo $@ https://gnab.github.io/remark/downloads/remark-latest.min.js + +.PHONY: all clean offline pdf run run-offline + diff --git a/README.md b/README.md new file mode 100644 index 0000000..9ca631d --- /dev/null +++ b/README.md @@ -0,0 +1,18 @@ + +# Slides for "Introduction to PSGI" + +This directory contains the slides for my talk entitled "Introduction to PSGI". + +The slides were written in [Markdown](https://daringfireball.net/projects/markdown/) format and can be rendered with +[remark](http://remarkjs.com/). + +## Options + +To view the slides: + + make run + +To build a PDF version of the slides: + + make pdf + diff --git a/abstract.txt b/abstract.txt new file mode 100644 index 0000000..1240399 --- /dev/null +++ b/abstract.txt @@ -0,0 +1,18 @@ +If you write web apps in Perl (perhaps using Catalyst, Mojolicious, Dancer, or +one of the other great web frameworks), you are probably already using PSGI, +but do you understand how it works and why PSGI is so amazing? You should! If +you still write web apps using CGI, then there are many reasons why you should +create your next project using a PSGI-compatible web framework. + +PSGI is a specification, like CGI, that describes how web apps and web servers +can communicate. It stands for Perl web Server Gateway Interface, and the +first version of the specification was published to the CPAN on Oct 13, 2009. + +This talk will go over: +* what PSGI is and how it works, +* how it differs and is better than CGI, +* what makes it so cool, +* and how you can use it to do awesome things. + +You'll get the most out of this talk if you already know Perl and use it to +build web applications. diff --git a/css/common.css b/css/common.css new file mode 100644 index 0000000..63feb09 --- /dev/null +++ b/css/common.css @@ -0,0 +1,79 @@ +@import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz); +@import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic); +@import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic); + +body { + font-family: 'Droid Serif'; +} + +h1, h2, h3 { + font-family: 'Yanone Kaffeesatz'; + font-weight: normal; +} + +.remark-slide-content li { + line-height: 2em; +} +.remark-slide-content .condensed li { + line-height: 1em; +} + + +.remark-code, .remark-inline-code { + font-family: Inconsolata, 'Ubuntu Mono'; +} +.remark-code { + border-radius: 5px; + border: 1px solid #ccc; +} + +blockquote { + border-radius: 5px; + border: 1px solid #ccc; + background: #f0f0f0; + margin: 1.5em 0; + padding: 1em; + quotes: "\201C""\201D""\2018""\2019"; + position: relative; +} +blockquote:before { + color: #ccc; + position: absolute; + content: open-quote; + font-size: 6em; + line-height: 0.1em; + margin-right: 0.25em; + vertical-align: -0.4em; +} + +.col { + box-sizing: border-box; + display: block; + float: left; + border: 0; + margin: 0; + padding: 0; + width: 50%; +} +.col:nth-of-type(odd) { + padding: 0 1em 0 0; +} +.col:nth-of-type(even) { + padding: 0 0 0 1em; +} +.col.sep:nth-of-type(odd) { + border-right: 1px solid #ccc; +} +.col.sep:nth-of-type(even) { + border-left: 1px solid #ccc; +} + +.top-right { + float: right; + margin: 50px 0 0 2em; +} + +.highlight { + color: #7d9726; +} + diff --git a/css/slides.css b/css/slides.css new file mode 100644 index 0000000..210a3db --- /dev/null +++ b/css/slides.css @@ -0,0 +1,61 @@ + +.basic-flow { + line-height: 200px; + height: 200px; +} +.basic-flow img { + display: inline-block; + vertical-align: middle; + max-width: 100%; +} + +/* fix overzealous syntax highlighter */ +.http .hljs-selector-tag, +.http .hljs-selector-class { + font-weight: normal; + color: inherit; +} + +.cgi .remark-code { + font-size: 22px; +} + +.fastcgi .remark-code { + font-size: 22px; +} + +.mod_perl .remark-code { + font-size: 20px; +} + +.psgi .remark-code { + font-size: 22px; +} + +/* fix non-collapsing margin */ +.psgi pre { + margin-bottom: 0; +} + +.plackup .remark-code { + font-size: 24px; +} + +.app-psgi .remark-code { + font-size: 22px; +} + +.env .condensed li { + line-height: 1.4em; +} + +.middleware .remark-code { + font-size: 22px; +} + +#slide-theend .talkqr img { + display: inline-block; + width: 230px; + height: 230px; +} + diff --git a/img/avatar-miyagawa.jpg b/img/avatar-miyagawa.jpg new file mode 100644 index 0000000..44112ba Binary files /dev/null and b/img/avatar-miyagawa.jpg differ diff --git a/img/basic-flow1.dot b/img/basic-flow1.dot new file mode 100644 index 0000000..af995dd --- /dev/null +++ b/img/basic-flow1.dot @@ -0,0 +1,24 @@ + +digraph G +{ + rankdir = LR + + node + [ + fontname = "Inconsolata" + fontsize = 22 + shape = record + style = rounded + ] + + edge + [ + fontname = "Inconsolata" + fontsize = 20 + arrowhead = vee + arrowtail = vee + ] + + "user\nagents" -> "your\napp" [label="PSGI",dir=both,fontcolor=blue,fontsize=30] +} + diff --git a/img/basic-flow2.dot b/img/basic-flow2.dot new file mode 100644 index 0000000..0cebe6d --- /dev/null +++ b/img/basic-flow2.dot @@ -0,0 +1,27 @@ + +digraph G +{ + rankdir = LR + + node + [ + fontname = "Inconsolata" + fontsize = 22 + shape = record + style = rounded + ] + + edge + [ + fontname = "Inconsolata" + fontsize = 20 + arrowhead = vee + arrowtail = vee + ] + + "user\nagents" -> "web\nserver" [label="HTTP",dir=both] + "web\nserver" -> "your\napp" [label="PSGI",dir=both,fontcolor=blue,fontsize=30] + + "web\nserver" [style="rounded,filled",fillcolor="#FFFF88"] +} + diff --git a/img/basic-flow3.dot b/img/basic-flow3.dot new file mode 100644 index 0000000..bcaefde --- /dev/null +++ b/img/basic-flow3.dot @@ -0,0 +1,28 @@ + +digraph G +{ + rankdir = LR + + node + [ + fontname = "Inconsolata" + fontsize = 22 + shape = record + style = rounded + ] + + edge + [ + fontname = "Inconsolata" + fontsize = 20 + arrowhead = vee + arrowtail = vee + ] + + "user\nagents" -> "web\nserver" [label="HTTP",dir=both] + "web\nserver" -> "PSGI\nhandler" [label="CGI, mod_perl,\nFastCGI, HTTP",dir=both] + "PSGI\nhandler" -> "your\napp" [label="PSGI",dir=both,fontcolor=blue,fontsize=30] + + "PSGI\nhandler" [style="rounded,filled",fillcolor="#FFFF88"] +} + diff --git a/img/basic-flow4.dot b/img/basic-flow4.dot new file mode 100644 index 0000000..83ba026 --- /dev/null +++ b/img/basic-flow4.dot @@ -0,0 +1,35 @@ + +digraph G +{ + rankdir = LR + + node [ + fontname = "Inconsolata" + fontsize = 22 + shape = record + style = rounded + ] + + edge [ + fontname = "Inconsolata" + fontsize = 20 + arrowhead = vee + arrowtail = vee + ] + + "user\nagents" -> "web\nserver" [label="HTTP",dir=both] + "web\nserver" -> "PSGI\nhandler" [label="CGI, mod_perl,\nFastCGI, HTTP",dir=both] + "PSGI\nhandler" -> "your\napp" [label="PSGI",dir=both,fontcolor=blue,fontsize=30] + + subgraph cluster_devops { + fontname = "Inconsolata" + fontsize = 30 + label = "DevOps" + style = filled + fillcolor = "#FFFF88" + + "web\nserver" + "PSGI\nhandler" + } +} + diff --git a/img/basic-flow5.dot b/img/basic-flow5.dot new file mode 100644 index 0000000..5fbef5c --- /dev/null +++ b/img/basic-flow5.dot @@ -0,0 +1,38 @@ + +digraph G +{ + rankdir = LR + + node + [ + fontname = "Inconsolata" + fontsize = 22 + shape = record + style = rounded + ] + + edge + [ + fontname = "Inconsolata" + fontsize = 20 + arrowhead = vee + arrowtail = vee + ] + + "user\nagents" -> "web\nserver" [label="HTTP",dir=both] + "web\nserver" -> "PSGI\nhandler" [label="CGI, mod_perl,\nFastCGI, HTTP",dir=both] + "PSGI\nhandler" -> "web\nframework" [label="PSGI",dir=both,fontcolor=blue,fontsize=30] + "web\nframework" -> "your\napp" [label="???",dir=both] + + "web\nframework" [style="rounded,filled",fillcolor="#FFFF88"] + + subgraph cluster_devops { + fontname = "Inconsolata" + fontsize = 30 + label = "DevOps" + + "web\nserver" + "PSGI\nhandler" + } +} + diff --git a/img/bluehost.png b/img/bluehost.png new file mode 100644 index 0000000..3a83180 Binary files /dev/null and b/img/bluehost.png differ diff --git a/img/cgi.gif b/img/cgi.gif new file mode 100644 index 0000000..2813732 Binary files /dev/null and b/img/cgi.gif differ diff --git a/img/cpan.png b/img/cpan.png new file mode 100644 index 0000000..a3a3d2b Binary files /dev/null and b/img/cpan.png differ diff --git a/img/fastcgi.png b/img/fastcgi.png new file mode 100644 index 0000000..458c0df Binary files /dev/null and b/img/fastcgi.png differ diff --git a/img/mod_perl.gif b/img/mod_perl.gif new file mode 100644 index 0000000..a9a3f67 Binary files /dev/null and b/img/mod_perl.gif differ diff --git a/img/talkqr.svg b/img/talkqr.svg new file mode 100644 index 0000000..9904271 --- /dev/null +++ b/img/talkqr.svg @@ -0,0 +1,9 @@ + + + QR Code + https://joind.in/talk/6e4d2 + + + + + diff --git a/notes.txt b/notes.txt new file mode 100644 index 0000000..49c810b --- /dev/null +++ b/notes.txt @@ -0,0 +1,35 @@ + +- High-level what is PSGI: + - Interface between web app and web server. + - a specification (not code) + +- Why care about understanding PSGI when you can just use a high-level language. + +- Alternatives: CGI, mod_perl, FCGI, SCGI, WSGI (Python), JSGI (JS), Rack (Ruby), ISAPI (IIS) + +- Describe how CGI, mod_perl, and FCGI work. + +PSGI is easy. RFC 3875 (CGI 1.1) is 36 pages. +The PSGI spec is shorter and much more consumable. + +Overview of HTTP? + +Implementations: + - Plack + - Alternatives: Paste (Python), + - Rack-compliant: Rack (Ruby), Clack (Common Lisp) + +Benefits of PSGI: +- Web frameworks only need to target PSGI. +- Easy to write tests because requests and responses are data, not necessarily bytestreams. + +- What frameworks support PSGI? + - [Catalyst](http://www.catalystframework.org/) + - [Mojolicious](http://mojolicious.org/) + - [Dancer](http://perldancer.org/) + - [CGI::Ex](https://github.com/chazmcgarvey/CGI-Ex/tree/psgi-2) + +- What handlers does plack support? + +- What types of things should be written as middleware? + diff --git a/slides.html b/slides.html new file mode 100644 index 0000000..5781fc8 --- /dev/null +++ b/slides.html @@ -0,0 +1,1476 @@ + +Introduction to PSGI +