Flask ile Verileri HTML Sayfasında Gösterme

0 0
Okuma Süresi:2 Dakika, 12 Saniye

Bir önceki yazımızda basit bir Flask uygulamasının nasıl yapılabileceğini göstermiştik. O uygulamada HTML sayfasının nasıl ekrana yansıtılacağını görmüştük. Ancak Flask uygulamamızdaki bir verinin HTML sayfasının içinde gösterilmesi için ne yapacağımızı göstermemiştik. Bu yazıda bu konuyu küçük bir örnek ile işleyeceğiz. Önceki yazımıza ulaşmak için buraya tıklayabilirsiniz.

Flask framework’ünün html dosyalarımızı algılayabilmesi için proje dizinimizde templates adında bir klasör oluşturmamız gerekmektedir. Proje dizinimiz yandaki gibidir.

İşe index.html sayfasını tarayıcıda göstermekle başlayalım. Bunu yapabilmek için render_template() fonksiyonunu kullanacağız. Ancak ilk olarak index.html dosyasının içeriğine bakalım. Ardından Flask uygulamasındaki kodlara bakalım.

<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Flask'tan HTML Context Gönderme</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
    <h1>Başlangıç Sayfası</h1>
</body>
</html>

HTML sayfamızda, sayfanın başlığı ve body kısmında h1 etiketleri içinde “Başlangıç Sayfası” adlı yazı bulunmaktadır. Eğer bu dosyayı çalıştırırsanız, tarayıcınızda “Başlangıç Sayfası” yazısını görürsünüz.

# Flask Uygulaması
from flask import Flask, render_template

app = Flask(__name__)

@app.route("/")
def index():
        return render_template("index.html")

if __name__ == "__main__":
    app.run(debug=True)

index.html sayfamızı Flask uygulamamız içinde nasıl kullanabileceğimizi görmüş olduk. Ancak ben bana gelen /about request’inde tarayıcıda “Hakkımızda Sayfası”, /contact request’inde “İletişim Sayfası” ve / request’i geldiğinde ise “Başlangıç Sayfası” yazısını göstermek istiyorum. Bunu yapabilmek için gelen request’e göre html sayfasına Hakkımızda, İletişim ve Başlangıç string ifadelerini yollayacağım ve HTML sayfasında bu ifadeleri kullanarak dinamik bir sayfa elde etmiş olacağım. Gelin kodlara bakalım.

from flask import Flask, render_template

app = Flask(__name__)

@app.route("/")
def index():
        return render_template("index.html", title="Başlangıç")

@app.route("/about")
def about():
        return render_template("index.html", title="Hakkımızda")

@app.route("/contact")
def contact():
        return render_template("index.html", title="İletişim")

if __name__ == "__main__":
    app.run(debug=True)

Yukarıda gördüğünüz gibi render_template() fonksiyonun içinde title adında bir değişken oluşturdum ve bu değişkene çeşitli string ifadeleri eşitledim. Bu değişken adını HTML sayfasında kullanarak buradan göndermiş olduğum değerleri kullanabileceğim. Gelin HTML dosyasındaki yaptığımız değişikliğe bakalım.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Flask'tan HTML Context Gönderme</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
    <h1>{{ title }} Sayfası</h1>
</body>
</html>

Flask uygulamamızdan göndermiş olduğumuz title değişkenini {{ }} blokları arasına yazarak HTML sayfasında title değişkeninin değerini yansıtmış oluyoruz. Bu özelliği bize Jinja2 Template sağlamaktadır. Bu sayede HTML sayfamıza veriler yollayarak daha dinamik web sayfaları oluşturma yolunda bir adım daha atmış oluyoruz.

Flask ders listesine ulaşabilmek için tıklayınız.

Umarım sizin için faydalı bir yazı olmuştur. Bilgi her zaman paylaşılmalıdır.

Happy
Happy
0 %
Sad
Sad
0 %
Excited
Excited
0 %
Sleepy
Sleepy
0 %
Angry
Angry
0 %
Surprise
Surprise
0 %

Enes Sönmez

Lise eğitimimi Otocenter Mesleki ve Teknik Anadolu Lisesi’nde tamamladım. Bilgisayar programcılığı ve veri tabanı bölümü üzerine liseyi bitirdim. 2017 yılında Karadeniz Teknik Üniversitesi Bilgisayar Mühendisliği bölümünü kazandım. Hala eğitim hayatımı burada sürdürmekteyim. Makine öğrenmesi, derin öğrenme, görüntü işleme ve veri bilimi üzerine çalışmaktayım. Ek olarak Deep Learning Türkiye ve KTÜ Yapay Zeka Topluluğu üyesiyim.

Average Rating

5 Star
0%
4 Star
0%
3 Star
0%
2 Star
0%
1 Star
0%

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir