SlideShare uma empresa Scribd logo
1 de 30
Baixar para ler offline
1. Hello World Django 
Django merupakan fullstack web framework yang dirancang dan dibangun oleh Adrian Holovaty 
dan Jacob Kaplan Moss. Awal mulanya Django merupakan web framework internal yang dimiliki 
oleh kantor dimana Adrian Holovaty bekerja sebagai jurnalis. Namun seiring perkembangannya, 
Django dirilis menjadi open source. 
Anda dapat membangun aplikasi web dengan menggunakan konsep MVC. Di Django hal tersebut 
dinamakan dengan MTV (Model, Template, View), dimana model adalah kode yang berisi objek 
yang menjadi representasi dari sebuah tabel di Database, template adalah kode yang berisi HTML, 
CSS, Javascript dan presentasi lainnya yang ditujukan kepada user, view adalah kode yang berisi 
bisnis proses dari aplikasi, menerima request dari user, memberikan response kepada user, dan 
berinteraksi dengan database yang dipilih. 
Dalam pelatihan kali ini kita akan menggunakan Django 1.6 . Anda dapat mengunduhnya di 
http://djangoproject.com/ dan carilah versi 1.6 . Installer akan tersedia dalam bentuk zipped (.zio) 
atau gunzipped (.tar.gz). Setelah Anda selesai mengunduhnya lakukanlah beberapa langkah berikut 
untuk memulai instalasi (Pastikan Anda sudah menginstall Python versi 2.6.x ke atas): 
 ekstrak installer tersebut. Jika Anda menggunakan Linux ekstrak folder tersebut dengan 
perintah Extract melalui file manager yang Anda gunakan atau melalui terminal gunakan 
perintah tar -xzvf django-1.6.tgz. Jika Anda menggunakan Windows atau OSX silahkan 
gunakan aplikasi seperti 7zip untuk membuka bundelan tersebut. 
 masuk ke dalam folder hasil ekstrak sebelumnya, cobalah Anda lihat apakah di dalamnya 
terdapat file setup.py 
 Jika terdapat file tersebut maka lakukan proses instalasi Django dengan menggunakan 
perintah: python setup.py install di terminal 
 Waktu yang dibutuhkan untuk instalasi lebih dari 1 menit, jadi Anda dapat mengunduh 
dokumentasinya di website yang sama 
 Jika proses instalasi selesai, Anda dapat memeriksa apakah Django sudah terinstal atau 
belum dengan menggunakan perintah django-admin.py version di terminal 
 Jika muncul no versi dari Django yang Anda baru saja install di komputer Anda, maka 
proses instalasi Django telah berhasil 
Proses instalasi pun sudah selesai dan Django siap digunakan. Sekarang kita akan mencoba 
membuat proyek Django baru. Silahkan Anda berpindah ke folder yang diinginkan untuk 
menyimpan proyek Django, misal /home/username_anda/Document . Setelah memilih folder 
buatlah proyek Django baru dengan menggunakan perintah django-admin.py startproject 
demo_possupi di terminal dan dalam beberapa saat proyek Django baru akan tercipta. 
Silahkan masuk ke dalam folder proyek demo_possupi dan Anda akan melihat sebuah folder yang 
bernama sama yaitu demo_possupi dan file manage.py. Jika ada kedua benda tersebut sekarang 
kita akan mencoba menyalakan web server untuk development yang dimiliki Django dengan 
perintah python manage.py runserver di terminal. Secara default Django akan menyalakan web 
server yang dimilikinya di IP Address 127.0.0.1 atau localhost dan port 8000. Jika server sudah 
menyala dan tidak muncul error akses proyek demo_possupi di web browser dengan URL 
http://localhost:8000 dan Anda akan melihat tampilan seperti pada gambar berikut: 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 1)
Tampilan saat web server Django diakses melalui web browser 
Tampilan saat web server Django dinyalakan 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 2)
2. Menentukan Spesifikasi Aplikasi Event 
Spesifikasi yang dibutuhkan sederhana saja. Kita membutuhkan tabel event dan visitor untuk 
menampung aplikasi yang akan kita bangun. Kita akan membuat sebuah halaman utama yang 
menampilkan semua event kemudian ada tombol detail event. Kita bisa menekan tombol detail 
event tersebut dan melihat detail event seperti informasi event dan siapa saja yang mengunjungi 
event tersebut. Tentunya pengunjung boleh mendaftarkan diri untuk mengikuti event tertentu. 
Aplikasi juga memiliki halaman admin yang siap mengelola kedua tabel tersebut. Kita 
membutuhkan halaman admin untuk mengelola data event dan data visitor. Kita membutuhkan 
DDL untuk tabel event seperti berikut ini: 
CREATE TABLE "dp_event_event" ( 
"id" integer NOT NULL PRIMARY KEY, 
"title" varchar(50) NOT NULL, 
"organizer" varchar(30) NOT NULL, 
"venue" text NOT NULL, 
"about" text NOT NULL, 
"finished" bool NOT NULL, 
"date_begin" datetime NOT NULL, 
"date_end" datetime NOT NULL, 
"date_created" datetime NOT NULL 
) 
dan DDL untuk tabel visitor seperti berikut ini: 
CREATE TABLE "dp_event_visitor" ( 
"id" integer NOT NULL PRIMARY KEY, 
"name" varchar(50) NOT NULL, 
"phone" varchar(15) NOT NULL, 
"email" varchar(75) NOT NULL, 
"twitter" varchar(200) NOT NULL, 
"target_event_id" integer NOT NULL REFERENCES "dp_event_event" ("id"), 
"date_join" datetime NOT NULL 
) 
Tapi DDL diatas jangan disalin. Karena proses pembuatan tabel akan berbeda dari cara yang biasa. 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 3)
3. Menggunakan Database di Django 
Dengan Django Anda dapat menggunakan berbagai database seperti MySQL, MongoDB, SQLite3, 
PostgreSQL, Oracle, dan berbagai database lainnya. Anda dapat menentukan database yang akan 
digunakan, dan Django akan menangani database yang Anda gunakan. 
Untuk memulai penggunaan database di Django, Anda dapat melakukan beberapa konfigurasi di 
file setting.py yang terdapat di folder demo_possupi/demo_possupi kemudian tentukan database 
yang akan digunakan. Misal dalam percobaan kita kali ini, akan digunakan database SQLite3 
dengan nama demo_possupi.sqlite3. Perhatikan konfigurasinya di bawah ini (penting: tanda garis 
strip menandakan bahwa ada kode sebelum atau sesudah dari potongan kode yang ditampilkan): 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
# Database 
# https://docs.djangoproject.com/en/1.6/ref/settings/#databases 
DATABASES = { 
'default': { 
'ENGINE': 'django.db.backends.sqlite3', 
'NAME': os.path.join(BASE_DIR, 'demo_possupi.sqlite3'), 
} 
} 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
Pada bagian konfigurasi database, biasanya terdapat dua hal saja yang diperlukan. Yaitu database 
engine dan nama database yang akan digunakan. Pada konfigurasi diatas kita hanya menggunakan 
dua hal tersebut karena menggunakan SQLite3. Jika menggunakan database seperti MySQL atau 
PostgreSQL, maka kita membutuhkan konfigurasi tambahan seperti letak port dari server database, 
URL, akun untuk mengakses database tersebut, dan lainnya. 
Setelah selesai melakukan konfigurasi database, sekarang kita akan melakukan proses 
synchronization antara database dengan aplikasi Django kita dengan menggunakan perintah python 
manage.py syncdb . Perhatikakn contohnya berikut ini: 
root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# python manage.py syncdb 
Creating tables ... 
Creating table django_admin_log 
Creating table auth_permission 
Creating table auth_group_permissions 
Creating table auth_group 
Creating table auth_user_groups 
Creating table auth_user_user_permissions 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 4)
Creating table auth_user 
Creating table django_content_type 
Creating table django_session 
You just installed Django's auth system, which means you don't have any superusers defined. 
Would you like to create one now? (yes/no): yes 
Username (leave blank to use 'root'): root 
Email address: ridwanbejo@gmail.com 
Password: 
Password (again): 
Superuser created successfully. 
Installing custom SQL ... 
Installing indexes ... 
Installed 0 object(s) from 0 fixture(s) 
root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# 
Beberapa hal yang dilakukan ketika kita menggunakan perintah python manage.py syncdb antara 
lain: 
 Django membuat table default yang berisi session, group, group_permission, user, 
admin_log, dan tabel lainnya seperti pada snapshot diatas. Jika kita belum membuat satu 
model pun di Django, maka tabel default akan dibentuk lebih dahulu 
 Jika Anda sudah mendefinisikan model di sebuah aplikasi di Django, maka Django akan 
membuatkan tabelnya jika belum terdapat di database 
 Tabel yang telah dibuat tidak akan dibuat ulang. Jika kita ingin melakukan perubahan pada 
model. Anda dapat melakukanya dengan cara melakukan drop table pada tabel yang 
berhubungan dengan sebuah model atau menggunakan migration tools seperti South 
 Anda harus memberikan nama pada user root dari aplikasi Django Anda 
 Anda dapat memberikan password untuk masuk ke halaman aplikasi Django 
Sekarang kita akan mencoba halaman admin yang sudah disediakan oleh Django. Nyalakan terlebih 
dahulu web server Django dengan perintah python manage.py runserver kemudian cobalah Anda 
akses URL http://localhost:8000/admin di web browser maka akan muncul tampilan seperti berikut: 
Form login halaman admin Django 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 5)
Kemudian masukkan account Django yang telah Anda buat sebelumnya, dan Anda akan melihat 
halaman admin Django seperti pada gambar berikut: 
Halaman utama dari halaman admin Django 
Halaman kelola user dari halaman admin Django 
Halaman kelola grup dari halaman admin 
Django 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 6)
4. Membangun Model untuk Aplikasi Event 
Model merupakan sebuah file yang terdapat di setiap aplikasi Django. Di dalam Django dapat 
memiliki banyak aplikasi sesuai dengan kebutuhan sistem. Setiap aplikasi Django biasanya terdiri 
dari: 
 model.py, berisi class yang merupakan representasi dari setiap tabel. Tentunya sebuah class 
dapat memiliki fungsionalitasnya yang unik dari class lainnya 
 views.py, berisi kumpulan fungsi yang akan diakses oleh user dengan perantara URL yang 
didefinisikan di urls.py yang terdapat di aplikasi atau di urls.py yang terdapat di folder 
demo_possupi 
 urls.py, berisi kumpulan URL yang didefinisikan untuk mewujudkan sistem dan 
memberikan reaksi terhadap user. Setiap URL akan mengarah kepada suatu fungsi di 
views.py 
 admin.py, berisi konfigurasi aplikasi yang ditampilkan di halaman admin Django 
 tests.py, berisi testing yang digunakan untuk menguji aplikasi Django 
 __init__.py, merupakan sebuah file yang menjadi penanda bawa folder tersebut merupakan 
module Python 
Untuk membuat sebuah aplikasi di Django, Anda dapat melakukannya dengan menggunakan 
perintah python manage.py startapp <nama_aplikasi> misalnya seperti pada kasus berikut ini 
dimana kita membuat sebuah aplikasi yang bernama dp_event: 
root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# python manage.py startapp 
dp_event 
root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# ls 
db.sqlite3 demo_possupi demo_possupi.sqlite3 dp_event manage.py 
root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# 
Sekarang sebuah folder yang bernama dp_event sudah tercipta dengan menggunakan perintah 
diatas. Folder tersebut berisi file admin.py, __init__.py, tests.py, models.py, dan views.py. 
Kemudian daftarkan aplikasi yang baru saja kita ciptakan di setting.py dengan menambahkan 
nama aplikasi kita ke konfigurasi INSTALLED_APPS. 
Di bab ini kita akan mencoba membuat tabel dengan mengandalkan model yang dimiliki Django. 
Jangan lupa untuk mengubah hak akses dari folder dp_event jika Anda menggunakan Linux. 
Berikut adalah model yang akan kita gunakan untuk aplikasi event yang akan digunakan. Salin kode 
berikut ke dalam file models.py: 
from django.db import models 
# Create your models here. 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 7)
class Event(models.Model): 
title = models.CharField(max_length=50) 
organizer = models.CharField(max_length=30) 
venue = models.TextField() 
about = models.TextField(blank=True) 
finished = models.BooleanField() 
date_begin = models.DateTimeField() 
date_end = models.DateTimeField() 
date_created = models.DateTimeField(auto_now=True) 
def __unicode__(self): 
return self.title 
class Meta: 
ordering = ['date_begin'] 
class Visitor(models.Model): 
name = models.CharField(max_length=50) 
phone = models.CharField(max_length=15) 
email = models.EmailField() 
twitter = models.URLField(blank=True) 
target_event = models.ForeignKey(Event) 
date_join = models.DateTimeField(auto_now=True) 
def __unicode__(self): 
return self.name 
class Meta: 
ordering = ['date_join'] 
Setelah selesai membuat kode model diatas, saatnya melakukan synchronization database Django 
kita dengan menggunakan perintah python manage.py syncdb. Berikut adalah snapshot saat tabel 
dari model diatas dibuat: 
root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# python manage.py syncdb 
Creating tables ... 
Creating table dp_event_event 
Creating table dp_event_visitor 
Installing custom SQL ... 
Installing indexes ... 
Installed 0 object(s) from 0 fixture(s) 
root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 8)
Anda dapat melihat kedua tabel yang telah dibuat dengan menggunakan SQLiteman. SQLiteman 
merupakan sebuah aplikasi desktop yang digunakan untuk membantu pengelolaan database 
SQLite3. Berikut ini adalah tampilan dari database untuk aplikasi event: 
Susunan tabel event di SQLiteman 
Susunan tabel visitor di SQLiteman 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 9)
5. Membangun Halaman Administrator untuk Aplikasi Event 
Halaman admin biasanya dibuat dari awal ketika kita membangun sebuah aplikasi web. Dengan 
menggunakan Django, Anda dapat menggunakan halaman admin yang di-generate dari model yang 
telah didefinisikan sebelumnya. Tampilannya yang sederhana dapat Anda manfaatkan semaksimal 
mungkin untuk menunjang aplikasi web yang Anda gunakan. 
Sebelumnya kita hanya melakukan login dan melihat halaman yang menyajikan tabel groups dan 
users. Sekarang kita akan mencoba menambahkan model yang telah kita definisikan ke halaman 
admin. Suntinglah file admin.py di folder dp_event, dan salinlah kode berikut: 
from django.contrib import admin 
from dp_event.models import * 
# Register your models here. 
admin.site.register(Event) 
admin.site.register(Visitor) 
Setelah Anda menyalin kode diatas, silahkan buka halaman admin di http://localhost:8000/admin , 
dan di halaman tersebut Anda akan melihat dua menu yang merupakan nama model yang telah kita 
buat sebelumnya. Berikut ini adalah halaman admin setelah ditambahkan dua model tersebut: 
Halaman admin Django setelah ditambahkan dua model baru 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 10)
Menambahkan event baru di halaman admin django 
Event baru sudah ditambahkan 
Riwayat penggantian data di tabel 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 11)
Melakukan pengubahan data event di halaman admin Django 
Melihat data event yang baru ditambahkan di SQLiteman 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 12)
6. Membangun View dan Template untuk Aplikasi Event 
Diasumsikan bahwa halaman admin sudah selesai dibangun, sekarang saatnya kita membuat 
halaman untuk publik. Untuk percobaan di pelatihan ini, kita akan mencoba menampilkan daftar 
event yang belum berakhir, dan menerima pengunjung yang ingin datang ke event tersebut. View 
adalah sebuah file yang berisi function yang akan menangani request dan response terhadap user. 
Template merupakan file yang berisi HTML + CSS + Javascript yang akan ditampilkan kepada user 
melalui web browser. 
Sebelum membangun template mari kita atur terlebih dahulu tempat penyimpanan template. 
Buatlah folder yang bernama templates di dalam folder proyek demo_possupi. Kemudian 
tambahkan pengaturan yang ditebalkan berikut di setting.py: 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
# SECURITY WARNING: don't run with debug turned on in production! 
DEBUG = True 
TEMPLATE_DEBUG = True 
TEMPLATE_DIRS = ( 
BASE_DIR+'/templates', 
) 
ALLOWED_HOSTS = [] 
# Application definition 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
Kita juga akan menggunakan CSS dan Javascript untuk mempercantik halaman web yang akan 
dibangun. Kita akan menggunakan Twitter Bootstrap unuk pelatihan kali ini. Buatlah folder yang 
bernama static di dalam folder proyek demo_possupi. Dan simpan Twitter Bootstrap ke dalam 
folder static . Kemudian tambahkan pengaturan yang ditebalkan berikut di setting.py: 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
USE_TZ = True 
# Static files (CSS, JavaScript, Images) 
# https://docs.djangoproject.com/en/1.6/howto/static-files/ 
STATIC_URL = '/static/' 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 13)
STATICFILES_DIRS = ( 
os.path.join(BASE_DIR, "static"), 
) 
Selesai mengatur folder untuk template dan file static di Django, mari kita coba untuk membuat 
view pertama di Django. Suntinglah file urls.py yang berada di folder demo_possupi dengan 
menambahkan baris kode yang ditebalkan seperti pada potongan kode berikut ini: 
from django.conf.urls import patterns, include, url 
from django.contrib import admin 
admin.autodiscover() 
urlpatterns = patterns('', 
url(r'^admin/', include(admin.site.urls)), 
url(r'^$', 'dp_event.views.index'), 
) 
Bagian yang ditebalkan memiliki arti kurang lebih jika user melakukan request terhadap URL 
http://localhost:8000 maka Django akan mengeksekusi view yang bernama index. Tanda $ 
menyatakan bahwa di belakan URL yang didefinisikan tidak boleh ada karakter apapun. Karena 
view index belum didefinisikan. Mari kita membuat view di file views.py di folder dp_event. Lalu 
salin potongan kode berikut: 
from django.shortcuts import render_to_response, redirect 
from django.http import HttpResponse 
from django.core.context_processors import csrf 
from dp_event.models import * 
# Create your views here. 
def index(request): 
return HttpResponse("Selamat datang di pelatihan django ....") 
Di dalam file views.py, Anda dapat meng-import berbagai modul Django, Python, ataupun 
teknologi yang dibuat dengan Python lainnya untuk digunakan di dalam view kita. Biasanya yang 
dibutuhkan adalah modul untuk menampilkan template seperti 
django.shortcuts.render_to_response, melakukan redirect dengan django.shortcuts.redirect, dan 
modul untuk mencegah cross site request forgery atau csrf dengan django.core.context_processors 
import csrf. Dan tentu saja kita membutuhkan model yang telah kita bangun, untuk digunakan jika 
ingin menampilkan data yang diambil dari tiap model tersebut. 
Pada potongan kode diatas, kita membuat sebuah view yang bernama index. Sebuah view hanyalah 
fungsi biasa, hanya saja untuk dianggap sebagai view harus dilewatkan satu paramerter yang 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 14)
digunakan untuk menangani request dari user. Jika view diatas dipanggil maka akan ditampilkan 
sebuah response seperti berikut: 
view pertama di Django 
Untuk membuat view di Django diperlukan beberapa tahap. Agar lebih menarik, mari kita coba 
tampilkan data event yang sudah ada di dalam database ke halaman utama. Tentu saja event yang 
ditampilkan adalah event yang belum berakhir. Berikut adalah perubahan isi file views.py yang 
akan digunakan untuk menampilkan daftar event yang belum berakhir: 
from django.shortcuts import render_to_response, redirect 
from django.http import HttpResponse 
from django.core.context_processors import csrf 
from dp_event.models import * 
import datetime 
# Create your views here. 
def index(request): 
list_event = Event.objects.filter(date_end__gte=datetime.datetime.now()) 
return render_to_response('list_event.html', {'list_event':list_event}) 
Pada kode diatas kita memanggil modul datetime yang digunakan untuk mendapatkan tanggal hari 
ini, dan manipulasi tanggal. Di dalam view index, kita mencoba untuk mengambil daftar semua 
event yang belum berakhir. Setelah semua event didapatkan, maka view index akan melewatkan 
daftar event tersebut ke dalam template list_event.html dan menampilkannya di web browser. 
Berhubung kita belum membuat template list_event.html , kita coba akses view tersebut dan 
lihatlah apa yang terjadi: 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 15)
Contoh tampilan halaman error Django jika template yang dibutuhkan belum tersedia 
Setelah melihat contoh error diatas, mari kita buat template untuk menangani halaman utama. 
Buatlah sebuah file yang bernama list_event.html di folder templates. Kemudian salin kode 
berikut ini: 
<html> 
<head> 
<title>Daftar Event</title> 
{% load staticfiles %} 
<script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script> 
<link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}" /> 
</head> 
<body> 
<div class="col-md-12"> 
<h1>Daftar Event yang Bisa Anda Kunjungi !</h1> 
<hr /> 
{% for event in list_event %} 
<div class="col-md-4 well"> 
<strong>{{ event.title | upper }}</strong> 
<hr/> 
Diselenggarakan oleh {{ event.organizer }} <br/> 
dari {{ event.date_begin }} hingga {{ event.date_end }} <br/><br/> 
<a href="/event/{{event.id}}" class="btn btn-default">Lihat Detail</a> 
</div> 
{% endfor %} 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 16)
</div> 
</body> 
</html> 
Berikut ini adalah beberapa tag dari template Django yang perlu diperhatikan dari contoh diatas: 
 {% load staticfiles %} 
 {% static 'bootstrap/js/bootstrap.min.js' %} 
 {% for event in list_event %} 
 {{ event.title | upper }} 
 {{ event.organizer }} 
 {% endfor %} 
Setelah memahami tag di template Django, mari kita lihat hasilnya di web browser: 
Menampilkan template yang berisi daftar event yang bisa diikuti oleh user 
Dan yang terakhir di bab ini adalah kita akan mencoba membuat halaman detail dari setiap event. 
Kita belum bisa melihat dimana tempat event, detail event, dan siapa saja yang menghadiri event 
tersebut. Mari kita awali dengan mendefinisikan URL di file urls.py di folder demo_possupi. 
Salinlah bagian yang ditebalkan dan tambahkan ke urls.py: 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 17)
admin.autodiscover() 
urlpatterns = patterns('', 
url(r'^admin/', include(admin.site.urls)), 
url(r'^$', 'dp_event.views.index'), 
url(r'^event/(d+)', 'dp_event.views.detail_event'), 
) 
Di URL yang terbaru kita dapat mengakses URL utama dengan ditambahkan segmen event dan 
menambahkan parameter id dari event tersebut. Kurang lebih URL yang akan diakses seperti 
http://localhost:8000/event/199123 dimana 199123 adalah id dari sebuah event yang kita klik di 
halaman utama. Untuk menghasilkan respon yang memperlihatkan detail event, URL tersebut akan 
ditangani oleh view detail_event. Tambahkan kode berikut di views.py yang berada di folder 
dp_event: 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
def detail_event(request, id_event): 
event = Event.objects.get(id=int(id_event)) 
return render_to_response('detail_event.html', {'event':event}) 
View diatas menerima dua parameter, yaitu request dan id_event . Parameter id_event didapatkan 
dari angka yang dilewatkan setelah segmen event, misalnya 199123. Kemudian id_event akan 
digunakan untuk mencari event yang memiliki id yang diinginkan. Jika ditemukan, event yang 
didapat akan ditampilkan di template detail_event.html menggunakan render_to_response. 
Berikut adalah kode dari template detail_event.html: 
<html> 
<head> 
<title>Daftar Event</title> 
{% load staticfiles %} 
<script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script> 
<link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}" /> 
</head> 
<body> 
<div class="col-md-12"> 
<h1>{{ event.title | upper }}</h1> 
<hr /> 
<div class="well"> 
Diselenggarakan oleh {{ event.organizer }} <br/> 
dari {{ event.date_begin }} hingga {{ event.date_end }} <br/><br/> 
venue: {{ event.venue }} <br/> 
info lain: {{ event.about }} 
</div> 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 18)
</div> 
</body> 
</html> 
Pada template diatas kita menampilkan tempat event diselenggarakan dan info lainnya dari event 
yang akan diselenggarakan. Di bab berikutnya, kita akan mencoba menampilkan siapa saja yang 
akan datang ke event tersebut. Berikut ini adalah tampilan detail dari sebuah event: 
Tampilan detail event 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 19)
7. Menyusun Form Ikut event untuk User 
Satu hal yang belum kita dapatkan di bagian front-end dari aplikasi event ini adalah belum adanya 
interaksi dari user yang berkunjung untuk memberikan data mereka kepada aplikasi. Kita 
memerlukan sebuah form yang mencatat setiap user yang ingin ikut ke event tertentu. Kemudian 
setelah mengisi form ikut event tertentu, maka di detail event yang akan diikuti, munculah daftar 
pengunjung dari event tersebut. 
Kita membutuhkan halaman khusus yang menyediakan form untuk diisi user. Mari kita awali 
dengan mendefinisikan URL untuk menampilkan form mengikuti event dan URL untuk memproses 
data yang dikirimkan dari form tersebut. Salinlah bagian yang ditebalkan ke file urls.py di folder 
demo_possupi: 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
admin.autodiscover() 
urlpatterns = patterns('', 
url(r'^admin/', include(admin.site.urls)), 
url(r'^$', 'dp_event.views.index'), 
url(r'^event/(d+)', 'dp_event.views.detail_event'), 
url(r'^event/join/(d+)', 'dp_event.views.join_event'), 
url(r'^event/join/process$', 'dp_event.views.process_join_event'), 
) 
URL yang ditebalkan pertama menangani penampilan form mengikuti event dengan id tertentu. 
URL tersebut ditangani oleh view join_event(). Sedangkan URL yang ditebalkan kedua menangani 
proses pencatatan pengunjung yang ingin mengikuti event tertentu. URL tersebut ditangani oleh 
view process_join_event(). 
URL untuk menangani pengunjung yang ingin mengikuti event telah didefinisikan. Sekarang kita 
tambahkan dua tombol baru di detail event. Tombol pertama untuk kembali ke halaman utama, dan 
tombol kedua untuk melihat form mengikuti event. Salinlah bagian yang ditebalkan ke file 
detail_event.html di folder templates: 
<body> 
<div class="col-md-12"> 
<h1>{{ event.title | upper }}</h1> 
<hr /> 
<div class="well"> 
Diselenggarakan oleh {{ event.organizer }} <br/> 
dari {{ event.date_begin }} hingga {{ event.date_end }} <br/><br/> 
venue: {{ event.venue }} <br/> 
info lain: {{ event.about }} 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 20)
<br/><br/> 
</div> 
<div class="pull-right"> 
<a style="margin-right:10px;" href="/" class="btn btn-primary">Lihat Acara 
Lainnya</a> 
<a style="margin-right:30px;" href="/event/join/{{event.id}}" class="btn btn-default"> 
Ikut Acara</a> 
</div> 
</div> 
Jika bagian yang tebal sudah ditambahkan, kita akan melihat dua tombol tersebut muncul di bagian 
paling bawah detail event seperti pada gambar berikut ini: 
Menambahkan dua tombol baru di halaman detail event 
Bila Anda mengklik tombol ikut acara sekarang, maka Anda akan melihat error seperti berikut: 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 21)
Error karena view untuk join event belum dibuat 
Kita akan melihat error diatas karena belum ada view join_event() yang dibutuhkan untuk 
menangani penampilan form mengikuti event. Oleh karena itu mari kita buat view tersebut di 
views.py di folder dp_event. Salinlah bagian yang ditebalkan: 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
# Create your views here. 
def index(request): 
list_event = Event.objects.filter(date_end__gte=datetime.datetime.now()) 
return render_to_response('list_event.html', {'list_event':list_event}) 
def detail_event(request, id_event): 
event = Event.objects.get(id=int(id_event)) 
return render_to_response('detail_event.html', {'event':event}) 
def join_event(request, id_event): 
event = Event.objects.get(id=int(id_event)) 
c = {} 
c.update(csrf(request)) 
c.update({'event':event}) 
return render_to_response('form_event.html', c) 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 22)
Fungsi join_event() memiliki parameter lainnya yang menangkap id_event. Proses yang pertama 
kali dilaksanakan adalah melakukan pengambilan data dari event yang dipilih. Kemudian kita 
membuat sebuah handler untuk Cross Site Request Forgery (CSRF) pada objek request dan 
parameter yang dilewatkan ke template form_event.html. Di Django, setiap penampilan form, 
biasanya harus ditangani oleh CSRF Middleware terlebih dahulu jika fitur CSRF dinyalakan. 
CSRF adalah sebuah cara dimana hacker melakukan serangan dengan menyisipkan kode javascript 
berbahaya ke website kita yang dapat menangkap data yang diberikan oleh user, membajak cookies, 
atau bahkan pengalihan tautan yang ada di website kita kepada website si pemilik kode javascript 
berbahaya tersebut. 
Karena view join_event() membutuhkan template yang bernama form_event.html sekarang kita 
akan membuat file tersebut di folder templates. Salinlah kode berikut ini: 
<html> 
<head> 
<title>Ikut Acara</title> 
{% load staticfiles %} 
<script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script> 
<link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}" /> 
</head> 
<body> 
<div class="col-md-12"> 
<h1>Ikut Acara - {{ event.title }}</h1> 
<hr /> 
<div class="well"> 
<form role="form" action="/event/join/process" method="POST"> 
{% csrf_token %} 
<div class="form-group"> 
<label for="formInput">Nama</label> 
<input type="text" class="form-control" id="formInput" name="name" 
placeholder="Isi dengan nama.."> 
</div> 
<div class="form-group"> 
<label for="formInput">Email</label> 
<input type="email" class="form-control" id="formInput" name="email" 
placeholder="Isi dengan e-maill.."> 
</div> 
<div class="form-group"> 
<label for="formInput">Telepon</label> 
<input type="text" class="form-control" id="formInput" name="phone" 
placeholder="Isi dengan nomor telepon.."> 
</div> 
<div class="form-group"> 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 23)
<label for="formInput">Twitter</label> 
<input type="text" class="form-control" id="formInput" name="twitter" 
placeholder="Isi dengan akun twitter.."> 
</div> 
<input type="hidden" name="id_event" value="{{ event.id }}" /> 
<a href="/event/{{event.id}}" class="btn btn-default">Batal</a> 
<input type="submit" value="Daftarkan !" class="btn btn-default" /> 
</form> 
</div> 
</div> 
</body> 
</html> 
Perhatikan bahwa di dalam form terdapat tag {% csrf_token %}. Hal tersebut dilakukan untuk 
menjaga form tersebut dari CSRF yang dilakukan seseorang. Jika sudah disalin, maka ketika Anda 
mengklik tombol Ikut Acara di suatu event akan tampil form seperti berikut ini: 
form untuk mengikuti event 
Tapi tunggu dulu. Di dalam atribut action yang terdapat di form, jika form disubmit, maka akan 
diarahkan ke /event/join/process . Kita sudah mendefinisikan URLnya di urls.py namun belum 
membuatkan view process_join_event() di views.py. Oleh karena itu mari kita buat terlebih dahulu 
view tersebut di views.py di folder dp_event. Tambahkan kode yang ditebalkan berikut ini: 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
c = {} 
c.update(csrf(request)) 
c.update({'event':event}) 
return render_to_response('form_event.html', c) 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 24)
def process_join_event(request): 
event = Event.objects.get(id=int(request.POST['id_event'])) 
visitor = Visitor( 
name = request.POST['name'], 
phone = request.POST['phone'], 
email = request.POST['email'], 
twitter = request.POST['twitter'], 
target_event = event 
) 
visitor.save() 
return redirect('/event/' + request.POST['id_event']) 
Karena form yang kita kirimkan menggunakan metode POST, maka process_join_event() cukup 
membutuhkan parameter request saja. Data yang dikirim dari form antara lain: id_event, name, 
phone, email, twitter. Untuk mendapatkan nilai POST, kita menggunakan request.POST. Di 
dalam view tersebut, pertama kali akan dilakukan pengambilan data event yang akan diikuti dengan 
menggunakan id_event yang dikirimkan dari form. Selanjutnya kita membuat objek visitor dengan 
membuatnya dari kelas model visitor. 
Kita dapat melewatkan data yang dibutuhkan tabel visitor. Khusus untuk target_event, karena 
Django menggunakan Object Relational Mapper (ORM) maka setiap field tabel yang 
menggunakan relasi seperti ForeignKey harus dilewatkan nilai berupa objek. 
Sekarang kita coba isi form mengikuti event. Silahkan pilih event yang sudah Anda buat 
sebelumnya. Sebagai contoh berikut ini adalah contoh pengisian form mengikuti event: 
Contoh pengisian form mengikuti event 
Sekarang kita lihat hasilnya terlebih dahulu di SQLiteman dan halaman admin Django. Cobalah 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 25)
lihat gambar berikut ini: 
Melihat pengunjung yang mengisi form mengikuti event di SQLiteman 
Melihat pengunjung yang mengisi form mengikuti event di Halaman Admin Django 
Akhirnya kita sudah dapat membuat pengunjung untuk mendaftar ke event tertentu. Namun 
sayangnya, kita belum dapat melihat siapa sajakah pengunjung yang sudah hadir. Jika kita melihat 
halaman detail event, kita belum dapat melihat siapa saja yang sudah mendaftarkan diri ke event 
tersebut. Oleh karena itu mari kita modifikasi sedikit view join_event() dan template 
detail_event.html. 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 26)
Tambahkan perubahan kode yang ditebalkan berikut pada view join_event(): 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
list_event = Event.objects.filter(date_end__gte=datetime.datetime.now()) 
return render_to_response('list_event.html', {'list_event':list_event}) 
def detail_event(request, id_event): 
event = Event.objects.get(id=int(id_event)) 
list_visitor = Visitor.objects.filter(target_event = id_event) 
return render_to_response('detail_event.html', {'event':event, 'list_visitor':list_visitor}) 
def join_event(request, id_event): 
event = Event.objects.get(id=int(id_event)) 
c = {} 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
Tambahkan kode yang ditebalkan berikut pada template detail_event.html: 
<html> 
<head> 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
</head> 
<body> 
<div class="col-md-12"> 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
</div> 
<br/> 
<div class="col-md-12"> 
<h2>Daftar Pengunjung</h2> 
<hr /> 
{% if list_visitor %} 
{% for visitor in list_visitor %} 
<div class="well col-sm-3"> 
{{ visitor.name }} ({{ visitor.twitter }}) 
</div> 
{% endfor %} 
{% else %} 
<div class="well" style="text-align:center;"> 
<strong>Belum ada pengunjung...</strong> 
</div> 
{% endif %} 
</div> 
</body> 
</html> 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 27)
Jika Anda sudah berhasil menambahkan perubahan kode diatas, maka Anda akan melihat tampilan 
seperti berikut ini: 
Daftar pengunjung yang berhasil ditambahkan di halaman detail event 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 28)
8. Saran dan Kesimpulan 
Setelah selesai melakukan pelatihan ini, kita dapat memahami beberapa hal seperti berikut: 
- mampu memahami dan membuat view di Django 
- mampu memahami dan membuat model di Django 
- mampu memahami dan membuat template di Django 
- mampu membuat halaman admin di Django 
- memahami pengaturan aplikasi Django di settings.py 
- memahami cara mendefinisikan URL di urls.py 
- mampu menggunakan file CSS dan JS di aplikasi web yang kita gunakan berbasis Django 
- mampu memahami dan membuat form untuk user aplikasi kita 
- mampu memahami cara berinteraksi dengan database yang digunakan Django di aplikasi web kita 
Di aplikasi event ini belum ada: 
- autentikasi untuk member dari aplikasi agar bisa mengikuti event 
- belum ada registrasi untuk member 
- belum ada fitur untuk mencetak tiket berupa pdf 
- belum ada proses pengiriman tiket ke email 
- dan masih banyak kekurangan lainnya 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 29)
9. Daftar Pustaka 
- Django Documentation 
- Python Tutorials by TutorialsPoint 
- Twitter Bootstrap Documentation 
Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan 
Indonesia, Bandung. (halaman 30)

Mais conteúdo relacionado

Mais procurados

Modul web design - studi kasus website portal berita
Modul web design - studi kasus website portal beritaModul web design - studi kasus website portal berita
Modul web design - studi kasus website portal beritaDoni Andriansyah
 
7 langkah-membuat-modul-cms-lokomedia
7 langkah-membuat-modul-cms-lokomedia7 langkah-membuat-modul-cms-lokomedia
7 langkah-membuat-modul-cms-lokomediadhedhedea
 
Java web application 2 - membuat template web
Java web application 2 - membuat template webJava web application 2 - membuat template web
Java web application 2 - membuat template webDoni Andriansyah
 
Tutorial web service (web & client) with spring web services
Tutorial web service (web & client) with spring web servicesTutorial web service (web & client) with spring web services
Tutorial web service (web & client) with spring web servicesmuhammad arif nasution
 
Big Data Essentials With Hadoop
Big Data Essentials With HadoopBig Data Essentials With Hadoop
Big Data Essentials With HadoopMochamad Khoiron
 
Jquery ppt
Jquery pptJquery ppt
Jquery ppt044249
 
Ppt pengenalan jquery
Ppt pengenalan jqueryPpt pengenalan jquery
Ppt pengenalan jquerymutia902
 
Php module hierarchical
Php module hierarchicalPhp module hierarchical
Php module hierarchicalWahyu Bimo
 
Slide struktur codeigneter
Slide struktur codeigneterSlide struktur codeigneter
Slide struktur codeigneterCecilia Cintahta
 
Menggunakan database di android
Menggunakan database di androidMenggunakan database di android
Menggunakan database di androidInto Setiawan
 
Tutorial php membuat Aplikasi Inventaris
Tutorial php membuat Aplikasi InventarisTutorial php membuat Aplikasi Inventaris
Tutorial php membuat Aplikasi InventarisDeka M Wildan
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterMuhammad Rais
 
Tutorial menginstal-wordpress-secara-offline-di-windows
Tutorial menginstal-wordpress-secara-offline-di-windowsTutorial menginstal-wordpress-secara-offline-di-windows
Tutorial menginstal-wordpress-secara-offline-di-windowsEccha Nourul
 
test saja kok
test saja koktest saja kok
test saja koknehakhus
 
Tutorial Pembuatan Aplikasi Website Beserta Databasenya
Tutorial Pembuatan Aplikasi Website Beserta DatabasenyaTutorial Pembuatan Aplikasi Website Beserta Databasenya
Tutorial Pembuatan Aplikasi Website Beserta DatabasenyaRCH_98
 

Mais procurados (17)

Modul web design - studi kasus website portal berita
Modul web design - studi kasus website portal beritaModul web design - studi kasus website portal berita
Modul web design - studi kasus website portal berita
 
Tutorial ci
Tutorial ciTutorial ci
Tutorial ci
 
7 langkah-membuat-modul-cms-lokomedia
7 langkah-membuat-modul-cms-lokomedia7 langkah-membuat-modul-cms-lokomedia
7 langkah-membuat-modul-cms-lokomedia
 
Java web application 2 - membuat template web
Java web application 2 - membuat template webJava web application 2 - membuat template web
Java web application 2 - membuat template web
 
Tutorial web service (web & client) with spring web services
Tutorial web service (web & client) with spring web servicesTutorial web service (web & client) with spring web services
Tutorial web service (web & client) with spring web services
 
Big Data Essentials With Hadoop
Big Data Essentials With HadoopBig Data Essentials With Hadoop
Big Data Essentials With Hadoop
 
Jquery ppt
Jquery pptJquery ppt
Jquery ppt
 
Ppt pengenalan jquery
Ppt pengenalan jqueryPpt pengenalan jquery
Ppt pengenalan jquery
 
Php module hierarchical
Php module hierarchicalPhp module hierarchical
Php module hierarchical
 
Slide struktur codeigneter
Slide struktur codeigneterSlide struktur codeigneter
Slide struktur codeigneter
 
Menggunakan database di android
Menggunakan database di androidMenggunakan database di android
Menggunakan database di android
 
Tutorial php membuat Aplikasi Inventaris
Tutorial php membuat Aplikasi InventarisTutorial php membuat Aplikasi Inventaris
Tutorial php membuat Aplikasi Inventaris
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniter
 
Belajar Java dasar
Belajar Java dasarBelajar Java dasar
Belajar Java dasar
 
Tutorial menginstal-wordpress-secara-offline-di-windows
Tutorial menginstal-wordpress-secara-offline-di-windowsTutorial menginstal-wordpress-secara-offline-di-windows
Tutorial menginstal-wordpress-secara-offline-di-windows
 
test saja kok
test saja koktest saja kok
test saja kok
 
Tutorial Pembuatan Aplikasi Website Beserta Databasenya
Tutorial Pembuatan Aplikasi Website Beserta DatabasenyaTutorial Pembuatan Aplikasi Website Beserta Databasenya
Tutorial Pembuatan Aplikasi Website Beserta Databasenya
 

Destaque

Poss upi-python-dasar-part1
Poss upi-python-dasar-part1Poss upi-python-dasar-part1
Poss upi-python-dasar-part1Poss Upi
 
Poss upi-python-dasar-part2
Poss upi-python-dasar-part2Poss upi-python-dasar-part2
Poss upi-python-dasar-part2Poss Upi
 
Marek Kuziel - Deploying Django with Buildout
Marek Kuziel - Deploying Django with BuildoutMarek Kuziel - Deploying Django with Buildout
Marek Kuziel - Deploying Django with Buildoutmarekkuziel
 
Pengenalan cloud-computing
Pengenalan cloud-computingPengenalan cloud-computing
Pengenalan cloud-computingPoss Upi
 
Building the Billion Dollar Landing Page with Bootstrap
Building the Billion Dollar Landing Page with BootstrapBuilding the Billion Dollar Landing Page with Bootstrap
Building the Billion Dollar Landing Page with BootstrapGercek Karakus
 
Pemrograman Python Dasar
Pemrograman Python DasarPemrograman Python Dasar
Pemrograman Python DasarRidwan Fadjar
 
Basic Crud In Django
Basic Crud In DjangoBasic Crud In Django
Basic Crud In Djangomcantelon
 
API Design & Security in django
API Design & Security in djangoAPI Design & Security in django
API Design & Security in djangoTareque Hossain
 
Poss upi press pemrograman python dasar - 17
Poss upi press   pemrograman  python dasar - 17Poss upi press   pemrograman  python dasar - 17
Poss upi press pemrograman python dasar - 17Muh Ramadhan
 
Customizing the Django Admin
Customizing the Django AdminCustomizing the Django Admin
Customizing the Django AdminLincoln Loop
 
スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三
スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三
スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三schoowebcampus
 
The Django Web Application Framework
The Django Web Application FrameworkThe Django Web Application Framework
The Django Web Application FrameworkSimon Willison
 
Web Development with Python and Django
Web Development with Python and DjangoWeb Development with Python and Django
Web Development with Python and DjangoMichael Pirnat
 

Destaque (13)

Poss upi-python-dasar-part1
Poss upi-python-dasar-part1Poss upi-python-dasar-part1
Poss upi-python-dasar-part1
 
Poss upi-python-dasar-part2
Poss upi-python-dasar-part2Poss upi-python-dasar-part2
Poss upi-python-dasar-part2
 
Marek Kuziel - Deploying Django with Buildout
Marek Kuziel - Deploying Django with BuildoutMarek Kuziel - Deploying Django with Buildout
Marek Kuziel - Deploying Django with Buildout
 
Pengenalan cloud-computing
Pengenalan cloud-computingPengenalan cloud-computing
Pengenalan cloud-computing
 
Building the Billion Dollar Landing Page with Bootstrap
Building the Billion Dollar Landing Page with BootstrapBuilding the Billion Dollar Landing Page with Bootstrap
Building the Billion Dollar Landing Page with Bootstrap
 
Pemrograman Python Dasar
Pemrograman Python DasarPemrograman Python Dasar
Pemrograman Python Dasar
 
Basic Crud In Django
Basic Crud In DjangoBasic Crud In Django
Basic Crud In Django
 
API Design & Security in django
API Design & Security in djangoAPI Design & Security in django
API Design & Security in django
 
Poss upi press pemrograman python dasar - 17
Poss upi press   pemrograman  python dasar - 17Poss upi press   pemrograman  python dasar - 17
Poss upi press pemrograman python dasar - 17
 
Customizing the Django Admin
Customizing the Django AdminCustomizing the Django Admin
Customizing the Django Admin
 
スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三
スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三
スタートアップ組織づくりの具体策を学ぶ 先生:金子 陽三
 
The Django Web Application Framework
The Django Web Application FrameworkThe Django Web Application Framework
The Django Web Application Framework
 
Web Development with Python and Django
Web Development with Python and DjangoWeb Development with Python and Django
Web Development with Python and Django
 

Semelhante a MENGGUNAKAN DATABASE DI DJANGO

Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.
Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.
Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.Aldion Amirrul
 
Membuat Catatan Online dengan Cherrypy
Membuat Catatan Online dengan CherrypyMembuat Catatan Online dengan Cherrypy
Membuat Catatan Online dengan CherrypyRidwan Fadjar
 
Tutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API DjangoTutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API DjangoAbdul Aziz Subayu
 
Web dengan php mysql dreamweaver
Web dengan php mysql dreamweaverWeb dengan php mysql dreamweaver
Web dengan php mysql dreamweaverAlbertz Ace-Red
 
Buat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverBuat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverHaswi Haswi
 
Contoh laporan job sheet magang smk
Contoh laporan job sheet magang smkContoh laporan job sheet magang smk
Contoh laporan job sheet magang smkDewa Dewa
 
Netbeans jasper-tutorial
Netbeans jasper-tutorialNetbeans jasper-tutorial
Netbeans jasper-tutorialyunus pramono
 
Tutorial ci
Tutorial ciTutorial ci
Tutorial ciWira Hul
 
CRUD pada Android Studio menggunakan MySQL
CRUD pada Android Studio menggunakan MySQLCRUD pada Android Studio menggunakan MySQL
CRUD pada Android Studio menggunakan MySQLLusiana Diyan
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterGeorge Kartutu
 
Php dgn framework code ignitier
Php dgn framework code ignitierPhp dgn framework code ignitier
Php dgn framework code ignitierAlbertz Ace-Red
 
Php dgn frame work code ignitier
Php dgn frame work code ignitierPhp dgn frame work code ignitier
Php dgn frame work code ignitierHaswi Haswi
 
Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3iimpunya3
 
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)riarel
 
Introduction on Android programming Tutorial
Introduction on Android programming TutorialIntroduction on Android programming Tutorial
Introduction on Android programming TutorialDimas Prawira
 
Belajar framework code igniter xii rpl
Belajar framework code igniter xii rplBelajar framework code igniter xii rpl
Belajar framework code igniter xii rplDenny Yahya
 

Semelhante a MENGGUNAKAN DATABASE DI DJANGO (20)

Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.
Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.
Fundamental Django, dan Contoh Program CRUD Katalog Buku Perpustakaan.
 
Membuat Catatan Online dengan Cherrypy
Membuat Catatan Online dengan CherrypyMembuat Catatan Online dengan Cherrypy
Membuat Catatan Online dengan Cherrypy
 
Mari belajar vue js
Mari belajar vue jsMari belajar vue js
Mari belajar vue js
 
Tutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API DjangoTutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API Django
 
Kelompok 7
Kelompok 7Kelompok 7
Kelompok 7
 
Web dengan php mysql dreamweaver
Web dengan php mysql dreamweaverWeb dengan php mysql dreamweaver
Web dengan php mysql dreamweaver
 
Buat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverBuat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaver
 
Contoh laporan job sheet magang smk
Contoh laporan job sheet magang smkContoh laporan job sheet magang smk
Contoh laporan job sheet magang smk
 
Laporan 6
Laporan 6Laporan 6
Laporan 6
 
Netbeans jasper-tutorial
Netbeans jasper-tutorialNetbeans jasper-tutorial
Netbeans jasper-tutorial
 
Tutorial ci
Tutorial ciTutorial ci
Tutorial ci
 
Pemrograman android
Pemrograman androidPemrograman android
Pemrograman android
 
CRUD pada Android Studio menggunakan MySQL
CRUD pada Android Studio menggunakan MySQLCRUD pada Android Studio menggunakan MySQL
CRUD pada Android Studio menggunakan MySQL
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniter
 
Php dgn framework code ignitier
Php dgn framework code ignitierPhp dgn framework code ignitier
Php dgn framework code ignitier
 
Php dgn frame work code ignitier
Php dgn frame work code ignitierPhp dgn frame work code ignitier
Php dgn frame work code ignitier
 
Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3
 
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
 
Introduction on Android programming Tutorial
Introduction on Android programming TutorialIntroduction on Android programming Tutorial
Introduction on Android programming Tutorial
 
Belajar framework code igniter xii rpl
Belajar framework code igniter xii rplBelajar framework code igniter xii rpl
Belajar framework code igniter xii rpl
 

Mais de Ridwan Fadjar

My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
PyCon ID 2023 - Ridwan Fadjar Septian.pdf
PyCon ID 2023 - Ridwan Fadjar Septian.pdfPyCon ID 2023 - Ridwan Fadjar Septian.pdf
PyCon ID 2023 - Ridwan Fadjar Septian.pdfRidwan Fadjar
 
Cloud Infrastructure automation with Python-3.pdf
Cloud Infrastructure automation with Python-3.pdfCloud Infrastructure automation with Python-3.pdf
Cloud Infrastructure automation with Python-3.pdfRidwan Fadjar
 
GraphQL- Presentation
GraphQL- PresentationGraphQL- Presentation
GraphQL- PresentationRidwan Fadjar
 
Bugs and Where to Find Them (Study Case_ Backend).pdf
Bugs and Where to Find Them (Study Case_ Backend).pdfBugs and Where to Find Them (Study Case_ Backend).pdf
Bugs and Where to Find Them (Study Case_ Backend).pdfRidwan Fadjar
 
Introduction to Elixir and Phoenix.pdf
Introduction to Elixir and Phoenix.pdfIntroduction to Elixir and Phoenix.pdf
Introduction to Elixir and Phoenix.pdfRidwan Fadjar
 
Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...
Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...
Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...Ridwan Fadjar
 
CS meetup 2020 - Introduction to DevOps
CS meetup 2020 - Introduction to DevOpsCS meetup 2020 - Introduction to DevOps
CS meetup 2020 - Introduction to DevOpsRidwan Fadjar
 
SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)
SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)
SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)Ridwan Fadjar
 
Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...
Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...
Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...Ridwan Fadjar
 
A Study Review of Common Big Data Architecture for Small-Medium Enterprise
A Study Review of Common Big Data Architecture for Small-Medium EnterpriseA Study Review of Common Big Data Architecture for Small-Medium Enterprise
A Study Review of Common Big Data Architecture for Small-Medium EnterpriseRidwan Fadjar
 
Mongodb intro-2-asbasdat-2018-v2
Mongodb intro-2-asbasdat-2018-v2Mongodb intro-2-asbasdat-2018-v2
Mongodb intro-2-asbasdat-2018-v2Ridwan Fadjar
 
Mongodb intro-2-asbasdat-2018
Mongodb intro-2-asbasdat-2018Mongodb intro-2-asbasdat-2018
Mongodb intro-2-asbasdat-2018Ridwan Fadjar
 
Mongodb intro-1-asbasdat-2018
Mongodb intro-1-asbasdat-2018Mongodb intro-1-asbasdat-2018
Mongodb intro-1-asbasdat-2018Ridwan Fadjar
 
Resftul API Web Development with Django Rest Framework & Celery
Resftul API Web Development with Django Rest Framework & CeleryResftul API Web Development with Django Rest Framework & Celery
Resftul API Web Development with Django Rest Framework & CeleryRidwan Fadjar
 
Memulai Data Processing dengan Spark dan Python
Memulai Data Processing dengan Spark dan PythonMemulai Data Processing dengan Spark dan Python
Memulai Data Processing dengan Spark dan PythonRidwan Fadjar
 
Kisah Dua Sejoli: Arduino & Python
Kisah Dua Sejoli: Arduino & PythonKisah Dua Sejoli: Arduino & Python
Kisah Dua Sejoli: Arduino & PythonRidwan Fadjar
 
Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014
Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014
Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014Ridwan Fadjar
 
Membuat game-shooting-dengan-pygame
Membuat game-shooting-dengan-pygameMembuat game-shooting-dengan-pygame
Membuat game-shooting-dengan-pygameRidwan Fadjar
 

Mais de Ridwan Fadjar (20)

My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
PyCon ID 2023 - Ridwan Fadjar Septian.pdf
PyCon ID 2023 - Ridwan Fadjar Septian.pdfPyCon ID 2023 - Ridwan Fadjar Septian.pdf
PyCon ID 2023 - Ridwan Fadjar Septian.pdf
 
Cloud Infrastructure automation with Python-3.pdf
Cloud Infrastructure automation with Python-3.pdfCloud Infrastructure automation with Python-3.pdf
Cloud Infrastructure automation with Python-3.pdf
 
GraphQL- Presentation
GraphQL- PresentationGraphQL- Presentation
GraphQL- Presentation
 
Bugs and Where to Find Them (Study Case_ Backend).pdf
Bugs and Where to Find Them (Study Case_ Backend).pdfBugs and Where to Find Them (Study Case_ Backend).pdf
Bugs and Where to Find Them (Study Case_ Backend).pdf
 
Introduction to Elixir and Phoenix.pdf
Introduction to Elixir and Phoenix.pdfIntroduction to Elixir and Phoenix.pdf
Introduction to Elixir and Phoenix.pdf
 
Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...
Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...
Ridwan Fadjar Septian PyCon ID 2021 Regular Talk - django application monitor...
 
CS meetup 2020 - Introduction to DevOps
CS meetup 2020 - Introduction to DevOpsCS meetup 2020 - Introduction to DevOps
CS meetup 2020 - Introduction to DevOps
 
Why Serverless?
Why Serverless?Why Serverless?
Why Serverless?
 
SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)
SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)
SenseHealth Indonesia Sharing Session - Do we really need growth mindset (1)
 
Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...
Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...
Risk Analysis of Dutch Healthcare Company Information System using ISO 27001:...
 
A Study Review of Common Big Data Architecture for Small-Medium Enterprise
A Study Review of Common Big Data Architecture for Small-Medium EnterpriseA Study Review of Common Big Data Architecture for Small-Medium Enterprise
A Study Review of Common Big Data Architecture for Small-Medium Enterprise
 
Mongodb intro-2-asbasdat-2018-v2
Mongodb intro-2-asbasdat-2018-v2Mongodb intro-2-asbasdat-2018-v2
Mongodb intro-2-asbasdat-2018-v2
 
Mongodb intro-2-asbasdat-2018
Mongodb intro-2-asbasdat-2018Mongodb intro-2-asbasdat-2018
Mongodb intro-2-asbasdat-2018
 
Mongodb intro-1-asbasdat-2018
Mongodb intro-1-asbasdat-2018Mongodb intro-1-asbasdat-2018
Mongodb intro-1-asbasdat-2018
 
Resftul API Web Development with Django Rest Framework & Celery
Resftul API Web Development with Django Rest Framework & CeleryResftul API Web Development with Django Rest Framework & Celery
Resftul API Web Development with Django Rest Framework & Celery
 
Memulai Data Processing dengan Spark dan Python
Memulai Data Processing dengan Spark dan PythonMemulai Data Processing dengan Spark dan Python
Memulai Data Processing dengan Spark dan Python
 
Kisah Dua Sejoli: Arduino & Python
Kisah Dua Sejoli: Arduino & PythonKisah Dua Sejoli: Arduino & Python
Kisah Dua Sejoli: Arduino & Python
 
Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014
Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014
Mengenal Si Ular Berbisa - Kopi Darat Python Bandung Desember 2014
 
Membuat game-shooting-dengan-pygame
Membuat game-shooting-dengan-pygameMembuat game-shooting-dengan-pygame
Membuat game-shooting-dengan-pygame
 

MENGGUNAKAN DATABASE DI DJANGO

  • 1. 1. Hello World Django Django merupakan fullstack web framework yang dirancang dan dibangun oleh Adrian Holovaty dan Jacob Kaplan Moss. Awal mulanya Django merupakan web framework internal yang dimiliki oleh kantor dimana Adrian Holovaty bekerja sebagai jurnalis. Namun seiring perkembangannya, Django dirilis menjadi open source. Anda dapat membangun aplikasi web dengan menggunakan konsep MVC. Di Django hal tersebut dinamakan dengan MTV (Model, Template, View), dimana model adalah kode yang berisi objek yang menjadi representasi dari sebuah tabel di Database, template adalah kode yang berisi HTML, CSS, Javascript dan presentasi lainnya yang ditujukan kepada user, view adalah kode yang berisi bisnis proses dari aplikasi, menerima request dari user, memberikan response kepada user, dan berinteraksi dengan database yang dipilih. Dalam pelatihan kali ini kita akan menggunakan Django 1.6 . Anda dapat mengunduhnya di http://djangoproject.com/ dan carilah versi 1.6 . Installer akan tersedia dalam bentuk zipped (.zio) atau gunzipped (.tar.gz). Setelah Anda selesai mengunduhnya lakukanlah beberapa langkah berikut untuk memulai instalasi (Pastikan Anda sudah menginstall Python versi 2.6.x ke atas):  ekstrak installer tersebut. Jika Anda menggunakan Linux ekstrak folder tersebut dengan perintah Extract melalui file manager yang Anda gunakan atau melalui terminal gunakan perintah tar -xzvf django-1.6.tgz. Jika Anda menggunakan Windows atau OSX silahkan gunakan aplikasi seperti 7zip untuk membuka bundelan tersebut.  masuk ke dalam folder hasil ekstrak sebelumnya, cobalah Anda lihat apakah di dalamnya terdapat file setup.py  Jika terdapat file tersebut maka lakukan proses instalasi Django dengan menggunakan perintah: python setup.py install di terminal  Waktu yang dibutuhkan untuk instalasi lebih dari 1 menit, jadi Anda dapat mengunduh dokumentasinya di website yang sama  Jika proses instalasi selesai, Anda dapat memeriksa apakah Django sudah terinstal atau belum dengan menggunakan perintah django-admin.py version di terminal  Jika muncul no versi dari Django yang Anda baru saja install di komputer Anda, maka proses instalasi Django telah berhasil Proses instalasi pun sudah selesai dan Django siap digunakan. Sekarang kita akan mencoba membuat proyek Django baru. Silahkan Anda berpindah ke folder yang diinginkan untuk menyimpan proyek Django, misal /home/username_anda/Document . Setelah memilih folder buatlah proyek Django baru dengan menggunakan perintah django-admin.py startproject demo_possupi di terminal dan dalam beberapa saat proyek Django baru akan tercipta. Silahkan masuk ke dalam folder proyek demo_possupi dan Anda akan melihat sebuah folder yang bernama sama yaitu demo_possupi dan file manage.py. Jika ada kedua benda tersebut sekarang kita akan mencoba menyalakan web server untuk development yang dimiliki Django dengan perintah python manage.py runserver di terminal. Secara default Django akan menyalakan web server yang dimilikinya di IP Address 127.0.0.1 atau localhost dan port 8000. Jika server sudah menyala dan tidak muncul error akses proyek demo_possupi di web browser dengan URL http://localhost:8000 dan Anda akan melihat tampilan seperti pada gambar berikut: Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 1)
  • 2. Tampilan saat web server Django diakses melalui web browser Tampilan saat web server Django dinyalakan Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 2)
  • 3. 2. Menentukan Spesifikasi Aplikasi Event Spesifikasi yang dibutuhkan sederhana saja. Kita membutuhkan tabel event dan visitor untuk menampung aplikasi yang akan kita bangun. Kita akan membuat sebuah halaman utama yang menampilkan semua event kemudian ada tombol detail event. Kita bisa menekan tombol detail event tersebut dan melihat detail event seperti informasi event dan siapa saja yang mengunjungi event tersebut. Tentunya pengunjung boleh mendaftarkan diri untuk mengikuti event tertentu. Aplikasi juga memiliki halaman admin yang siap mengelola kedua tabel tersebut. Kita membutuhkan halaman admin untuk mengelola data event dan data visitor. Kita membutuhkan DDL untuk tabel event seperti berikut ini: CREATE TABLE "dp_event_event" ( "id" integer NOT NULL PRIMARY KEY, "title" varchar(50) NOT NULL, "organizer" varchar(30) NOT NULL, "venue" text NOT NULL, "about" text NOT NULL, "finished" bool NOT NULL, "date_begin" datetime NOT NULL, "date_end" datetime NOT NULL, "date_created" datetime NOT NULL ) dan DDL untuk tabel visitor seperti berikut ini: CREATE TABLE "dp_event_visitor" ( "id" integer NOT NULL PRIMARY KEY, "name" varchar(50) NOT NULL, "phone" varchar(15) NOT NULL, "email" varchar(75) NOT NULL, "twitter" varchar(200) NOT NULL, "target_event_id" integer NOT NULL REFERENCES "dp_event_event" ("id"), "date_join" datetime NOT NULL ) Tapi DDL diatas jangan disalin. Karena proses pembuatan tabel akan berbeda dari cara yang biasa. Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 3)
  • 4. 3. Menggunakan Database di Django Dengan Django Anda dapat menggunakan berbagai database seperti MySQL, MongoDB, SQLite3, PostgreSQL, Oracle, dan berbagai database lainnya. Anda dapat menentukan database yang akan digunakan, dan Django akan menangani database yang Anda gunakan. Untuk memulai penggunaan database di Django, Anda dapat melakukan beberapa konfigurasi di file setting.py yang terdapat di folder demo_possupi/demo_possupi kemudian tentukan database yang akan digunakan. Misal dalam percobaan kita kali ini, akan digunakan database SQLite3 dengan nama demo_possupi.sqlite3. Perhatikan konfigurasinya di bawah ini (penting: tanda garis strip menandakan bahwa ada kode sebelum atau sesudah dari potongan kode yang ditampilkan): - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - # Database # https://docs.djangoproject.com/en/1.6/ref/settings/#databases DATABASES = { 'default': { 'ENGINE': 'django.db.backends.sqlite3', 'NAME': os.path.join(BASE_DIR, 'demo_possupi.sqlite3'), } } - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Pada bagian konfigurasi database, biasanya terdapat dua hal saja yang diperlukan. Yaitu database engine dan nama database yang akan digunakan. Pada konfigurasi diatas kita hanya menggunakan dua hal tersebut karena menggunakan SQLite3. Jika menggunakan database seperti MySQL atau PostgreSQL, maka kita membutuhkan konfigurasi tambahan seperti letak port dari server database, URL, akun untuk mengakses database tersebut, dan lainnya. Setelah selesai melakukan konfigurasi database, sekarang kita akan melakukan proses synchronization antara database dengan aplikasi Django kita dengan menggunakan perintah python manage.py syncdb . Perhatikakn contohnya berikut ini: root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# python manage.py syncdb Creating tables ... Creating table django_admin_log Creating table auth_permission Creating table auth_group_permissions Creating table auth_group Creating table auth_user_groups Creating table auth_user_user_permissions Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 4)
  • 5. Creating table auth_user Creating table django_content_type Creating table django_session You just installed Django's auth system, which means you don't have any superusers defined. Would you like to create one now? (yes/no): yes Username (leave blank to use 'root'): root Email address: ridwanbejo@gmail.com Password: Password (again): Superuser created successfully. Installing custom SQL ... Installing indexes ... Installed 0 object(s) from 0 fixture(s) root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# Beberapa hal yang dilakukan ketika kita menggunakan perintah python manage.py syncdb antara lain:  Django membuat table default yang berisi session, group, group_permission, user, admin_log, dan tabel lainnya seperti pada snapshot diatas. Jika kita belum membuat satu model pun di Django, maka tabel default akan dibentuk lebih dahulu  Jika Anda sudah mendefinisikan model di sebuah aplikasi di Django, maka Django akan membuatkan tabelnya jika belum terdapat di database  Tabel yang telah dibuat tidak akan dibuat ulang. Jika kita ingin melakukan perubahan pada model. Anda dapat melakukanya dengan cara melakukan drop table pada tabel yang berhubungan dengan sebuah model atau menggunakan migration tools seperti South  Anda harus memberikan nama pada user root dari aplikasi Django Anda  Anda dapat memberikan password untuk masuk ke halaman aplikasi Django Sekarang kita akan mencoba halaman admin yang sudah disediakan oleh Django. Nyalakan terlebih dahulu web server Django dengan perintah python manage.py runserver kemudian cobalah Anda akses URL http://localhost:8000/admin di web browser maka akan muncul tampilan seperti berikut: Form login halaman admin Django Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 5)
  • 6. Kemudian masukkan account Django yang telah Anda buat sebelumnya, dan Anda akan melihat halaman admin Django seperti pada gambar berikut: Halaman utama dari halaman admin Django Halaman kelola user dari halaman admin Django Halaman kelola grup dari halaman admin Django Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 6)
  • 7. 4. Membangun Model untuk Aplikasi Event Model merupakan sebuah file yang terdapat di setiap aplikasi Django. Di dalam Django dapat memiliki banyak aplikasi sesuai dengan kebutuhan sistem. Setiap aplikasi Django biasanya terdiri dari:  model.py, berisi class yang merupakan representasi dari setiap tabel. Tentunya sebuah class dapat memiliki fungsionalitasnya yang unik dari class lainnya  views.py, berisi kumpulan fungsi yang akan diakses oleh user dengan perantara URL yang didefinisikan di urls.py yang terdapat di aplikasi atau di urls.py yang terdapat di folder demo_possupi  urls.py, berisi kumpulan URL yang didefinisikan untuk mewujudkan sistem dan memberikan reaksi terhadap user. Setiap URL akan mengarah kepada suatu fungsi di views.py  admin.py, berisi konfigurasi aplikasi yang ditampilkan di halaman admin Django  tests.py, berisi testing yang digunakan untuk menguji aplikasi Django  __init__.py, merupakan sebuah file yang menjadi penanda bawa folder tersebut merupakan module Python Untuk membuat sebuah aplikasi di Django, Anda dapat melakukannya dengan menggunakan perintah python manage.py startapp <nama_aplikasi> misalnya seperti pada kasus berikut ini dimana kita membuat sebuah aplikasi yang bernama dp_event: root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# python manage.py startapp dp_event root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# ls db.sqlite3 demo_possupi demo_possupi.sqlite3 dp_event manage.py root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# Sekarang sebuah folder yang bernama dp_event sudah tercipta dengan menggunakan perintah diatas. Folder tersebut berisi file admin.py, __init__.py, tests.py, models.py, dan views.py. Kemudian daftarkan aplikasi yang baru saja kita ciptakan di setting.py dengan menambahkan nama aplikasi kita ke konfigurasi INSTALLED_APPS. Di bab ini kita akan mencoba membuat tabel dengan mengandalkan model yang dimiliki Django. Jangan lupa untuk mengubah hak akses dari folder dp_event jika Anda menggunakan Linux. Berikut adalah model yang akan kita gunakan untuk aplikasi event yang akan digunakan. Salin kode berikut ke dalam file models.py: from django.db import models # Create your models here. Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 7)
  • 8. class Event(models.Model): title = models.CharField(max_length=50) organizer = models.CharField(max_length=30) venue = models.TextField() about = models.TextField(blank=True) finished = models.BooleanField() date_begin = models.DateTimeField() date_end = models.DateTimeField() date_created = models.DateTimeField(auto_now=True) def __unicode__(self): return self.title class Meta: ordering = ['date_begin'] class Visitor(models.Model): name = models.CharField(max_length=50) phone = models.CharField(max_length=15) email = models.EmailField() twitter = models.URLField(blank=True) target_event = models.ForeignKey(Event) date_join = models.DateTimeField(auto_now=True) def __unicode__(self): return self.name class Meta: ordering = ['date_join'] Setelah selesai membuat kode model diatas, saatnya melakukan synchronization database Django kita dengan menggunakan perintah python manage.py syncdb. Berikut adalah snapshot saat tabel dari model diatas dibuat: root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# python manage.py syncdb Creating tables ... Creating table dp_event_event Creating table dp_event_visitor Installing custom SQL ... Installing indexes ... Installed 0 object(s) from 0 fixture(s) root@ridwanbejo:/home/ridwanbejo/Projects/Django/demo_possupi# Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 8)
  • 9. Anda dapat melihat kedua tabel yang telah dibuat dengan menggunakan SQLiteman. SQLiteman merupakan sebuah aplikasi desktop yang digunakan untuk membantu pengelolaan database SQLite3. Berikut ini adalah tampilan dari database untuk aplikasi event: Susunan tabel event di SQLiteman Susunan tabel visitor di SQLiteman Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 9)
  • 10. 5. Membangun Halaman Administrator untuk Aplikasi Event Halaman admin biasanya dibuat dari awal ketika kita membangun sebuah aplikasi web. Dengan menggunakan Django, Anda dapat menggunakan halaman admin yang di-generate dari model yang telah didefinisikan sebelumnya. Tampilannya yang sederhana dapat Anda manfaatkan semaksimal mungkin untuk menunjang aplikasi web yang Anda gunakan. Sebelumnya kita hanya melakukan login dan melihat halaman yang menyajikan tabel groups dan users. Sekarang kita akan mencoba menambahkan model yang telah kita definisikan ke halaman admin. Suntinglah file admin.py di folder dp_event, dan salinlah kode berikut: from django.contrib import admin from dp_event.models import * # Register your models here. admin.site.register(Event) admin.site.register(Visitor) Setelah Anda menyalin kode diatas, silahkan buka halaman admin di http://localhost:8000/admin , dan di halaman tersebut Anda akan melihat dua menu yang merupakan nama model yang telah kita buat sebelumnya. Berikut ini adalah halaman admin setelah ditambahkan dua model tersebut: Halaman admin Django setelah ditambahkan dua model baru Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 10)
  • 11. Menambahkan event baru di halaman admin django Event baru sudah ditambahkan Riwayat penggantian data di tabel Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 11)
  • 12. Melakukan pengubahan data event di halaman admin Django Melihat data event yang baru ditambahkan di SQLiteman Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 12)
  • 13. 6. Membangun View dan Template untuk Aplikasi Event Diasumsikan bahwa halaman admin sudah selesai dibangun, sekarang saatnya kita membuat halaman untuk publik. Untuk percobaan di pelatihan ini, kita akan mencoba menampilkan daftar event yang belum berakhir, dan menerima pengunjung yang ingin datang ke event tersebut. View adalah sebuah file yang berisi function yang akan menangani request dan response terhadap user. Template merupakan file yang berisi HTML + CSS + Javascript yang akan ditampilkan kepada user melalui web browser. Sebelum membangun template mari kita atur terlebih dahulu tempat penyimpanan template. Buatlah folder yang bernama templates di dalam folder proyek demo_possupi. Kemudian tambahkan pengaturan yang ditebalkan berikut di setting.py: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - # SECURITY WARNING: don't run with debug turned on in production! DEBUG = True TEMPLATE_DEBUG = True TEMPLATE_DIRS = ( BASE_DIR+'/templates', ) ALLOWED_HOSTS = [] # Application definition - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Kita juga akan menggunakan CSS dan Javascript untuk mempercantik halaman web yang akan dibangun. Kita akan menggunakan Twitter Bootstrap unuk pelatihan kali ini. Buatlah folder yang bernama static di dalam folder proyek demo_possupi. Dan simpan Twitter Bootstrap ke dalam folder static . Kemudian tambahkan pengaturan yang ditebalkan berikut di setting.py: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - USE_TZ = True # Static files (CSS, JavaScript, Images) # https://docs.djangoproject.com/en/1.6/howto/static-files/ STATIC_URL = '/static/' Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 13)
  • 14. STATICFILES_DIRS = ( os.path.join(BASE_DIR, "static"), ) Selesai mengatur folder untuk template dan file static di Django, mari kita coba untuk membuat view pertama di Django. Suntinglah file urls.py yang berada di folder demo_possupi dengan menambahkan baris kode yang ditebalkan seperti pada potongan kode berikut ini: from django.conf.urls import patterns, include, url from django.contrib import admin admin.autodiscover() urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^$', 'dp_event.views.index'), ) Bagian yang ditebalkan memiliki arti kurang lebih jika user melakukan request terhadap URL http://localhost:8000 maka Django akan mengeksekusi view yang bernama index. Tanda $ menyatakan bahwa di belakan URL yang didefinisikan tidak boleh ada karakter apapun. Karena view index belum didefinisikan. Mari kita membuat view di file views.py di folder dp_event. Lalu salin potongan kode berikut: from django.shortcuts import render_to_response, redirect from django.http import HttpResponse from django.core.context_processors import csrf from dp_event.models import * # Create your views here. def index(request): return HttpResponse("Selamat datang di pelatihan django ....") Di dalam file views.py, Anda dapat meng-import berbagai modul Django, Python, ataupun teknologi yang dibuat dengan Python lainnya untuk digunakan di dalam view kita. Biasanya yang dibutuhkan adalah modul untuk menampilkan template seperti django.shortcuts.render_to_response, melakukan redirect dengan django.shortcuts.redirect, dan modul untuk mencegah cross site request forgery atau csrf dengan django.core.context_processors import csrf. Dan tentu saja kita membutuhkan model yang telah kita bangun, untuk digunakan jika ingin menampilkan data yang diambil dari tiap model tersebut. Pada potongan kode diatas, kita membuat sebuah view yang bernama index. Sebuah view hanyalah fungsi biasa, hanya saja untuk dianggap sebagai view harus dilewatkan satu paramerter yang Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 14)
  • 15. digunakan untuk menangani request dari user. Jika view diatas dipanggil maka akan ditampilkan sebuah response seperti berikut: view pertama di Django Untuk membuat view di Django diperlukan beberapa tahap. Agar lebih menarik, mari kita coba tampilkan data event yang sudah ada di dalam database ke halaman utama. Tentu saja event yang ditampilkan adalah event yang belum berakhir. Berikut adalah perubahan isi file views.py yang akan digunakan untuk menampilkan daftar event yang belum berakhir: from django.shortcuts import render_to_response, redirect from django.http import HttpResponse from django.core.context_processors import csrf from dp_event.models import * import datetime # Create your views here. def index(request): list_event = Event.objects.filter(date_end__gte=datetime.datetime.now()) return render_to_response('list_event.html', {'list_event':list_event}) Pada kode diatas kita memanggil modul datetime yang digunakan untuk mendapatkan tanggal hari ini, dan manipulasi tanggal. Di dalam view index, kita mencoba untuk mengambil daftar semua event yang belum berakhir. Setelah semua event didapatkan, maka view index akan melewatkan daftar event tersebut ke dalam template list_event.html dan menampilkannya di web browser. Berhubung kita belum membuat template list_event.html , kita coba akses view tersebut dan lihatlah apa yang terjadi: Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 15)
  • 16. Contoh tampilan halaman error Django jika template yang dibutuhkan belum tersedia Setelah melihat contoh error diatas, mari kita buat template untuk menangani halaman utama. Buatlah sebuah file yang bernama list_event.html di folder templates. Kemudian salin kode berikut ini: <html> <head> <title>Daftar Event</title> {% load staticfiles %} <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script> <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}" /> </head> <body> <div class="col-md-12"> <h1>Daftar Event yang Bisa Anda Kunjungi !</h1> <hr /> {% for event in list_event %} <div class="col-md-4 well"> <strong>{{ event.title | upper }}</strong> <hr/> Diselenggarakan oleh {{ event.organizer }} <br/> dari {{ event.date_begin }} hingga {{ event.date_end }} <br/><br/> <a href="/event/{{event.id}}" class="btn btn-default">Lihat Detail</a> </div> {% endfor %} Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 16)
  • 17. </div> </body> </html> Berikut ini adalah beberapa tag dari template Django yang perlu diperhatikan dari contoh diatas:  {% load staticfiles %}  {% static 'bootstrap/js/bootstrap.min.js' %}  {% for event in list_event %}  {{ event.title | upper }}  {{ event.organizer }}  {% endfor %} Setelah memahami tag di template Django, mari kita lihat hasilnya di web browser: Menampilkan template yang berisi daftar event yang bisa diikuti oleh user Dan yang terakhir di bab ini adalah kita akan mencoba membuat halaman detail dari setiap event. Kita belum bisa melihat dimana tempat event, detail event, dan siapa saja yang menghadiri event tersebut. Mari kita awali dengan mendefinisikan URL di file urls.py di folder demo_possupi. Salinlah bagian yang ditebalkan dan tambahkan ke urls.py: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 17)
  • 18. admin.autodiscover() urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^$', 'dp_event.views.index'), url(r'^event/(d+)', 'dp_event.views.detail_event'), ) Di URL yang terbaru kita dapat mengakses URL utama dengan ditambahkan segmen event dan menambahkan parameter id dari event tersebut. Kurang lebih URL yang akan diakses seperti http://localhost:8000/event/199123 dimana 199123 adalah id dari sebuah event yang kita klik di halaman utama. Untuk menghasilkan respon yang memperlihatkan detail event, URL tersebut akan ditangani oleh view detail_event. Tambahkan kode berikut di views.py yang berada di folder dp_event: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - def detail_event(request, id_event): event = Event.objects.get(id=int(id_event)) return render_to_response('detail_event.html', {'event':event}) View diatas menerima dua parameter, yaitu request dan id_event . Parameter id_event didapatkan dari angka yang dilewatkan setelah segmen event, misalnya 199123. Kemudian id_event akan digunakan untuk mencari event yang memiliki id yang diinginkan. Jika ditemukan, event yang didapat akan ditampilkan di template detail_event.html menggunakan render_to_response. Berikut adalah kode dari template detail_event.html: <html> <head> <title>Daftar Event</title> {% load staticfiles %} <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script> <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}" /> </head> <body> <div class="col-md-12"> <h1>{{ event.title | upper }}</h1> <hr /> <div class="well"> Diselenggarakan oleh {{ event.organizer }} <br/> dari {{ event.date_begin }} hingga {{ event.date_end }} <br/><br/> venue: {{ event.venue }} <br/> info lain: {{ event.about }} </div> Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 18)
  • 19. </div> </body> </html> Pada template diatas kita menampilkan tempat event diselenggarakan dan info lainnya dari event yang akan diselenggarakan. Di bab berikutnya, kita akan mencoba menampilkan siapa saja yang akan datang ke event tersebut. Berikut ini adalah tampilan detail dari sebuah event: Tampilan detail event Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 19)
  • 20. 7. Menyusun Form Ikut event untuk User Satu hal yang belum kita dapatkan di bagian front-end dari aplikasi event ini adalah belum adanya interaksi dari user yang berkunjung untuk memberikan data mereka kepada aplikasi. Kita memerlukan sebuah form yang mencatat setiap user yang ingin ikut ke event tertentu. Kemudian setelah mengisi form ikut event tertentu, maka di detail event yang akan diikuti, munculah daftar pengunjung dari event tersebut. Kita membutuhkan halaman khusus yang menyediakan form untuk diisi user. Mari kita awali dengan mendefinisikan URL untuk menampilkan form mengikuti event dan URL untuk memproses data yang dikirimkan dari form tersebut. Salinlah bagian yang ditebalkan ke file urls.py di folder demo_possupi: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - admin.autodiscover() urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^$', 'dp_event.views.index'), url(r'^event/(d+)', 'dp_event.views.detail_event'), url(r'^event/join/(d+)', 'dp_event.views.join_event'), url(r'^event/join/process$', 'dp_event.views.process_join_event'), ) URL yang ditebalkan pertama menangani penampilan form mengikuti event dengan id tertentu. URL tersebut ditangani oleh view join_event(). Sedangkan URL yang ditebalkan kedua menangani proses pencatatan pengunjung yang ingin mengikuti event tertentu. URL tersebut ditangani oleh view process_join_event(). URL untuk menangani pengunjung yang ingin mengikuti event telah didefinisikan. Sekarang kita tambahkan dua tombol baru di detail event. Tombol pertama untuk kembali ke halaman utama, dan tombol kedua untuk melihat form mengikuti event. Salinlah bagian yang ditebalkan ke file detail_event.html di folder templates: <body> <div class="col-md-12"> <h1>{{ event.title | upper }}</h1> <hr /> <div class="well"> Diselenggarakan oleh {{ event.organizer }} <br/> dari {{ event.date_begin }} hingga {{ event.date_end }} <br/><br/> venue: {{ event.venue }} <br/> info lain: {{ event.about }} Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 20)
  • 21. <br/><br/> </div> <div class="pull-right"> <a style="margin-right:10px;" href="/" class="btn btn-primary">Lihat Acara Lainnya</a> <a style="margin-right:30px;" href="/event/join/{{event.id}}" class="btn btn-default"> Ikut Acara</a> </div> </div> Jika bagian yang tebal sudah ditambahkan, kita akan melihat dua tombol tersebut muncul di bagian paling bawah detail event seperti pada gambar berikut ini: Menambahkan dua tombol baru di halaman detail event Bila Anda mengklik tombol ikut acara sekarang, maka Anda akan melihat error seperti berikut: Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 21)
  • 22. Error karena view untuk join event belum dibuat Kita akan melihat error diatas karena belum ada view join_event() yang dibutuhkan untuk menangani penampilan form mengikuti event. Oleh karena itu mari kita buat view tersebut di views.py di folder dp_event. Salinlah bagian yang ditebalkan: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - # Create your views here. def index(request): list_event = Event.objects.filter(date_end__gte=datetime.datetime.now()) return render_to_response('list_event.html', {'list_event':list_event}) def detail_event(request, id_event): event = Event.objects.get(id=int(id_event)) return render_to_response('detail_event.html', {'event':event}) def join_event(request, id_event): event = Event.objects.get(id=int(id_event)) c = {} c.update(csrf(request)) c.update({'event':event}) return render_to_response('form_event.html', c) - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 22)
  • 23. Fungsi join_event() memiliki parameter lainnya yang menangkap id_event. Proses yang pertama kali dilaksanakan adalah melakukan pengambilan data dari event yang dipilih. Kemudian kita membuat sebuah handler untuk Cross Site Request Forgery (CSRF) pada objek request dan parameter yang dilewatkan ke template form_event.html. Di Django, setiap penampilan form, biasanya harus ditangani oleh CSRF Middleware terlebih dahulu jika fitur CSRF dinyalakan. CSRF adalah sebuah cara dimana hacker melakukan serangan dengan menyisipkan kode javascript berbahaya ke website kita yang dapat menangkap data yang diberikan oleh user, membajak cookies, atau bahkan pengalihan tautan yang ada di website kita kepada website si pemilik kode javascript berbahaya tersebut. Karena view join_event() membutuhkan template yang bernama form_event.html sekarang kita akan membuat file tersebut di folder templates. Salinlah kode berikut ini: <html> <head> <title>Ikut Acara</title> {% load staticfiles %} <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script> <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}" /> </head> <body> <div class="col-md-12"> <h1>Ikut Acara - {{ event.title }}</h1> <hr /> <div class="well"> <form role="form" action="/event/join/process" method="POST"> {% csrf_token %} <div class="form-group"> <label for="formInput">Nama</label> <input type="text" class="form-control" id="formInput" name="name" placeholder="Isi dengan nama.."> </div> <div class="form-group"> <label for="formInput">Email</label> <input type="email" class="form-control" id="formInput" name="email" placeholder="Isi dengan e-maill.."> </div> <div class="form-group"> <label for="formInput">Telepon</label> <input type="text" class="form-control" id="formInput" name="phone" placeholder="Isi dengan nomor telepon.."> </div> <div class="form-group"> Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 23)
  • 24. <label for="formInput">Twitter</label> <input type="text" class="form-control" id="formInput" name="twitter" placeholder="Isi dengan akun twitter.."> </div> <input type="hidden" name="id_event" value="{{ event.id }}" /> <a href="/event/{{event.id}}" class="btn btn-default">Batal</a> <input type="submit" value="Daftarkan !" class="btn btn-default" /> </form> </div> </div> </body> </html> Perhatikan bahwa di dalam form terdapat tag {% csrf_token %}. Hal tersebut dilakukan untuk menjaga form tersebut dari CSRF yang dilakukan seseorang. Jika sudah disalin, maka ketika Anda mengklik tombol Ikut Acara di suatu event akan tampil form seperti berikut ini: form untuk mengikuti event Tapi tunggu dulu. Di dalam atribut action yang terdapat di form, jika form disubmit, maka akan diarahkan ke /event/join/process . Kita sudah mendefinisikan URLnya di urls.py namun belum membuatkan view process_join_event() di views.py. Oleh karena itu mari kita buat terlebih dahulu view tersebut di views.py di folder dp_event. Tambahkan kode yang ditebalkan berikut ini: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - c = {} c.update(csrf(request)) c.update({'event':event}) return render_to_response('form_event.html', c) Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 24)
  • 25. def process_join_event(request): event = Event.objects.get(id=int(request.POST['id_event'])) visitor = Visitor( name = request.POST['name'], phone = request.POST['phone'], email = request.POST['email'], twitter = request.POST['twitter'], target_event = event ) visitor.save() return redirect('/event/' + request.POST['id_event']) Karena form yang kita kirimkan menggunakan metode POST, maka process_join_event() cukup membutuhkan parameter request saja. Data yang dikirim dari form antara lain: id_event, name, phone, email, twitter. Untuk mendapatkan nilai POST, kita menggunakan request.POST. Di dalam view tersebut, pertama kali akan dilakukan pengambilan data event yang akan diikuti dengan menggunakan id_event yang dikirimkan dari form. Selanjutnya kita membuat objek visitor dengan membuatnya dari kelas model visitor. Kita dapat melewatkan data yang dibutuhkan tabel visitor. Khusus untuk target_event, karena Django menggunakan Object Relational Mapper (ORM) maka setiap field tabel yang menggunakan relasi seperti ForeignKey harus dilewatkan nilai berupa objek. Sekarang kita coba isi form mengikuti event. Silahkan pilih event yang sudah Anda buat sebelumnya. Sebagai contoh berikut ini adalah contoh pengisian form mengikuti event: Contoh pengisian form mengikuti event Sekarang kita lihat hasilnya terlebih dahulu di SQLiteman dan halaman admin Django. Cobalah Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 25)
  • 26. lihat gambar berikut ini: Melihat pengunjung yang mengisi form mengikuti event di SQLiteman Melihat pengunjung yang mengisi form mengikuti event di Halaman Admin Django Akhirnya kita sudah dapat membuat pengunjung untuk mendaftar ke event tertentu. Namun sayangnya, kita belum dapat melihat siapa sajakah pengunjung yang sudah hadir. Jika kita melihat halaman detail event, kita belum dapat melihat siapa saja yang sudah mendaftarkan diri ke event tersebut. Oleh karena itu mari kita modifikasi sedikit view join_event() dan template detail_event.html. Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 26)
  • 27. Tambahkan perubahan kode yang ditebalkan berikut pada view join_event(): - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - list_event = Event.objects.filter(date_end__gte=datetime.datetime.now()) return render_to_response('list_event.html', {'list_event':list_event}) def detail_event(request, id_event): event = Event.objects.get(id=int(id_event)) list_visitor = Visitor.objects.filter(target_event = id_event) return render_to_response('detail_event.html', {'event':event, 'list_visitor':list_visitor}) def join_event(request, id_event): event = Event.objects.get(id=int(id_event)) c = {} - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Tambahkan kode yang ditebalkan berikut pada template detail_event.html: <html> <head> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - </head> <body> <div class="col-md-12"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - </div> <br/> <div class="col-md-12"> <h2>Daftar Pengunjung</h2> <hr /> {% if list_visitor %} {% for visitor in list_visitor %} <div class="well col-sm-3"> {{ visitor.name }} ({{ visitor.twitter }}) </div> {% endfor %} {% else %} <div class="well" style="text-align:center;"> <strong>Belum ada pengunjung...</strong> </div> {% endif %} </div> </body> </html> Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 27)
  • 28. Jika Anda sudah berhasil menambahkan perubahan kode diatas, maka Anda akan melihat tampilan seperti berikut ini: Daftar pengunjung yang berhasil ditambahkan di halaman detail event Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 28)
  • 29. 8. Saran dan Kesimpulan Setelah selesai melakukan pelatihan ini, kita dapat memahami beberapa hal seperti berikut: - mampu memahami dan membuat view di Django - mampu memahami dan membuat model di Django - mampu memahami dan membuat template di Django - mampu membuat halaman admin di Django - memahami pengaturan aplikasi Django di settings.py - memahami cara mendefinisikan URL di urls.py - mampu menggunakan file CSS dan JS di aplikasi web yang kita gunakan berbasis Django - mampu memahami dan membuat form untuk user aplikasi kita - mampu memahami cara berinteraksi dengan database yang digunakan Django di aplikasi web kita Di aplikasi event ini belum ada: - autentikasi untuk member dari aplikasi agar bisa mengikuti event - belum ada registrasi untuk member - belum ada fitur untuk mencetak tiket berupa pdf - belum ada proses pengiriman tiket ke email - dan masih banyak kekurangan lainnya Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 29)
  • 30. 9. Daftar Pustaka - Django Documentation - Python Tutorials by TutorialsPoint - Twitter Bootstrap Documentation Pelatihan Django Dasar POSS UPI 2014. Gedung Ilmu Komputer, Universitas Pendidikan Indonesia, Bandung. (halaman 30)