Web-Development 2010: Client or Server? Lightning Talk @ Python Barcamp 2010 Cologne, Germany

1. Web-Development 2010:
Server-side or Client-side?
Lightning Talk @ PyCologne 2010
Köln, 17.April 2010
#python #javascript #pybar
Thomas Koch (@tomy_koch)

2. (a short) Web Development History
• 199x: Common Gateway Interface
import cgi
form = cgi.FieldStorage()
print “content-type: text/html”
print “<H1>Hello %s</H1>“ % form["name"].value
• 200x: Web Tools & Frameworks (in Python)
– Libraries (e.g. Templates & Form handling!)
• Cheetah, Kid, Genshi, Bottle, … Server-Side Coding
s. http://wiki.python.de/Template-Engines
– Frameworks: Django, TurboGears, Zope, etc.
• s. http://wiki.python.org/moin/WebFrameworks ???
• 2005+ Ajax Technology (XmlHttpRequest+JavaScript)
– Lots of JavaScript Tools,Libs,Frameworks coming up …
• Prototype, Scriptacolous, MooTools etc.
• YUI, jQuery, Dojo, ExtJS …
Client-Side Coding
• 2010 ???

3. Server-side or Client-side?
• Wrong question! Must do both (somehow)…
How to efficiently develop Server- and Client-side?
Assumption: We‘re coding in Python on the server ,-)
(using at least some framework …)
Option1: Become JavaScript-Expert (no way!)
Option2: Use JavaScript-Framework (even better)
Option3: seek for holy grail…

4. Some Attempts …
• GWT: Google Web Toolkit
– Army of Java Developers don‘t wanna code JS
– Provide Java-based framwork and generate JS
• Python: PyJamas http://pyjs.org/
– Pyjamas is a port of Google Web Toolkit to Python
You can write web applications in python
– pyjamas involves the translation
of the application and libraries
(including UI widgets and DOM
classes) to Javascript.
– version: Pyjamas 0.6 / 08-2009

5. Dajax: Django+Ajax
• a powerfull tool to easily and super-fastly develop asynchronous
presentation logic in web applications using python …
… and almost no lines of JS source code.
• supports up to four of the most popular JS frameworks:
Prototype, jQuery, Dojo and mootols
Dajax maps client-side JS call
to server-side python method!
• Version: 0.8.4 – 03-22010
• autor: @jorgebastida
• Web: http://dajaxproject.com/

6. Dajax: Example
Python Code
from dajax.core import Dajax
def multiply(request, a, b):
dajax = Dajax()
result = int(a) * int(b)
dajax.assign('#result','value',str(result))
return dajax.json()
JavaScript Code
<script src="/dajaxice/dajaxice.core.js" type="text/javascript" />
function calculate() {
Dajaxice.examples.multiply('Dajax.process',{'a':$('a').value,'b':$('b').value})

7. Dojango = Dojo + Django
• What?
– Dojango is a reusable django application that helps
you to use the client-sideframework dojo within your
django project
– … makes the development of rich internet applications
in combination with dojo more comfortable
• Version: 0.4.6 / 11-2009
• Autor: @tklipstein
• Web: http://code.google.com/p/dojango/

8. About Dojo
• Dojo = Ajax Development Framework
– open-source JavaScript toolkit for frontend development
– allows to shorten the timespan between idea and implementation
– cut-down development costs, achieve great results
• Features
– Supports development of highly interactive web applications
– Various basic widgets like Trees, Menus, ListViews, Popups etc.
– Business-ready components like Grids and Charts
– Lots of add-ons for different purposes like Image Lightbox, animations etc.
• Community
– Large user community
– Used / Supported by Key Players (SUN, IBM etc.)
• Version: 1.4
• Website: http://dojotoolkit.org/

9. Dojango Features
• Form-Integration : django.forms  dojango.forms
– maps django.forms.fields to dojo enhanced widgets
(i.e. dojango.forms.fields extends django formfields)
• flexible dojo release configuration
– aol, google cdn, dojo release 1.0/1.1/1.2/1.3 …
• Django ModelStore
– using dojo.data.* with dojango.data.modelstore
• Dojango Datagrid
– Integrate dojo data grid in django
• AppEngine support:
– get dojango up on Google AppEngine.

10. Your Experience?
• Best Practices?
– Server-Side Framework:
self-written, django, gears … ?
– Client-Side Framework:
Simple prototype.js or Dojo, ExtJS,… ?
• Combination of
frontend & backend
 what is the perfect couple?
(especially for web-devel in python)