Flask-Bootstrap: Tambahkan templat pada aplikasi Flask

Flask-Bootstrap: Menambah templat untuk aplikasi Flask

Flask ialah rangka kerja web Python ringan yang menyediakan cara mudah dan fleksibel untuk membina aplikasi web. Ia adalah rangka kerja yang sangat popular, tetapi templat lalainya mempunyai fungsi terhad. Untuk mencipta antara muka pengguna yang menarik, gunakan rangka kerja atau perpustakaan tambahan. Di sinilah Flask-Bootstrap masuk.

Flask-Bootstrap ialah sambungan Flask berdasarkan Twitter Bootstrap, yang menjadikan penambahan templat mudah dan pantas. Bootstrap ialah rangka kerja CSS popular yang dibangunkan oleh Twitter. Ia menyediakan komponen dan gaya UI untuk tapak web dan aplikasi web, supaya anda boleh menjadikan aplikasi anda kelihatan hebat dan mudah digunakan.

Flask-Bootstrap menyediakan aplikasi Flask anda dengan sumber yang diperlukan dengan membenamkan fail CSS dan JavaScript Bootstrap ke dalam aplikasi anda. Pada masa yang sama, ia menyediakan penyepaduan Flask yang boleh digunakan untuk menambah komponen UI Bootstrap pada aplikasi.

Langkah pertama untuk menggunakan Flask-Bootstrap ialah memasangnya. Untuk memasang Flask-Bootstrap, jalankan arahan berikut dalam baris arahan:

pip install flask-bootstrap

Setelah pemasangan selesai, anda perlu memulakannya dalam aplikasi Flask anda. Ini boleh dilakukan dengan mencipta objek Bootstrap terus dalam aplikasi:

from flask import Flask
from flask_bootstrap import Bootstrap

app = Flask(__name__)
bootstrap = Bootstrap(app)

@app.route('/')
def index():
    return 'Hello World!'

Dalam contoh ini, kami mencipta aplikasi Flask dan memulakan Flask-Bootstrap dalam aplikasi. Kami kemudiannya mentakrifkan fungsi paparan ringkas pada laluan akar aplikasi ('/').

Sekarang, mari tambah komponen Bootstrap pada fungsi paparan.

Pertama, anda perlu menambah kod Bootstrap yang berkaitan dalam templat HTML. Ini biasanya serupa dengan kandungan HTML standard, tetapi mengandungi kelas Bootstrap dan atribut lain. Berikut ialah contoh mudah templat HTML:

{% extends "bootstrap/base.html" %}

{% block content %}
<div class="container">
    <div class="row">
        <div class="col-md-6 offset-md-3">
            <h1>Hello, World!</h1>
        </div>
    </div>
</div>
{% endblock %}

Dalam templat ini, kami menggunakan sistem grid Bootstrap untuk mencipta reka letak lajur. Kami juga menggunakan kelas Bootstrap lain untuk menggayakan pengepala.

Seterusnya, anda perlu mencipta fungsi paparan Flask yang menghantar respons kepada pengguna dengan memaparkan templat HTML. Berikut ialah contoh mudah:

from flask import render_template

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

Dalam fungsi paparan ini, kami menggunakan fungsi render_template Flask untuk memaparkan templat dan menghantarnya semula kepada pengguna.

Kini apabila anda mengakses fungsi paparan ini, anda akan melihat gaya Bootstrap yang bagus "Hello, World!" Ia mudah, bukan?

Dalam siaran ini, kami melihat cara mengintegrasikan Bootstrap ke dalam aplikasi Flask menggunakan Flask-Bootstrap. Ia menjadikan penambahan templat menjadi cepat dan mudah, menjadikan apl anda kelihatan hebat dan mudah digunakan. Jika anda sedang membangunkan aplikasi Flask dan ingin menambah gaya dan komponen Bootstrap yang cantik, cuba Flask-Bootstrap!

Atas ialah kandungan terperinci Flask-Bootstrap: Tambahkan templat pada aplikasi Flask. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!