Django Template Yapısı
Django MVT (Model-View-Template) ile çalışır.
Django html bilen herkesin kullanabileceği kadar basit bir template yapısına sahiptir.
……………………………………..
Settings.py açıyoruz
Templates içine
‘DIRS’:
[os.path.join(BASE_DIR,‘templates’)],
Kod satırı yazdıktan sonra blog app mize templates klasörü oluşturabiliriz. Bu sayede templatelerimiz için bir dizin oluşturmuş oluyoruz.
Templates Değişkenler ve Render yapısı
Burada view te veri oluşturacağız ve bunu oluşturacağımız html sayfamızda göstereceğiz
Blog işlemleri için templates klasörü içine blog-temp klasörü oluşturuyoruz
Blog-temp klasörü içine yeni ekleden post-list ismini verdiğimiz bir html file ekliyoruz
- Adım
Views.py içine
def post_list(request):
return render(request,'blog-temp/post-list.html')
şeklinde bir tanımlama taptık.
- Adım
url.py içine
url("^post-liste/$",post1_list)
tanımlaması yapılır.
- Adım artık post-list html dosyamızın içinde <body> taglarının arasına
<h1>Selam Django Template</h1>
Kod satırını yazarsak ekrana istediğimizi yazdırmış olacağız.
Burda her seferinde views.py dosyası çalıştırılıyor aslında. Burda istediğimiz şey viewlerdeki veriyi html e aktarmaktır.
Tanımlamamızı şu şekilde düzentiyoruz
def post1_list(request):
merhaba = "Viewden gelen veriler gösteriliyor."
return render(request,'blog-temp/post-list.html',context={'merhaba_degiskeni':merhaba})
daha sonra html dosyamızda çift süslü parantez açınca burada zaten context diye tanımladığımız değişkenler görünmektedir.
<body> tagları arasına {{merhaba_degiskeni }} yazarak çalıştırırsak artık sitemizde viewin içinden veriyi getirip göstermiş oluyoruz.
** Burada çift süslü parantez{{}} içine yazdıklarımız variables(değişkenler) oluyor.
Django HTML Tamplates içinde filter fonksinlarını kullanma
Yukarıdaki {{merhaba_degiskeni }} satırımızda değişken bitimine | dikey çizgisni yazdığımızda fonksiyonlar çıkmaktadır. Biz örneğimizde length fonksiyonunu kullanıp değişkenin uzunluğunu alıyoruz. (Bu arada | dik/dikey çizgisini klavyeden AltGr+<> tuş kombinasyonu yardımıyla yapabiliyoruzJ)
{{merhaba_degiskeni |length}} # yazdığımızda ekrana 35 sayısını yazacaktır.
Templateler hakkında detaylı bilgi için https://docs.djangoproject.com/en/2.1/topics/templates/
Render hakkında detaylı bilgi için https://docs.djangoproject.com/en/2.1/topics/http/shortcuts/
For ve if yapıları
Bloga ait gönderileri listeleyeceğiz
Öncelikle Blog modelimizi viewin içine import ediyoruz
from .models import Blog # en üste yazıyoruz
blog-temp klasörü içine post-list2.html dosyası oluşturuyoruz.
daha sonra viewin içine şu kod bloğunu tanımlıyoruz.
def blog_list(request):
posts = Blog.objects.all()
icerik = {'posts':posts}
return render(request, 'blog-temp/post-list2.html',icerik)
sonra post-list2 html dosyamızda {{posts}} satırını ekliyoruz. Ve html tarafında şöyle bir çıktı elde ediyoruz.
<QuerySet [<Blog: ilk blog>, <Blog: ikinci blog>, <Blog: Şehirler Tanıtım>]>
Queryset halinde tüm bloglarımızı ekrana yazdırmış oluyoruz.
Daha güzel bir şekilde yazdırmak istersek for döngüsü sayesinde yapabiliriz bunu.
Html dosyamızın içeriğini şu şekilde düzenlersek başlık-içerik-oluşturulma tarihi gibi daha güzel bir şekilde çıktı alabiliriz.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>BLOG LİSTESİ</h1>
{% for post in posts %}
<h1>{{ post }}</h1>
<p>{{ post.icerik }} - {{ post.create_date }}</p>
{% endfor %}
</body>
</html>
Şimdi bu html sayfamızda css çalışması yapalım biraz.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div style="margin:0 auto;width:500px">
<h1>BLOG LİSTESİ</h1>
{% for post in posts %}
<h1>{{ post }}</h1>
<p>{{ post.icerik }} - {{ post.create_date }}</p>
{% endfor %}
</div>
</body>
</html>
Bu şekilde yaptığımızda listelediğimiz içeriği sayfada ortalamış oluruz.
Django’da İf yapısı örneği
View.py dosyasında kodumuza sayı diye bir değişken ekledik
def blog_list(request):
posts = Blog.objects.all()
sayi = 10
icerik = {'posts':posts,'sayi':sayi}
return render(request, 'blog-temp/post-list2.html',icerik)
post-list2.html içinide şu şekilde düzenlersek if yapısına basit bir örnek oluşturmuş oluruz.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div style="margin:0 auto;width:500px">
<h1>BLOG LİSTESİ</h1>
{% for post in posts %}
<h1>{{ post }}</h1>
<p>{{ post.icerik }} - {{ post.create_date }}</p>
{% endfor %}
{% if sayi > 10 %}
<p>Selam</p>
{% elif sayi == 10 %}
<p>{{ sayi }}</p>
{% else %}
<p>Hamit</p>
{% endif %}
</div>
</body>
</html>
Django Statik dosyalar ile çalışmak
Statik dosyalar ile alakalı detaylı bilgi için şu adrese gidebilirsiniz
https://docs.djangoproject.com/en/2.1/howto/static-files/
Şimdi kendimce bir şeyler anlatmaya çalışacağım.
Statik dosya: .cs , .css, .jpg vb dosyalar statik dosyalar oluyor.
Settings.py dosyasında STATİC_URL adında statik dosyalarının yoluyu gösteren bir kodumuz var
Djangoda biz appler oluştururuz. Blog app imize static adında bir klasör oluşturduğumuzda django bunun statik dosyaları barındırmak için oluşturulduğunu biliyor.
Bu sistemde statik dosya arayacağın zaman ‘static klasörüne bak demek için önce projemize static diye bir klasör ekliyoruz.
Settings.py dosyasına
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
]
Kodlarını ekliyoruz.
Aynı zamanda bütün statik dosyaları static_root içinde barındırdığımızı söylemek için settings.py dosyasına
STATIC_ROOT =os.path.join(BASE_DIR,'static_file')
Kodunu ekleyip terminalden python manage.py collectstatic kodunu çalıştırıyoruz. Böylelikle admin panelinin de tüm static dosyaları static_file klasörünün altına geldi.
Şimdi STATIC_URL = '/static/'
Satırında belirtilen url nin nereye bağlı olduğunu belirtmem gerekiyor. Django_blog daki ana urls.py içine bir tanımlama yapmamız gerekiyor.
Urls.py içine
from django.conf import settings
from django.conf.urls.static import static
import ediyoruz. Daha sonra aynı dosya içine
urlpatterns +=static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)
kodlarınıda ekledikten sonra işlem tamamlanmış olur.
Görmek istiyorsak admin sayfasında sayfayı incele dedikten sonra head içinde css dosyaların dolunun static ile başladığını görebilirsiniz.