search

Flask sử dụng phiên bản Bootstrap nào?

Ngày đăng: 29/01/2023
Trả lời: 0
Lượt xem: 163

Python Flask là một micro-framework để tạo các ứng dụng web. Nó rất nhẹ và dễ bắt đầu, và cũng rất phổ biến. Vì Flask là một khung web, nên làm việc với nó sẽ yêu cầu kiến ​​thức về HTML

Show

Tuy nhiên, bản thân HTML rất hạn chế về những gì nó có thể làm đối với sự xuất hiện của một trang web. Chắc chắn, nó kiểm soát cấu trúc cơ bản và điều đó rất quan trọng, nhưng cần nhiều hơn nữa để tạo ra các thiết kế hấp dẫn sẽ thu hút người dùng của bạn và khiến họ muốn sử dụng trang web của bạn cho bất kỳ mục đích nào mà bạn đã tạo ra nó.

Chìa khóa để kiểm soát sự xuất hiện của một trang web là CSS – Cascading Style Sheets. CSS xác định cách hiển thị các phần tử HTML. Nó là một công cụ mạnh mẽ, nhưng nó đòi hỏi khá nhiều thời gian học tập để trở nên thành thạo trong

Tuy nhiên, có một lối tắt nếu bạn muốn tạo các trang web trực quan tuyệt đẹp với số lượng CSS tối thiểu

Sử dụng Bootstrap 4 với Python Flask

Trong bài viết này, chúng ta sẽ tìm hiểu cách tạo trang web 1 trang bằng Python Flask và Bootstrap 4, làm bàn đạp để bạn khám phá thế giới tuyệt vời của các ứng dụng Web Python dễ tạo kiểu. Hãy bắt đầu

  • Nếu bạn chưa làm như vậy, hãy cài đặt Flask từ dòng lệnh bằng cách sử dụng pip install flask trên Windows hoặc pip3 install flask trên Mac/Linux
  • Tạo một thư mục mới có tên “Python Flask Bootstrap Demo” ở đâu đó thuận tiện trên máy tính của bạn
  • Tạo một tệp có tên là app.py
  • Thêm các nội dung sau
from flask import Flask, render_template app = Flask(__name__) @app.route("/") def main(): return render_template('index.html') if __name__ == "__main__": app.run()
  • Tạo một thư mục có tên templates bên trong thư mục hiện tại
  • Tạo một tệp mới có tên là index.html
  • Thêm mã HTML demo sau, được điều chỉnh từ trang web w3schools
 
 
 
 
 
 
 
 
.fakeimg { height: 200px; background: #aaa; }

Python Flask & Bootstrap 4

Resize this responsive page to see the effect!

About Me

Photo of me:
Fake Image

Some text about me in culpa qui officia deserunt mollit anim..

Some Links

Lorem ipsum dolor sit ame.

TITLE HEADING

Title description, Dec 7, 2017
Fake Image

Some text..

Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.

TITLE HEADING

Title description, Sep 2, 2017
Fake Image

Some text..

Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.

Footer

  • Chạy app.py
  • Bạn sẽ thấy một thông báo như thế này
Serving Flask app "flask-hello" (lazy loading) Environment: production WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead. Debug mode: off Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
  • Điều hướng đến http://127.0.0.1:5000/ trong trình duyệt của bạn và chắc chắn sẽ có trang chủ Bootstrap 4 Demo của bạn, được cung cấp bởi Python Flask

Chi tiết về cách thức hoạt động của Flask không phải là chủ đề của bài viết này, nhưng có rất nhiều thông tin trực tuyến dành cho những người tò mò và chúng tôi có thể sẽ đề cập đến Flask tại đây trên Compucademy trong tương lai gần

Điều tôi muốn làm ở đây là khuyến khích bạn khám phá mã soạn sẵn được cung cấp và bắt đầu hiểu cách thức hoạt động của nó. Bạn nên thay đồ, đập vỡ đồ, di chuyển đồ xung quanh và nói chung là làm bẩn tay bạn. Sẽ mất một chút thời gian để trở nên thành thạo với Bootstrap, nhưng sẽ rất nhanh chóng và dễ dàng để tạo ra các thiết kế đẹp khi bạn đã hiểu một số kiến ​​thức cơ bản

Để giúp bạn bắt đầu, đây là một vài gợi ý