Friday, November 19, 2010

Membuat Halaman Web Berbasis Python di AppEngine

Bila Anda sudah membaca tulisan saya sebelumnya tentang pemrograman Python dan Google App Engine, sekarang saya mencoba untuk memberikan 'sedikit' tutorial mengenai dasar pembuatan halaman web dinamis sederhana menggunakan Python di App Engine.

Bila Anda terbiasa menggunakan PHP, ASP, JSP atau bahasa pemrograman web lainnya, mungkin Anda terbiasa membuat halaman web dinamis dengan penyematkan program dalam tag-tag HTML (embedded HTML) yang kode programnya biasanya diapit oleh tag khusus seperti '%', '?' atau lainnya maka dalam pemrograman web Python pada umumnya Anda tidak akan menemukan hal tersebut. Meskipun sebenarnya pemograman Python juga mendukung embedding dalam tag HTML seperti fitur yang ada pada modul yang dibungkus satu paket dalam modul 'mod_python', yaitu modul psp yang biasa disebut Python Server Page.

Metode pembuatan halaman web yang digunakan Python pada umumnya saat ini adalah dengan menggunakan metode templating, seperti yang akan saya urai di tulisan ini.


Untuk templating di App Engine, kita dapat mengunakan dua metode yaitu dengan menggunakan modul templating Django dan dengan menggunakan cara manual dengan menggunakan modul RE (regex) yang merupakan modul built in Python.

Berikut contoh kode sederhana untuk membuat halaman HTML tanpa menggunakan templating :

class MainHandler(webapp.RequestHandler):
    def get(self):
        self.response.headers['Content-Type'] = 'text/html'
        self.response.out.write(
            """<h3>Hello world!</h3>
            Halaman ini tidak menggunakan templating, contoh templating klik link dibawah :
            <p><a href="./django">Template menggunakan modul Django</a>
            <br><a href="./manual">Template secara manual</a>""")


Kode diatas akan menampilkan dengan 'mencetak' format HTML yang kita buat langsung ke halaman web dengan baris statement

self.response.headers['Content-Type'] = 'text/html' dan self.response.out.write([tag html]), di mana kita memasukan semua tag HTML sekaligus dan menampilkannya ke layar.

Berikut contoh tampilannya :


Dengan menggunakan templating, kita bisa membentuk format halaman yang kita buat dengan memasukan tiap tag dan bagiannya dengan memecahnya dalam variabel dan membentuknya di dalam halaman template HTML yang sudah kita persiapkan hingga memudahkan 'perawatan' dan perbaikan halaman web yang kita buat.

1. Templating menggunakan modul Django

Berikut contoh template halaman web yang akan kita buat :

<html>
<head>
<title>{{ title_template }}</title>
</head>

<body>
<p>Tanggal Hari ini : {{ date_of_today }}</p>
<p>{{ the_content }}</p>
</body>
</html>


Coba anda perhatikan teks yang diapit karakter {}, teks tersebut merupakan variabel yang akan kita masukan sedangkan karakter '{}' merupakan tag yang digunakan oleh Django untuk mengenali variabel yang akan diproses untuk menampilkan tag html atau isi web yang kita buat.

Perhatikan kode di bawah ini :

class DjangoHandler(webapp.RequestHandler):
    def get(self):
        tgl = datetime.utcnow()
        the_template = {
            'date_of_today' : tgl,
            'title_template' : "Django Template",
            'the_content' : """Ini template dengan menggunakan Django template, <a href="./">kembali</a>""",
            }
        path = os.path.join(os.path.dirname(__file__), 'django_template.html')
        self.response.out.write(template.render(path, the_template))


Dari contoh diatas, teks atau isi halaman HTML kita pilah menjadi 3 bagian yang kita masukan kedalam tiga variabel, yaitu 'date_of_today' untuk menampilkan tanggal, 'title_template' untuk menampilkan judul halaman web dan 'the_content' untuk menampilkan konten utama.

Ketiga variabel beserta value-nya kita masukan ke dalam variabel 'the_template' yang bertipe data 'dictionary' dan dimasukan ke dalam template (dalam contoh disimpan dengan nama file django_template.html), dengan menggunakan baris statement berikut :

path = os.path.join(os.path.dirname(__file__), 'django_template.html')
self.response.out.write(template.render(path, the_template))

Berikut hasil tampilannya setelah di ditampilkan browser :


Sekarang kita coba membuat halaman web dengan templating menggunakan modul RE

2. Templating dengan menggunakan modul RE (regex)

Berikut contoh template halaman web yang akan kita buat :

<html>
<head>
<title>title_template</title>
</head>

<body>
<p>Tanggal Hari ini : date_of_today</p>
<p>the_content</p>
</body>


</html>


Sama seperti contoh template sebelumnya (dalam contoh ini disimpan dengan nama file manual_template.html), yang membedakan variable yang digunakan untuk menampilkan tag html atau isi web yang kita buat tidak diapit karakter khusus seperti contoh sebelumnya.

Berikut kode yang akan digunakan untuk menyematkan konten HTML di template yang sudah kita siapkan :

class ManualHandler(webapp.RequestHandler):
    def get(self):
        Template = open('manual_template.html', "r")
        DataTemplate = Template.read()
        Template.close()
        tgl = datetime.utcnow()
        text = {
                  'date_of_today':str(tgl),
                  'title_template':"Manual Template",
                  'the_content':"""Ini template dengan menggunakan manual template, <a href="./">kembali</a>"""}
        for k, v in text.iteritems():
            forContent = re.subn(k, v, DataTemplate)
            DataTemplate = forContent[0]           
        self.response.headers['Content-Type'] = 'text/html'
        self.response.out.write(forContent[0])

Sama seperti dengan contoh templating sebelumnya, ketiga variabel beserta nilainya kita masukan ke dalam variabel 'text' yang bertipe data 'dictionary' tapi disini diproses dengan perintah perulangan dengan menggunakan modul RE dibawah ini :

for k, v in text.iteritems():
    forContent = re.subn(k, v, DataTemplate)
    DataTemplate = forContent[0]   

self.response.headers['Content-Type'] = 'text/html'
self.response.out.write(forContent[0])

Berikut hasil tampilannya setelah ditampilkan di browser :


Mudah bukan ? Dari dua metode templating di atas, bila kita menggunakan modul Django maka file template selain dapat disematkan variabel kita juga dapat menyematkan kode Python. Sedangkan dengan modul RE semua proses dilakukan di file utama kita.

Untuk mengunduh contoh program lengkap yang dibahas disini silahkan klik di sini.

No comments: