forked from berb/rest-talk-uulm
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
executable file
·1824 lines (1550 loc) · 55.9 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!DOCTYPE html>
<!--
Google HTML5 slide template
Authors: Luke Mahé (code)
Marcin Wichary (code and design)
Dominic Mazzoni (browser compatibility)
Charles Chen (ChromeVox support)
URL: http://code.google.com/p/html5slides/
-->
<!--
UUlm Style
Author: Benjamin Erb
URL: https://github.com/berb/html5slides-uulm
-->
<html>
<head>
<link href="lib/styles.css" media="screen" rel="stylesheet" type="text/css" />
<link href="lib/uulm/uulm.css" media="screen" rel="stylesheet" type="text/css" />
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<meta charset='utf-8'>
<script src='lib/slides.js'></script>
<title>Representational State Transfer</title>
</head>
<body style='display: none'>
<div class='slides layout-normal template-uulm-in'>
<!--
Your slides (<article>s) go here. You can group them using <section>s
Every slide must be part of a section. If a section contains a <header>,
its content will be used as TOC label. If you don't want to group your
slides, just put all of your <article>s in a single <section>.
-->
<section>
<article class='title-slide'>
<h1 id="title">REST</h1>
<h2 id="author">
Benjamin Erb<br>2013-12-12
</h2>
<h2 id="subtitle">Representational State Transfer<br>Distributed Architectures with HTTP</h2>
<p>
<img id="title-header" src='assets/images/header_916823243_c868b446ac_o.jpg'>
<img id="uulm-logo" src='lib/uulm/uulm_logo.svg'>
</p>
</article>
<article>
<h3>Background</h3>
<div style="width:80%">
<p></p>
<p>
<img src="assets/images/berb.jpeg" style="border: 1px solid black; float:right; margin: 10px">
<span style="font-weight:bold;" class="med-color">Benjamin Erb</span><br/>
<a href="http://www.uni-ulm.de/en/in/vs/staff/erb.html">Research Assistant</a> @ uulm<br/>
<a href="http://www.uni-ulm.de/en/in/vs.html">Institute of Distributed Systems</a>
</p>
<p><span style="font-weight:bold;">Interests:</span> distributed systems, scalable architectures, computer networking, concurrent programming, web technologies </p>
<div style="clear:both;"></div>
<p><span style="font-weight:bold;">Contact:</span><br/>
<i class="fa fa-external-link"></i> <a href="http://www.benjamin-erb.de/">benjamin-erb.de</a><br/>
<i class="fa fa-twitter"></i> <a href="http://www.twitter.com/b_erb">@b_erb</a><br/>
<i class="fa fa-google-plus"></i> <a href="b.erb.io/+">b.erb.io/+</a><br/>
<br/>
</p>
</div>
</article>
</section>
<section>
<header>Distributed Systems #101</header>
<article class="fill">
<h1>Distributed Systems #101</h1>
</article>
<article class="fill">
<q style="font-size:140%; line-height:175%">A <span style="font-weight:bold" class="med-color">distributed system</span> is one in which the failure of a computer you didn't even know existed can render your own computer unusable.</q>
<div class='author'>Leslie Lamport</div>
</article>
<article class="fill">
<q style="font-size:140%; line-height:175%">A collection of independent computers that appears to its users as a single coherent system.</q>
<div class='author'>Andrew Tanenbaum</div>
</article>
<article>
<h3>Distributed Systems – Why?</h3>
<p class="build">
<img src="assets/illu/server.svg" style="width: 35%; float:left; margin: 10px">
<img src="assets/illu/servers.svg" style="width: 35%; float:right; margin: 10px">
</p>
<div style="clear:both;"></div>
<div class="build">
<ul class="">
<li>more machines → more resources</li>
<li>more CPUs → more computing power</li>
<li>more storage → higher capacity </li>
</ul>
</div>
</article>
<article class="">
<h3>Distributed Systems – Why?</h3>
<h4>Non-functional Features</h4>
<ul>
<li>fault-tolerance</li>
<li>high availability</li>
<li>reliability</li>
<li>scalablity</li>
<li>performancce</li>
<li>openness</li>
</ul>
</article>
<article class="">
<h3>Distributed Systems – Building Blocks (1)</h3>
<dl class="#build">
<dt class="med-color">A program</dt>
<dd>is the code you write. </dd>
<dt class="med-color">A process</dt>
<dd>is what you get when you run a <span class="med-color">program</span>.</dd>
<dt class="med-color">A message</dt>
<dd>is used to communicate between <span class="med-color">processes</span>.</dd>
<dt class="med-color">A packet</dt>
<dd>is a fragment of a <span class="med-color">message</span> that might travel on a wire.</dd>
<dt class="med-color">A protocol</dt>
<dd>is a formal description of <span class="med-color">message</span> formats and the rules that two <span class="med-color">processes</span> must follow in order to exchange those <span class="med-color">messages</span>.</dd>
</dl>
<div class='source'>Source: <a href="http://code.google.com/intl/de/edu/parallel/dsd-tutorial.html">Introduction to Distributed System Design (Google Code University)</a></div>
</article>
<article class="">
<h3>Distributed Systems – Building Blocks (2)</h3>
<dl class="#build">
<dt class="med-color">A network</dt>
<dd>is the infrastructure that connects different machines via communication links. </dd>
<dt class="med-color">A component</dt>
<dd>can be a process or any piece of hardware required to run a <span class="med-color">process</span>, support communications between <span class="med-color">processes</span>, store data, etc.</dd>
<dt class="med-color">A distributed system</dt>
<dd>is an application that executes a collection of <span class="med-color">protocols</span> to coordinate the actions of multiple <span class="med-color">processes</span> on a <span class="med-color">network</span>, such that all <span class="med-color">components</span> cooperate together to perform a single or small set of related tasks.</dd>
</dl>
<div class='source'>Source: <a href="http://code.google.com/intl/de/edu/parallel/dsd-tutorial.html">Introduction to Distributed System Design (Google Code University)</a></div>
</article>
<article class="fill">
<h1>So easy! Really?</h1>
<h3><br/>Unfortunately, distributed systems are hard!</h3>
</article>
<article class="">
<h3>Distributed systems you might have used already…</h3>
<table>
<tr>
<th rowspan="2">Networks</th>
<td>Internet</td>
</tr>
<tr>
<td>LAN</td>
</tr>
<tr>
<th rowspan="2">Client/Server Applications*</th>
<td>World Wide Web</td>
</tr>
<tr>
<td>SMTP & IMAP/POP3</td>
</tr>
<tr>
<th rowspan="2">P2P Applications*</th>
<td>Bit Torrent</td>
</tr>
<tr>
<td>Skype</td>
</tr>
</table>
<p style="font-size:.8em; font-style:italic" class="accent-color">(*): Applications are a set of components and protocols in this context.</p>
</article>
<article class="">
<h3>Programming Distributed Applications</h3>
<dl>
<dt class="med-color">Local application</dt>
<dd>runs on a single machine (your computer)</dd>
<dt class="med-color">Distributed application</dt>
<dd>runs on multiple machines, communicates</dd>
</dl>
<p>We need a way to incorporate <span class="in-color">communication and coordination</span> into our code.</p>
</article>
<article class="fill">
<h1>Why not use TCP or UDP sockets directly?</h1>
</article>
<article class="">
<h3>Why not use TCP or UDP sockets directly?</h3>
<p>Because it is a <strong>very bad idea</strong> most of the time. By not using existing application-layer protocols, we lose:
<ul>
<li>abstraction</li>
<li>knowledge and experience</li>
<li>reusability</li>
<li>interoperability</li>
<li>etc.</li>
</ul>
</p>
</article>
<article class="">
<h3>Don't reinvent the wheel!</h3>
<p>Dedicated <span class="mawi-color">middleware systems</span> are available to provide these features as an abstraction layer, such as</p>
<ul>
<li>message queues</li>
<li>remote procedure calls</li>
<li>remote method invocations</li>
<li>web services</li>
</ul>
</article>
<article class="">
<h3>Message Queues</h3>
<img class="centered" style="" src="assets/illu/mq.svg">
</article>
<article class="">
<h3>Remote Procedure Calls & Distributed Objects</h3>
<img class="centered" style="width:100%" src="assets/illu/rmi.svg">
</article>
<article class="">
<h3>"Web Services"</h3>
<q style="font-size:120%; line-height:165%">The idea of message systems is really cool, but they can't traverse our corporate firewalls!<br/> Why not use HTTP for messaging?! Port 80 is already open! I like XML.</q>
<div class='author'>Anonymous CTO</div>
</article>
<article class="">
<h3>"Web Services"</h3>
<ul>
<li>protocol stack: SOAP, WSDL, (UDDI)</li>
<li>provide features similar to RPC and messaging</li>
<li>XML-serialized messages</li>
<li>code generators for various languages (serialization/deserialization of SOAP messages <=> language constructs)</li>
<li>use various application-layer protocols for transport (i.e. <span class="nawi-color">HTTP</span>, SMTP,…)</li>
</ul>
</article>
<article class="fill">
<q style="font-size:120%; line-height:165%">SOAP. Simple Object Access Protocol. Except it's not Simple, it's Complicated. And it's not about Objects, it's about RPC. So, really: CRAP</q>
<div class='author'><a href="https://twitter.com/#!/joewalnes/status/146598054915612673">@joewalnes</a></div>
</article>
<article class="">
<h3>"Web Services"</h3>
<ul>
<li>popular industry/enterprise technologies</li>
<li>appropriate for several use cases</li>
<li>very complex, tons of standards (WS-*)</li>
<li>have almost nothing to do with the actual web!</li>
</ul>
<p>Using the <span class="mawi-color">Hypertext Transfer Protocol</span> as a low-level, interchangable <span class="nawi-color">transport protocol</span> for XML-encoded messages is not the same as "web".</p>
</article>
<article class="fill">
<h1>The Challenge</h1>
<p style="font-size:120%; line-height:165%">Can we build distributed applications using the web like it is supposed to, embracing its ideas and concepts?</p>
</article>
</section>
<section>
<header>HTTP Reprise</header>
<article class="fill">
<h1>The World Wide Web</h1>
<h3>URI + HTTP (+ HTML)</h3>
<h3 class="mawi-color"><span class="accent-color">A Little Refresher</span></h3>
</article>
<article class="fill">
<h1>URI</h1>
<h3>Uniform Resource Identifier</h3>
</article>
<article class="">
<h3>Uniform Resource Identifier: Structure</h3>
<section><pre> http://thehost.tld:8080/path/to/it?name=value#foo
\__/ \______________/\_________/ \________/ \_/
| | | | |
scheme authority path query fragment</pre></section>
</article>
<article class="">
<h3>Uniform Resource Identifier</h3>
<ul>
<li>naming</li>
<li>addressing</li>
<li>identifying</li>
</ul>
<div class="build">
<p><br/>Also, <a href="http://www.w3.org/Provider/Style/URI">cool URIs don't change</a>!</p>
</div>
</article>
<article class="fill">
<h1>HTTP</h1>
<h3>Hypertext Transfer Protocol</h3>
</article>
<article class="fill">
<q style="font-size:120%; line-height:165%">The Hypertext Transfer Protocol (HTTP) is an <span class="med-color">application-level protocol</span> for <span class="mawi-color">distributed, collaborative, hypermedia information systems</span>. It is a <span class="med-color">generic, stateless</span>, protocol[…].</q>
<div class='author'><a href="http://tools.ietf.org/html/rfc2616">RFC 2616</a></div>
</article>
<article class="">
<h3>Hypertext Transfer Protocol</h3>
<ul>
<li>request/response</li>
<li>client/server</li>
<li>stateless</li>
<li>resource-oriented</li>
<li>on top of <code>TCP/IP</code></li>
</ul>
</article>
<article class="">
<h3>HTTP: Clients, (Caching/Reverse) Proxies, Servers</h3>
<img class="centered" style="width:100%" src="assets/illu/client_server_cache.svg">
</article>
<article class="">
<h3>Hypertext Transfer Protocol: Request/Response</h3>
<section class="build"><pre>GET /foo HTTP/1.1
Host: erb.io
</pre></section>
<section class="build"><pre>
HTTP/1.1 200 OK
Date: Wed, 04 Jan 2012 17:01:59 GMT
Server: myserver/0.0.7
Last-Modified: Wed, 25 Nov 2011 12:13:15 GMT
Etag: "3ab23c-21f-12058638"
Content-Length: 11
Connection: close
Content-Type: text/plain; charset=UTF-8
hello world</pre></section>
</article>
<article class="">
<h3>HTTP Request Methods</h3>
<table>
<tr>
<th width="25%"></th>
<th width="25%">safe</th>
<th width="25%">idempotent</th>
<th width="25%">cachable</th>
</tr>
<tr>
<th style="font-family:monospace; font-weight:bold">HEAD</td>
<td>✓</td>
<td>✓</td>
<td>(✓)</td>
</tr>
<tr>
<th style="font-family:monospace; font-weight:bold">GET</td>
<td>✓</td>
<td>✓</td>
<td>(✓)</td>
</tr>
<tr>
<th style="font-family:monospace; font-weight:bold">PUT</td>
<td></td>
<td>✓</td>
<td></td>
</tr>
<tr>
<th style="font-family:monospace; font-weight:bold">DELETE</td>
<td></td>
<td>✓</td>
<td></td>
</tr>
<tr>
<th style="font-family:monospace; font-weight:bold">POST</td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</article>
<article class="">
<h3>Data Operations</h3>
<table>
<tr>
<th width="30%">Operation</th>
<th width="35%">in SQL</th>
<th width="35%">in HTTP</th>
</tr>
<tr>
<td>Create</td>
<td style="font-family:monospace">INSERT</td>
<td style="font-family:monospace">POST / PUT</td>
</tr>
<tr>
<td>Read</td>
<td style="font-family:monospace">SELECT</td>
<td style="font-family:monospace">GET / HEAD</td>
</tr>
<tr>
<td>Update</td>
<td style="font-family:monospace">UPDATE</td>
<td style="font-family:monospace">PUT / POST</td>
</tr>
<tr>
<td>Delete</td>
<td style="font-family:monospace">DELETE</td>
<td style="font-family:monospace">DELETE</td>
</tr>
</table>
<div class="build">
<p style="margin-top:30px;" class="box bg-nawi-color"><strong>Please note:</strong> The comparison may be flawed on closer consideration. SQL is about manipulating data sets. REST is about transforming application state changes via hypermedia, HTTP and URIs.</p>
</div>
</article>
<article class="smaller">
<h3>HTTP Response Status Codes</h3>
<p>(very incomplete list, only some exampless)</p>
<table>
<tr>
<th rowspan="1" width="15%">1xx</th>
<th rowspan="1" width="35%">informational</th>
<td width="15%">100</td>
<td width="35%">Continue</td>
</tr>
<tr>
<th rowspan="1">2xx</th>
<th rowspan="1"">sucess</th>
<td>200</td>
<td>Ok</td>
</tr>
<tr>
<th rowspan="2">3xx</th>
<th rowspan="2">redirection</th>
<td>300</td>
<td>Multiple Choices</td>
</tr>
<tr>
<td>301</td>
<td>Moved Permanently</td>
</tr>
<tr>
<th rowspan="3">4xx</th>
<th rowspan="3">client error</th>
<td>400</td>
<td>Bad Request</td>
</tr>
<tr>
<td>404</td>
<td>Not Found</td>
</tr>
<tr>
<td>409</td>
<td>Conflict</td>
</tr>
<tr>
<th>5xx</th>
<th>server error</th>
<td>500</td>
<td>Internal Server Error</td>
</tr>
</table>
</article>
<article class="">
<h3>Some Advanced HTTP Features</h3>
<ul>
<li>conditional requests</li>
<li>content negotiation</li>
<li>caching</li>
<li>partial requests</li>
<li>persistent connections</li>
<li>request pipelining</li>
<li>chunked encoding</li>
</ul>
</article>
<article class="smaller">
<h3>HTTP: Conditional Requests (1)</h3>
<section class="build"><pre>GET /foo HTTP/1.1
If-Modified-Since: Wed, 18 Nov 2011 19:21:45 GMT
Host: erb.io
</pre></section>
<section class="build"><pre>
HTTP/1.1 200 OK
Date: Wed, 04 Jan 2012 17:01:59 GMT
Server: myserver/0.0.7
Last-Modified: Wed, 25 Nov 2011 12:13:15 GMT
Etag: "3ab23c-21f-12058638"
Content-Length: 11
Connection: close
Content-Type: text/plain; charset=UTF-8
hello world</pre>
<p class="box bg-nawi-color">Resource has been changed (here: <code>Last-Modified</code> mismatch).</p>
</section>
</article>
<article class="smaller">
<h3>HTTP: Conditional Requests (2)</h3>
<section class="build"><pre>GET /foo HTTP/1.1
Host: erb.io
If-None-Match: "103-4585efb972780;49711a471c400"
</pre></section>
<section class="build"><pre>
HTTP/1.1 304 Not Modified
Date: Wed, 04 Jan 2012 17:06:01 GMT
Server: myserver/0.0.7
Etag: "103-4585efb972780;49711a471c400"
Connection: close</pre>
<p class="box bg-mawi-color">Resource has not yet changed (here: <code>ETag</code> match).</p>
</section>
</article>
<article class="smaller">
<h3>HTTP: Content Negotiation (1)</h3>
<section class="build"><pre>GET /foo HTTP/1.1
Accept: text/plain, text/html
Accept-Language: de; q=1.0, en; q=0.5
Host: erb.io
</pre></section>
<section class="build"><pre>
HTTP/1.1 200 OK
Date: Wed, 04 Jan 2012 17:01:59 GMT
Server: myserver/0.0.7
Etag: "3ab23c-21f-12058638"
Content-Length: 10
Connection: close
Content-Type: text/plain; charset=UTF-8
Content-Language: de
hallo welt</pre>
<p class="box bg-mawi-color">Server returns german text representation, as requested.</p>
</section>
</article>
<article class="smaller">
<h3>HTTP: Content Negotiation (2)</h3>
<section class="build"><pre>GET /foo HTTP/1.1
Accept: application/msexcel
Accept-Language: it
Host: erb.io
</pre></section>
<section class="build"><pre>
HTTP/1.1 406 Not Acceptable
Date: Wed, 04 Jan 2012 18:21:15 GMT
Server: myserver/0.0.7
Content-Length: 22
Connection: close
Content-Type: text/plain; charset=UTF-8
Content-Language: en
Sorry, can't do that!</pre>
<p class="box bg-nawi-color">Content negotiation failed, server can't fulfil the request.</p>
</section>
</article>
<article class="fill">
<h1>Hypermedia Formats</h1>
</article>
<article>
<h3>Hypermedia Representations</h3>
<ul>
<li>HTML</li>
<li>XHTML</li>
<li>HTML5</li>
<li>Atom</li>
</ul>
</article>
<article>
<h3>Hypermedia: Links</h3>
<section class=""><pre><a href="/foo#bar">Over there!</a></pre></section>
<section class=""><pre><link rel="stylesheet" type="text/css" href="mystyle.css" /></pre></section>
<section class=""><pre><a rel="next" href="http://example.org/entries/3">next item</a></pre></section>
<section class=""><pre><a rel="crush" href="http://social.net/hot-person">Hot!</a></pre></section>
</article>
<article>
<h3>Hypermedia: Link Relations</h3>
<p><strong>Semantic</strong> description of link relations.</p>
<ul>
<li><a href="http://www.iana.org/assignments/link-relations/link-relations.xml">IANA Link Relations</a></li>
<li><a href="http://microformats.org/wiki/existing-rel-values">HTML rel values</a></li>
</ul>
</article>
<article class="smaller">
<h3>Hypermedia: Forms</h3>
<section class="build">
<pre><form action="http://example.org/users" method="post">
<input name="name" type="text" value="" />
<input name="login" type="text" value="" />
<input type="submit" />
</form> </pre></section>
<section class="build"><pre>POST /users HTTP/1.1
Host: example.org
User-Agent: Mozilla/5.0 (Ubuntu; X11; Linux x86_64; rv:9.0.1) Gecko/20100101 Firefox/9.0.1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: de-de,de;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Content-Type: application/x-www-form-urlencoded
Content-Length: 28
name=Benjamin+Erb&login=b_erb</pre></section>
</article>
</section>
<section>
<header>Architectural Style: Representational State Transfer</header>
<article class="fill">
<h1>REST</h1>
<h3>Representational State Transfer</h3>
</article>
<article class="fill">
<h1>REST</h1>
<h3>Introducing the Architectural Style</h3>
</article>
<article>
<h3>Architectural Constraints</h3>
<ol class="#build">
<li>client-server</li>
<li>stateless</li>
<li>uniform interface</li>
<li class="">cacheable</li>
<li class="">layered system</li>
<li class="accent-color">code on demand</li>
</ol>
<div class='source'>Source: <a href="http://www.ics.uci.edu/~fielding/pubs/dissertation/rest_arch_style.htm#sec_5_1">http://www.ics.uci.edu/~fielding/pubs/dissertation/rest_arch_style.htm#sec_5_1</a></div>
</article>
<article class="">
<h3>Client-Server</h3>
<img class="centered" style="width:100%" src="assets/illu/cli_srv.svg">
</article>
<article class="">
<h3>Statelessness</h3>
<div class="build">
<h4 class="med-color">(Web) Applications without any state?</h4>
<h4 class="accent-color">Almost impossible…</h4>
<h4 class="mawi-color">Here: Stateless communication!</h4>
<ul>
<li>server manages resource states</li>
<li>client manages session states</li>
</ul>
</div>
</article>
<article class="fill">
<h3>Statelessness</h3>
<q style="font-size:120%; line-height:165%">[...]each request from client to server must contain <span class="mawi-color">all of the information necessary to understand the request</span>, and <span class="in-color">cannot take advantage of any stored context on the server</span>.</q>
<div class='author'><a href="http://www.ics.uci.edu/~fielding/pubs/dissertation/rest_arch_style.htm">Roy T. Fielding</a></div>
</article>
<article class="">
<h3>Statelessness: Example</h3>
<p>What's the URI of the 2nd result page of search query?</p>
<h4>Stateful Version</h4>
<p>
<code>http://foo.bar/query?sid=61AUOh6W1TA&page=next</code>
</p>
<div class="build" style="padding-top:20px">
<ul class="">
<li>server creates a session for each search</li>
<li>session contains search term and current page</li>
<li>"next" URI contains session ID and action (next)</li>
<li>the state of the search is hidden in the session state</li>
</ul>
</div>
</article>
<article class="">
<h3>Statelessness: Example</h3>
<p>What's the URI of the 2nd result page of search query?</p>
<h4>Stateless Version</h4>
<p>
<code>http://foo.bar/query?term=uni+ulm&start=10</code>
</p>
<div class="build" style="padding-top:20px">
<ul >
<li>URI contains all information of the search state</li>
<li>search term 'uni ulm', skip the first 10 results</li>
<li>client manages search state</li>
<li>server answers request without looking up a session</li>
</ul>
</div>
</article>
<article class="">
<h3>Cacheability</h3>
<ul>
<li>improve network efficiency & scalability</li>
<li>label cacheability of each response</li>
</ul>
</article>
<article class="">
<h3>Layered System</h3>
<ul>
<li>hierarchical layers of components</li>
<li>client, servers, <strong class="">intermediaries</strong></li>
<li>reverse proxies, proxy caches, load-balancers, etc.</li>
<li>integration of legacy systems</li>
</ul>
<img class="centered" style="width:100%" src="assets/illu/layered_system.svg" />
</article>
<article class="">
<h3>Uniform Interface: Sub-constraints</h3>
<ul>
<li>identification of resources</li>
<li>manipulation via representations</li>
<li>self-descriptive messages</li>
<li>hypermedia as the engine of application state</li>
</ul>
</article>
<article class="smaller">
<h3>Identification of Resources</h3>
<ul>
<li>resource-oriented architecture</li>
<li>resources are the nouns of the application</li>
<li>resources are fine-grained entities</li>
</ul>
<div class="build">
<h4>Examples</h4>
<ul>
<li><code>http://example.com/user/4711</code></li>
<li><code>http://example.com/customer/23/order/1/product/0735611319</code></li>
<li><code>http://example.com/search?term=foo</code></li>
<li><code>http://example.com/blog/the-post-title/comments#latest</code></li>
</ul>
</div>
</article>
<article class="">
<h3>Manipulation via Representations</h3>
<ul>
<li>changes of server-side resource states</li>
<li>based on changes of (altered) representations</li>
</ul>
</article>
<article class="">
<h3>Manipulation via Representations</h3>
<img class="centered" style="width:100%" src="assets/illu/manip_rep.svg" />
</article>
<article class="">
<h3>Self-descriptive Messages</h3>
<ul>
<li>messages contain representation of resources</li>
<li>meta-data/description of representation (header)</li>
<li>usage of (custom) MIME types</li>
<li>enough information to process without additional knowledge</li>
</ul>
</article>
<article class="">
<h3>Hypermedia as the Engine of Application State</h3>
<ul>
<li>state changes based on hypermedia</li>
<li>following hyperlinks</li>
<li>submitting forms</li>
<li>accessing resources</li>
</ul>
</article>
<article class="">
<h3>Hypermedia: Resource Representations</h3>
<ul>
<li>representations should support hypermedia</li>
<li>XHTML, Atom, etc.</li>
</ul>
<div class="build">
<p style="margin-top:30px;" class="box nawi-color">XML and JSON are also popular generic formats. Note however, that they don't have a standardized way of expressing links or forms.</p>
</div>
</article>
<article class="">
<h3>Hypermedia as the Engine of Application State</h3>
<img class="centered" style="width:100%" src="assets/illu/hypermedia.svg" />
</article>
<article class="">
<h3>Hypermedia as the Engine of Application State</h3>
<img class="centered" style="width:100%" src="assets/illu/hypermedia2.svg" />
</article>
<article class="">
<h3>REST Triangle</h3>
<img class="centered" style="width:80%" src="assets/illu/rest_triangle.svg">
</article>
</section>
<section>
<header>REST in Practice</header>
<article class="fill">
<h1>REST</h1>
<h3>in Practice</h3>
</article>
<article class="fill">
<h1>RESTful Web Services</h1>
<h3>REST + HTTP</h3>
</article>
<article class="">
<h3>RESTful Web Services</h3>
<ul>
<li>web services adhering to the REST style</li>
<li>HTTP + hypermedia formats</li>
<li>e.g. leightweight APIs for mobile/web clients</li>
</ul>
</article>
<article class="fill">
<q style="font-size:150%; line-height:175%">REST is so trendy, let's rebrand our old HTTP API and call it <em>RESTful</em> from now on!</q>
<div class='author'>Hipster CTO</div>
</article>
<article class="">
<h3>RESTful Web Services in Practice</h3>
<ul>
<li><strong class="nawi-color">REST</strong>: over-hyped term, much confusion</li>
<li>HTTP-based API vs. RESTful API</li>
<li>different types of REST "compliance"</li>
</ul>
<div class="build">
<h4>Common mistakes</h4>
<ul>
<li>URIs contain actions instead of resources</li>
<li>links are hard-coded</li>
<li>messages are not self-descriptive</li>
<li>ignoring <em>Hypermedia as the Engine of Application State</em></li>
</ul>
</div>
</article>
<article class="">
<h3>RESTful Web Services: Examples</h3>
<ul>
<li class="in-color">flickr 'REST' API</li>
<li class="nawi-color">CouchDB</li>
<li class="nawi-color">Twitter API</li>
<li class="mawi-color">Atom Publishing Protocol</li>
</ul>
<div class='source'>Source: <a href="http://nordsc.com/ext/classification_of_http_based_apis.html">nordsc.com/ext/classification_of_http_based_apis.html</a></div>
</article>
<article class="">
<h3>Advanced Topics and Challenges</h3>
<ul>
<li>API versioning</li>
<li>representation versioning</li>
<li>authentication and security in RESTful APIs</li>
<li>design of hypermedia-enabled representations</li>
</ul>
</article>
</section>
<section>
<header>Use Case: RESTful ToDo API</header>
<article class="fill">
<h1>Use Case</h1>
<h3>RESTful ToDo API</h3>
</article>
<article class='fill'>
<p>
<img src='assets/images/2606902785_c66f951584_b.jpg'>
</p>
<div class='source white'>Source: cc-by-nc 2.0 bryankennedy on <a href="http://www.flickr.com/photos/bryankennedy/2606902785/">flickr</a></div>
</article>
<article class="">
<h3>Use Case: ToDo API</h3>
<ul>
<li>(very) simple demo application</li>
<li>"get things done"</li>
<li>list of ToDo items</li>
<li>priorities and deadlines for entries</li>
</ul>
</article>
<article class="">
<h3>Domain Resources</h3>
<h4>Resource Types?</h4>
<ul class="build">
<li><code>"homepage"</code> (abstract resource)</li>
<li><code>todo</code> item (primary resource)</li>
<li><code>list of todos</code> (collection resource)</li>
<li class="accent-color">external documentation resource (for humans)</li>
</ul>
</article>
<article class="">
<h3>Domain Resources: URIs</h3>
<dl>
<dt>Base URI<dt>
<dd><code>http://example.com/todo/</code><dd>
<dt>List URI<dt>
<dd><code>http://example.com/todo/items</code><dd>
<dt>Item URI<dt>
<dd><code>http://example.com/todo/items/{id}</code><dd>
</dl>
<div class="build">
<p style="margin-top:30px;" class="box bg-accent-color">We need URIs for the server implementation. Clients do not and should not need to know URIs <em>a priori</em> (except for the base URI of the service).</p>
</div>