Template Inheritance এবং Blocks

Flask Templating এবং Jinja2 - ফ্লাস্ক (Flask) - Web Development

315

Flask-এ Template Inheritance এবং Blocks এর মাধ্যমে আপনি HTML টেমপ্লেটগুলো পুনরায় ব্যবহারযোগ্য এবং মডুলার করতে পারেন। এই দুটি ফিচার Flask-এ Jinja2 টেমপ্লেট ইঞ্জিনের অংশ হিসেবে কাজ করে, যা আপনাকে HTML ফাইলগুলির মধ্যে সাধারণ কাঠামো বা অংশ শেয়ার করতে সাহায্য করে। এটি কোড পুনঃব্যবহারযোগ্যতা বাড়ায় এবং ডেভেলপমেন্টে অনেক সময় বাঁচায়।


১. Template Inheritance (টেমপ্লেট ইনহেরিট্যান্স)

Template Inheritance আপনাকে একটি বেস টেমপ্লেট তৈরি করতে দেয় এবং তারপর সেই বেস টেমপ্লেটকে একাধিক চাইল্ড টেমপ্লেটে ব্যবহার করতে পারবেন। এইভাবে আপনি সাধারণ কাঠামো (যেমন header, footer, sidebar ইত্যাদি) এক জায়গায় লিখে অন্য টেমপ্লেটে সহজেই ব্যবহার করতে পারেন।

উদাহরণ:

ধরা যাক আমাদের একটি বেস টেমপ্লেট থাকবে, যার নাম base.html

1.1 বেস টেমপ্লেট (base.html)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}My Flask App{% endblock %}</title>
</head>
<body>
    <header>
        <h1>Welcome to My Website</h1>
        <nav>
            <a href="/">Home</a> |
            <a href="/about">About</a>
        </nav>
    </header>

    <div>
        {% block content %}
        <!-- Child templates will fill in the content here -->
        {% endblock %}
    </div>

    <footer>
        <p>© 2024 My Flask App</p>
    </footer>
</body>
</html>

এখানে:

  • {% block title %}: এটি একটি ব্লক, যার মধ্যে ডিফল্ট কন্টেন্ট দেওয়া হয়েছে। চাইল্ড টেমপ্লেটে এটি ওভাররাইড করা যাবে।
  • {% block content %}: এটি আরেকটি ব্লক, যেখানে মূল কন্টেন্ট থাকবে এবং এটি চাইল্ড টেমপ্লেটে পরিবর্তন করা যাবে।
1.2 চাইল্ড টেমপ্লেট (home.html)
{% extends "base.html" %}

{% block title %}Home - My Flask App{% endblock %}

{% block content %}
    <h2>Home Page</h2>
    <p>This is the home page content.</p>
{% endblock %}

এখানে:

  • {% extends "base.html" %}: চাইল্ড টেমপ্লেট base.html টেমপ্লেটটিকে ইনহেরিট করেছে।
  • {% block title %} এবং {% block content %}: চাইল্ড টেমপ্লেট এই ব্লকগুলোকে ওভাররাইড করেছে।

১.৩ Flask অ্যাপ্লিকেশনে টেমপ্লেট ইনহেরিট্যান্স ব্যবহার করা

from flask import Flask, render_template

app = Flask(__name__)

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

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

এটি / রুটে home.html টেমপ্লেট রেন্ডার করবে, এবং যেহেতু এটি base.html ইনহেরিট করছে, সেখানে থাকা header, footer ইত্যাদি অংশও দেখানো হবে।


২. Blocks (ব্লকস)

Blocks হলো একটি টেমপ্লেটের অংশ যা Template Inheritance-এর সাথে কাজ করে এবং যেখানে চাইল্ড টেমপ্লেট কন্টেন্ট প্রদান করে। ব্লকগুলির মাধ্যমে আপনি টেমপ্লেটের অংশকে ডাইনামিকভাবে পরিবর্তন করতে পারেন।

ব্লক ব্যবহার করার উপায়:

২.১ ব্লক তৈরির উদাহরণ
{% block header %}
    <h2>This is a custom header</h2>
{% endblock %}

এখানে {% block header %} একটি ব্লক তৈরি করেছে। চাইল্ড টেমপ্লেটে এই ব্লকটি ওভাররাইড করা যেতে পারে।

২.২ একমাত্র ব্লক পরিবর্তন করা
{% block content %}
    <p>Customized content goes here!</p>
{% endblock %}

এটি চাইল্ড টেমপ্লেটে ব্যবহার করার সময় কন্টেন্ট পরিবর্তন করতে ব্যবহৃত হয়।


৩. Flask অ্যাপ্লিকেশন উদাহরণ

এখন পুরো Flask অ্যাপ্লিকেশন উদাহরণ দেখলে, যেখানে base.html এবং home.html টেমপ্লেট ব্যবহার হচ্ছে।

৩.১ Flask অ্যাপ (app.py)

from flask import Flask, render_template

app = Flask(__name__)

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

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

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

৩.২ বেস টেমপ্লেট (base.html)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}My Flask App{% endblock %}</title>
</head>
<body>
    <header>
        <h1>Welcome to My Flask Website</h1>
        <nav>
            <a href="/">Home</a> |
            <a href="/about">About</a>
        </nav>
    </header>

    <div>
        {% block content %}
        <!-- Child templates will fill in the content here -->
        {% endblock %}
    </div>

    <footer>
        <p>© 2024 My Flask App</p>
    </footer>
</body>
</html>

৩.৩ হোম টেমপ্লেট (home.html)

{% extends "base.html" %}

{% block title %}Home - My Flask App{% endblock %}

{% block content %}
    <h2>Home Page</h2>
    <p>This is the home page of my website!</p>
{% endblock %}

৩.৪ অ্যাবাউট টেমপ্লেট (about.html)

{% extends "base.html" %}

{% block title %}About Us - My Flask App{% endblock %}

{% block content %}
    <h2>About Us</h2>
    <p>This page provides information about our website.</p>
{% endblock %}

Flask-এ Template Inheritance এবং Blocks ব্যবহার করা আপনার HTML টেমপ্লেটগুলো পুনঃব্যবহারযোগ্য ও মডুলার করতে সহায়ক। এর মাধ্যমে আপনি একটি সাধারণ কাঠামো তৈরি করে বিভিন্ন পৃষ্ঠায় এটি ব্যবহার করতে পারবেন, এবং বিশেষ অংশের কন্টেন্ট পরিবর্তন করতে পারবেন। এটি অ্যাপ্লিকেশন কোডের পুনঃব্যবহারযোগ্যতা এবং রিডেবিলিটি উন্নত করে।

Content added By
Promotion

Are you sure to start over?

Loading...