Menü

Blueprint ve Bootstrap ile Flask Uygulaması ve Flask Proje Düzeni

  • Ana
  • Diğer
  • Blueprint ve Bootstrap ile Flask Uygulaması ve Flask Proje Düzeni

flask app flask project layout with blueprint bootstrap

Sorunları Ortadan Kaldırmak Için Enstrümanımızı Deneyin

Bu eğitim, Flask projesinde Flask Uygulaması, Flask Blueprint ve Flask Bootstrap'in nasıl kullanılacağını açıklar:

Bu konuda, Flask Blueprints anlayışımızı geliştirmek için Flask-Appbuilder arketipinden biraz uzaklaşacağız. MongoDB, SQLite ve MySQL gibi Veritabanları ile Flask, Flask Şablonları ve Görünümleri ve Flask hakkındaki eğitimimizi okuyun. FlaskTutorialApp adında bir örnek proje kullanıyoruz.

Bununla birlikte, flask fab create-app komutunu kullanarak projeyi sıfırdan da oluşturabilirsiniz. Bu komut, sizin tarafınızdan verilen uygulama adına bağlı olarak bir uygulama diziniyle birlikte bir Flask projesi için gerekli olan iskeleyi oluşturur.

=> Herkes İçin Flask Eğitim Serisine Bakın

Blueprint ve Bootstrap 1 ile Flask Proje Düzeni

Bu eğitimde Flask Uygulaması, Flask Blueprint ve Flask Bootstrap hakkında bilgi vereceğiz. Flask uygulamamızı ilk olarak Flask-Appbuilder tarafından sağlanan önceden mevcut iskele ile geliştiriyoruz. Daha sonra hello2 adında bir Flask Blueprint oluşturuyoruz. Son olarak, Flask Uygulamamızı dockerize ederek Flask Docker konseptini açıklayacağız.

Ne öğreneceksin:

Flask Uygulaması

Flask Uygulaması, Flask Uygulaması için başka bir isimdir. __İnit__.py dosyasında yazılı kodu fark ederseniz, bir Flask örneğinin oluşturulduğunu ve değişkenin app olarak adlandırıldığını fark edeceksiniz. Flask sınıfının örneği, WSGI uygulamasının örneği olan Flask Uygulamasıdır.

from flask import Flask app = Flask(__name__)

Flask Blueprint

Flask Blueprint, ilgili özellikleri bir arada tutmamızı sağlar ve daha iyi geliştirme uygulamalarına yardımcı olur. Flask Blueprints'in faydalarından bazıları şunlardır:

  1. Büyük ölçekli uygulamaların kolay organizasyonu.
  2. Aynı Blueprint'i birden çok kez kaydederek kodun yeniden kullanılabilirliğini artırır.
  3. Bir dizi işlem kaydedilir ve bir plan kaydedildikten sonra tekrar oynatılabilir.

Flask Blueprint üzerine verilen yukarıdaki arka planla, ilerleyebilir ve ilk Taslağımızı tasarlayabiliriz. Blueprint'i de bir modül olarak düşünebiliriz. Bir HelloWorld planı oluşturalım.

Bir planın tüm bileşenleri, kaynakları ve özellikleri, Flask uygulamasının diğer kaynak kodundan ayrı tutulur ve düzenlenir. Bu, bir Flask Blueprint'in görünümlerine, formlarına, modellerine, statik dosyalarına ve şablonlarına sahip olabileceği anlamına gelir.

Aynı kaynak kümesinden birden fazla Taslak oluşturabilirsiniz. Bununla birlikte, bu muhtemelen kafa karışıklığı yaratacaktır ve iyi bir uygulama değildir.

Flask Blueprint Dosyaları ve Dizinler Oluşturun

Hello2 adıyla bir Flask Blueprint oluşturmaya başlayalım. Uygulama dizinine gittikten sonra venv / bin / activ'i kullanarak sanal ortamınızı etkinleştirdikten sonra dizin yapısını oluşturmak için aşağıda verilen komut dosyasını kullanın.

blueprint_name='hello2' mkdir '$blueprint_name' mkdir -p '$blueprint_name/templates/$blueprint_name' touch '$blueprint_name/templates/$blueprint_name/hello.html' mkdir '$blueprint_name/static/' touch '$blueprint_name/__init__.py' touch '$blueprint_name/views.py'

Hello2 Blueprint'imizin __init__.py dosyasına aktaracağımız görünümlerine sahip olmasını istiyoruz. Blueprint'imiz için sırasıyla Flask görünümlerini işlemek ve statik kaynakları sunmak için şablonlar ve statik dizinlerle ayrı bir dizin oluşturuyoruz.

Flask Blueprint Dizin Yapısı

Taslak için dizin yapısı aşağıda gösterildiği gibi görünmelidir. Benzer bir çıktı oluşturmak için ağaç komutunu kullanın.

Flask Blueprint dizin yapısı

manuel testte web uygulaması için test senaryoları
Create Flask Blueprint View

Şimdi, views.py içinde basit bir görünüm tanımlayalım. Hello2 / views.py dosyasını açın ve aşağıda verilen kod parçacığını girin.

from flask import Blueprint, render_template hello2 = Blueprint( 'hello2', __name__, template_folder='templates', static_folder='static' ) @hello2.route('/hello2') def hello2_view(): greeting = 'Hello World 2' return render_template('hello2/hello.html', greeting=greeting)

Blueprint sınıfını ve render_template yöntemini içe aktarıyoruz. Daha sonra şablon ve statik dizinlerin isimlerini vererek bir Blueprint nesnesi oluşturuyoruz.

Ardından decorator @ hello2.route ve hello2_view adında bir controller kullanarak bir yol tanımlarız. Bu denetleyici bir Python işlevidir. Bu işlevde, selamlama adlı bir değişkene bir değer atarız ve ardından bunu render_template yöntemine geçiririz.

Flask Blueprint Şablonu Oluşturun

Şimdi hello.html şablonunu oluşturalım. Önceki eğitimlerimizi okuyorsanız, şablonun HelloWorld görünümünü yeniden oluşturmak için oluşturduğumuz adla aynı olduğunu fark etmiş olmalısınız. Bu hello2 Blueprint için, bir öncekini genişleterek yeni bir şablon oluşturuyoruz.

Dahası, şablonda selamlamayı oluşturmak için render_template'i çağırırken semantik bir hello2 / hello.html yolu kullandığımıza dikkat edin. Bu kalıp, aynı isme sahip şablonlar arasındaki çatışmaları önler.

Hello.html oluşturmak ve hello2 / templates / hello2 / path altına kaydetmek için aşağıda verilen kod parçacığını kullanın.

{% extends 'hello.html' %} {% block hello %}

{{ greeting }} , from Software Testing Help.

{% endblock %}

Bu şablon neredeyse hello.html'ye benzer. Ancak HTML parçalarının çoğunu hello.html'den devralır. {% Block hello%} ve {% endblock%} kullanımına dikkat edin. Hello2 / hello.html'deki merhaba bloğu, hello.html temel şablonunun merhaba bloğunu geçersiz kılar.

Şimdi merhaba2 Blueprint'in __init__.py dosyasını açalım ve aşağıda verilen koddan bahsedelim.

from app.hello2.views import * # expose all views at the blueprint level

Bu açıklamada, hello2 Blueprint'in views.py dosyasında oluşturduğumuz tüm dekore edilmiş yöntemleri içe aktarıyoruz. Gerekirse, yalnızca kullanıma veya test edilmeye hazır yöntemleri / denetleyicileri içe aktarabiliriz.

Flask Uygulaması ile Flask Planını Kaydedin

Şimdi, __init__.py'yi Flask uygulama dizini altında açalım ve aşağıdaki kodda gösterildiği gibi hello2 Blueprint'imizi kaydettirelim.

from app.hello2 import hello2 app.register_blueprint(hello2, url_prefix='/hello2')

Burada ayrıca, görünümleri seçerek içe aktarabileceğimizi ve yalnızca kullanıma veya test edilmeye hazır olanları kaydedebileceğimizi lütfen unutmayın.

Flask uygulamamızı projenin kök dizininden python run.py komutuyla hata ayıklama modunda çalıştıralım ve hello2 görünümünün düzgün çalışıp çalışmadığını görmek için http: // localhost: 8080 / hello2'ye gidelim.

Tarayıcıdaki sonuç, aşağıda gösterilen örneğe benzer olmalıdır.

HelloWorld2_View Örneği
Hello2 taslak görünümü

Twitter’ın önyükleme çerçevesini kullanarak merhaba2 planının daha iyi bir sunumu üzerinde çalışalım. Ayrıca, sonraki bölümde, bir Flask Taslağının davranışını değiştirmek için isteğe bağlı parametreler hakkında daha fazla bilgi edineceksiniz. Flask Bootstrap adlı bir Flask Blueprint örneğinin yardımıyla görelim.

Flask Blueprint ile Modüler Flask Uygulama Örneği

Hello2 Flask Blueprint öğrenmemize dayanarak, Flask'ta modüler uygulamaları nasıl oluşturabileceğimizi anlamak için biraz daha plan ekleyelim.

Ziyaretçilere e-kitaplar, öğreticiler ve kurslar şeklinde içerik sunan bir web uygulamamız olduğunu varsayalım. Ekip hakkında bilgilerle ilgili bazı ek içeriğe ve bir ana sayfaya sahiptir.

Bu yeni özellikleri mevcut uygulamada barındırmaya çalışırsak, bu durumda views.py'de görünümler ve uygulama şablonu dizini altında karşılık gelen şablonları oluşturmamız gerekecektir. Benzer şekilde, models.py ve forms.py'de modeller ve formlar oluşturmamız gerekiyor.

Bununla birlikte, tüm uygulama kodunu korumak zahmetli hale gelecektir ve diğer ekip üyeleriyle işbirliği çok karmaşık hale gelecektir ve bu durum, yürütme çatışmalarına veya karmaşık geliştirme iş akışına neden olabilir.

Şu anda, bu geleneksel yaklaşımda, uygulama yapısı aşağıda gösterildiği gibidir.

Konvansiyonel yaklaşım

Böyle bir senaryodan kaçınmak için, özelliklere ve ilgili içeriğe özgü modüller oluşturmak için Flask Taslaklarını kullanabiliriz. Ayrı kaynaklarla bazı Flask Taslakları oluşturalım.

Flask Blueprint düzenlerinin her biri aşağıda gösterilene benzer görünecektir.

Flask Blueprint düzenleri

Planlanan Flask Taslakları için gerekli dosyaları ve dizinleri oluşturmak için aşağıda verilen komut dosyasını kullanın. Bu komut dosyasını projenin kök dizininden çalıştırın.

cd app for dir in home courses tutorials ebooks do echo 'generating files for $dir ..' mkdir -p $dir/templates/$dir touch $dir/templates/$dir/$dir.html mkdir $dir/static touch $dir/static/style.css touch $dir/__init__.py touch $dir/views.py touch $dir/models.py touch $dir/forms.py done

Öncelikle ev modülü için özellikler oluşturalım.

Ana dizinin altındaki views.py dosyasını açın ve aşağıda verilen kodla güncelleyin.

from flask import render_template, Blueprint home = Blueprint('home', __name__, template_folder='templates', static_folder='static') @home.route('/') def index(): return render_template('home/home.html')

Bu dosyada, Flask’ın Blueprint sınıfını içe aktardık ve ayrı şablonlar ve statik bir klasörle gerekli parametrelerle somutlaştırdık. Daha sonra indeks adı verilen görüntüleme yönteminin ilişkili yolunu bildirmek için @ ev dekorasyonunu kullanırız.

Şimdi uygulamanın şablon dizini altında bir base.html Jinja2 şablonu oluşturun. Dosyayı güncellemek için aşağıda verilen kodu kullanın.

from Software Testing Help.

Learn More >> {% endblock %}

Bootstrap’ın base.html'sini genişlettik. Sınıf kapsayıcısının ve kahraman-biriminin div kullanımına dikkat edin. Dahası, kullanıcıların daha fazlasını öğrenmesi için bir düğme oluşturduk. Bu HTML'yi değiştirdik ve Twitter’ın Bootstrap çerçevesindeki sınıfları kullandık.

Hello2.html'nin değiştirilmiş görünümünü görmek için tarayıcıda http: // localhost: 8080 / hello2.html adresindeki sayfayı şimdi yenileyin.

Değiştirilmiş Merhaba2 görünümü, aşağıda gösterilene benzer görünecektir.

HelloWorld2_View_Bootstrap
Bootstrap ile Hello2 görünümü

Flask-Bootstrap'in kullanımı tamamen geçersiz kılma veya değiştirme için mevcut olan bloklara bağlıdır. Deneyimi özelleştirmek için aşağıda belirtilen blokları kullanabiliriz. Tüm olası blokların ayrıntılı bir listesi https://pythonhosted.org/Flask-Bootstrap/basic-usage.html adresinde görülebilir.

Bazen bir bloğu tamamen değiştirmek yerine değiştirmek istediğimizde, sonuçları elde etmek için Jinja2’nin super () işlevini kullanabiliriz.

Hello2 / static altında hello2.css adlı bir dosya oluşturun ve hello2 / hello.html içindeki paragrafın rengini biçimlendirmek için aşağıdaki kod parçacığını yerleştirin.

p { color: orange; }

Aşağıda gösterilen kod parçacığını alın ve hello2 / hello.html içine yerleştirin.

{% block styles } {{ super() }} {% endblock %}

Şimdi, Flask Blueprint hello2'nin views.py dosyasını açın ve plan ifadesini aşağıda gösterildiği gibi değiştirin.

hello2 = Blueprint('hello2', __name__, template_folder='templates', static_folder='static')

Flask Blueprint’in kayıtlı URL’sine gidin, yani http: // localhost: 8080 / hello2 tekrar. Şimdiye kadar yapılan değişikliklerin sonucu aşağıda gösterildiği gibi görünmelidir.

Hello2 Görünümü Değiştirildi
Hello2 Görünümü Değiştirildi

Flask Docker

Docker, bir uygulamayı konteyner haline getirmeye yardımcı olur. Flask uygulamasının ihtiyaç duyduğu ortamı, sanal makineler gibi eksiksiz sanallaştırılmış ortamlara ihtiyaç duyulmayacak şekilde izole eder.

Ayrıca, docker container'ları minimum ayak izine sahiptir ve bir düzenleme platformunun yardımıyla yönetilmesi ve ölçeklenmesi daha rahattır. Diğer her uygulamanın kapsayıcıya alınmış dağıtıma sahip olduğu bu günlerde, örnek uygulamamızı bir docker kapsayıcı olarak dağıtmayı öğrenmemiz gerekiyor.

Linux tabanlı bir kapsayıcı Windows ve bir MAC üzerinde çalışabilir. Dockerized Flask Uygulaması, bu nedenle, içinde kurulu olduğu İşletim sisteminden bağımsız olarak herhangi bir işletim sisteminde konuşlandırılabilir.

Bu bölümde, bir Flask uygulamasını yerleştirme adımlarını açıklayacağız. Bu projeyi, içinde paketlenmiş tüm bağımlılıkların bulunduğu bir konteynerde konuşlandırılabilmesi için dockerize edeceğiz.

İlk, Docker'ı yükle makinenizde.

sudo apt-get install docker.io

Kurulum tamamlandıktan sonra, örnek projemizin kök dizinine gidin ve bir Dockerfile oluşturun.

Aşağıda verilen kodu bu Dockerfile'a yazın.

FROM python:3 ADD . /flaskTutorialApp WORKDIR /flaskTutorialApp RUN pip install -r requirements.txt ENTRYPOINT ('python') CMD ('run.py')

Config.py dosyasını güncelleyin ve aşağıda gösterildiği gibi veritabanını SQLite olarak değiştirin.

# The SQLAlchemy connection string. SQLALCHEMY_DATABASE_URI = 'sqlite:///' + os.path.join(basedir, 'app.db') # SQLALCHEMY_DATABASE_URI = 'mysql://myapp@localhost/myapp'

Ayrıca, bu öğretici dizide SQLite ile ilk kez çalışıyorsanız, lütfen flask fab create-admin komutunu kullanarak yönetici kullanıcı oluşturun.

Yönetici kullanıcının uygulamada oturum açıp açamadığını kontrol edin.

Şimdi aşağıdaki komutu kullanarak örnek uygulamamızın docker görüntüsünü oluşturun.

sudo docker build --tag flask-tutorial

Bu komut, kaynakları docker hub'dan indirirken biraz zaman alır. Bu komut tamamlandıktan sonra, aşağıdaki komutu kullanarak görüntülerin göründüğünü kontrol edin.

örnek tablolarla veritabanında normalleştirme
sudo docker images

Şimdi bu yeni oluşturulan Docker görüntüsünü çalıştırın.

sudo docker run -p 5001:8080 flask-tutorial:latest

Konsol, geliştirme sunucusunun günlük mesajlarını gösterecektir.

Docker kurulumu, docker0 adıyla sanal bir NIC oluşturulmasıyla sonuçlanır. Sudo ifconfig komutunu kullanarak IP adresini bulun. Docker IP'sini aldıktan sonra, aşağıda verilen URL'ye giderek uygulamaya erişebilirsiniz.

http: //: 5001

Uygulamanın geliştirilmesinden emin olduğunuzda, diğerlerinin indirmesi ve kullanması için Docker görüntünüzü Docker Hub'a dağıtabilirsiniz.

Şişe Taslağının Test Edilmesi

Şimdi Blueprint hello2'yi test etmek için birkaç test oluşturalım. Örnek uygulamamızın, istemci / hello2 uç noktasındaki kaynaklar için bir Get isteği gönderip göndermediğinde doğru HTTP kodunu döndürüp döndürmediğini görelim. Hatırlarsanız, Flask Blueprint hello2'mizi / hello2 değerine sahip bir url_prefix ile kaydettik.

Testler altında test_blueprint.py adlı bir dosya oluşturun ve aşağıdaki testi buna ekleyin.

def test_hello2(client): resp = client.get('/hello2') assert 308 == resp.status_code

HTTP 308, Permanent Redirect ile ilgilidir ve Flask uygulamamızın, isteği, Blueprint ile ilgili hello2 adlı kaynaklara yeniden yönlendirmesi beklenir.

Şimdi Taslağımızın kaynaklarının kök yolunu kontrol etmek için başka bir test ekleyelim. Değeri olup olmadığını görmek için bir test ekleyelim.

from app.hello2 import hello2 def test_rootpath(): assert hello2.root_path is not None

Şimdi, başarılı olduklarından emin olmak için bu testleri diğer testlerle birlikte çalıştıralım.

pytest -v

Aşağıda gösterildiği gibi, test sonuçlarının benzer bir çıktısını göreceksiniz.

Pytest Sonuçları Planı
Pytest Sonuçları Planı

Şimdi tüm değişiklikleri depoya uygulayın ve bu değişiklikleri Github'daki uzak depoda yayınlayın. Ana dalın koduyla farklılıkları karşılaştırın ve çakışma yoksa bir çekme isteği oluşturun.

Çekme isteği, Github İş Akışımızın bir parçası olan derleme işlerini çağırır. Öğretici-4'teki tüm çekme istekleri için yapılan kontroller başarısız olmazsa, bu dalı ana ile güvenli bir şekilde birleştirebiliriz.

Git Eylemleri Eğitimi-4
Git Eylemleri Eğitimi-4

Sıkça Sorulan Sorular

S # 1) Flask BluePrint nedir?

Cevap: Flask Blueprint, bir Flask Uygulamasını daha küçük ve yeniden kullanılabilir modüller halinde yapılandırmanın bir yoludur. Bir Flask Blueprint'in görünümler, şablonlar, statik dosyalar, modeller, formlar vb. Gibi ayrı kaynakları vardır. Kolayca bakımı yapılabilen ve ölçeklenebilir Flask Uygulamaları oluşturmak için Flask Blueprint yaklaşımını kullanırız.

S # 2) Flask Blueprint'i nasıl kullanıyorsunuz?

Cevap: Flask Blueprint'i kullanmak için, onu içe aktarmamız ve app.register_blueprint yöntemini kullanarak Flask Uygulaması nesnesine kaydetmemiz gerekir. Flask Blueprint'in yollarının başına bir yol eklemek için url_prifix parametresine bir değer iletebiliriz.

Sonuç

Bu eğiticide, Flask Taslaklarını bir Flask uygulaması için statik kaynaklar oluşturma kavramlarıyla birlikte açıkladık. Flask-Bootstrap adlı bir Flask eklentisinin yardımıyla, Flask Blueprint'i plan kaynaklarının düşünceleriyle birlikte kullanmanın faydalarını araştırdık.

Ayrıca örnek Flask öğretici uygulamasının Docker görüntüsünü oluşturma kavramlarını da ele aldık. Ayrıca, Flask Taslaklarını doğrulamak için iki test de oluşturduk.

Bir sonraki eğitimimizde, Flask kullanarak web uygulamalarında özellikler oluştururken yaygın olarak takip edilen kalıpları ele alacağız.

=> Sıfırdan Şişeyi Öğrenmek İçin Burayı Ziyaret Edin

Önerilen Kaynaklar

^