Öğretici: Visual Studio'da Flask web çerçevesiyle çalışma

Bu makale, Visual Studio'da Flask ile nasıl çalışıldığını gösteren üç bölümlü öğretici serisinin ilk Adımıdır. Flask , URL yönlendirme ve sayfa işleme ile ilgili temel bilgileri sağlayan web uygulamalarına yönelik basit bir Python çerçevesidir. Flask, form doğrulama, veritabanı soyutlaması, kimlik doğrulaması gibi özellikleri doğrudan sağlamadığından "mikro" çerçeve olarak adlandırılır. Bu özellikler bunun yerine Flask uzantıları olarak adlandırılan özel Python paketleri tarafından sağlanır. Uzantılar Flask ile sorunsuz bir şekilde tümleştirilip Flask'in bir parçası gibi görünür. Örneğin, Flask'in kendisi bir sayfa şablonu altyapısı sağlamaz. Şablon oluşturma, bu öğreticide gösterildiği gibi Jinja ve Jade gibi uzantılar tarafından sağlanır.

Eğitimin 1. Adımında şunları öğreneceksiniz:

• Visual Studio çözümü ve Flask projesi oluşturma
• Proje ortak kodunu inceleme ve projeyi çalıştırma
• Flask projesindeki değişiklikleri korumak için Git deposu oluşturma
• Git kaynak kodu denetimleriyle çalışma
• Flask projesi için sanal ortam oluşturma

Bu ders Flask Hızlı Başlangıç'tan farklıdır. Flask hakkında daha fazla bilgi edinecek ve flask proje şablonlarını kullanarak projeleriniz için daha kapsamlı bir başlangıç noktası sağlayabilirsiniz. Bir proje oluşturduğunuzda şablonlar Flask paketini otomatik olarak yüklerken, Hızlı Başlangıç paketin el ile nasıl yükleneceğini gösterir.

Önkoşullar

• Windows'da Visual Studio 2022 veya üzeri, Visual Studio Yükleyicisi'nde aşağıdaki seçenekler seçilidir:

  • İş yükleri sekmesinde Python geliştirme seçeneğini belirleyin. Daha fazla bilgi için bkz. Visual Studio'de Python desteği yükleme.

  • Tek tek bileşenlersekmesindeki Kod araçları'nın altında Windows için Git seçeneğini belirleyin.

Flask proje şablonları, Visual Studio için Python Araçları'nın önceki tüm sürümlerine eklenir. Şablon ayrıntıları bu öğreticideki açıklamalardan farklı olabilir.

Mac için Visual Studio desteklenmez. Daha fazla bilgi için bkz. Mac için Visual Studio'da neler oluyor? Windows, Mac ve Linux'ta Visual Studio Code , mevcut uzantılar aracılığıyla Python ile iyi çalışır.

Visual Studio çözümü ve Flask projesi oluşturma

Bu öğreticinin 1. Adımında, iki ayrı Flask projesi içeren tek bir Visual Studio çözümü oluşturacaksınız. Visual Studio'ya dahil edilen farklı Flask proje şablonlarını kullanarak projeleri oluşturursunuz. Projeleri aynı çözümde tutarak, karşılaştırma için farklı dosyalar arasında kolayca geçiş yapabilirsiniz.

Çözümü ve Flask web projesini oluşturmak için şu yordamı izleyin:

1. Visual Studio'da Dosya>Yeni Proje'yi> seçin ve "Flask" araması yapın. Ardından Boş Flask Web Projesi şablonunu ve ardından İleri'yi seçin.

   

2. Yeni projenizi ve çözümünüzü yapılandırın:

   1. Visual Studio projesinin AdınıBasicProject olarak ayarlayın. Bu ad Flask projesi için de kullanılır.

   2. Visual Studio'nun çözümü ve projeyi kaydedeceği konumu belirtin.

   3. Çözümü ve projeyi aynı dizine yerleştir seçeneğini temizleyin.

   4. Çözüm adınıLearningFlask olarak ayarlayın. Çözüm, bu öğretici serisinde birden çok proje için kapsayıcı görevi görür.

3. Oluştur'i seçin.

4. Bir dakika sonra Visual Studio, "BasicProject" projesinde "requirements.txt" Python paket belirtimi dosyası algılandı" istemini görüntüler:

   

   İletişim kutusu, seçilen şablonun proje için sanal ortam oluşturmak için kullanabileceğiniz bir requirements.txt dosyası içerdiğini gösterir.

5. İstemi kapatmak için sağdaki X işaretini seçin. Bu öğreticinin ilerleyen bölümlerinde sanal ortamı oluşturur ve kaynak denetiminin ortamı dışlamadığından emin olursunuz. (Ortam daha sonra requirements.txt dosyasından her zaman oluşturulabilir.)

Git denetimlerini inceleme

Sonraki yordamda Git kaynak denetimi için Visual Studio desteği hakkında bilgi edineceksiniz.

1. Projeyi yerel kaynak denetiminize işlemek için Visual Studio ana penceresinin sağ alt kısmındaki Kaynak Denetimine Ekle'yi ve ardından Git'i seçin:

   

   Yeni bir depo oluşturup gönderebileceğiniz Git deposu oluştur penceresi açılır.

2. Bir depo oluşturduktan sonra, Visual Studio ana penceresinde sağ altta Git denetimleri çubuğu görüntülenir:

   

   Soldan sağa Git denetim çubuğunda giden/gelen işlemelerin sayısı (oklar #/#), kaydedilmemiş değişikliklerin sayısı (kalem #), geçerli dal adı ve geçerli depo adı gösterilir. Git denetimleri, ana araç çubuğundaki Git menüsünde de kullanılabilir.

3. Git denetimleri çubuğunda değişiklikleri (kalem #) seçerek Git Değişiklikleri penceresini açın. Göster>Git değişiklikleri'ni de seçebilirsiniz (Ctrl+O, Ctrl+G):

   

   Bu pencerede, depolanmış değişiklikler de dahil olmak üzere, kaydedilmemiş değişikliklerle ilgili ayrıntılar gösterilir. Yeni oluşturduğunuz proje zaten otomatik olarak kaynak denetimine işlendiğinden bekleyen hiçbir değişiklik görmezsiniz.

4. Git denetimleri çubuğunda işlemeleri (oklar #/#) ve ardından Tüm İşlemeleri Görüntüle'yi seçin:

   

   Git deposu penceresi açılır. Görüntüle>Git deposu (Ctrl+O, Ctrl+R) seçebilirsiniz:

   

   Bu pencere, sol bölmedeki geçerli depo ayrıntılarını ve sağ bölmede giden/gelen commit'lerle birlikte geçerli dalı gösterir.

   Dosyanın farklılıklar görünümünü görmek için orta bölmede bir işleme tıklayın. Önceki sürüm sol tarafta, düzeltilmiş sürüm ise sağ tarafta gösterilir. Ayrıntılarda değişiklik yazarı, değişiklik işleyicisi ve işleme iletisi de yer alır.

Bu öğreticide çalışırken, değişiklikleri işlemek ve göndermek için Visual Studio'daki Git denetimlerini düzenli aralıklarla kullanma alışkanlığına geçin. Bu öğretici size uygun noktaları anımsatır.

Başlangıçtan kaynak denetimini kullanma

Projenin başından itibaren kaynak denetimini kullanmanın çeşitli avantajları vardır. Bir projenin başlangıcından itibaren kaynak denetimi kullandığınızda, özellikle de uzak bir depo kullanıyorsanız, projenizin düzenli olarak site dışı yedeğini alırsınız. Bir projenin yalnızca yerel bir dosya sisteminde tutulmasından farklı olarak, kaynak denetimi tam bir değişiklik geçmişi ve tek bir dosyayı veya projenin tamamını önceki bir duruma geri döndürme olanağı da sağlar. Değişiklik geçmişi, regresyonların (test hataları) nedenini belirlemeye yardımcı olur.

Bir proje üzerinde birden çok kişi çalışıyorsa kaynak denetimi önemlidir, çünkü üzerine yazmaları yönetir ve çakışma çözümü sağlar. Kaynak denetimi temelde bir otomasyon biçimidir, derlemeleri otomatikleştirmek, test etmek ve yayın yönetimi için iyi bir şekilde ayarlamanızı sağlar. Bu, proje için Azure DevOps kullanmanın ilk adımıdır ve giriş engelleri çok düşük olduğundan, başlangıçtan itibaren kaynak denetimini kullanmamak için gerçekten bir neden yoktur.

Otomasyon olarak kaynak denetimi hakkında daha fazla bilgi için, MSDN Dergisi'nde web uygulamaları için de geçerli olan mobil uygulamalar için yazılmış bir makale olan Gerçeğin Kaynağı: DevOps'taki Depoların Rolü makalesine bakın.

Visual Studio'da projelerin otomatik olarak yüklenmesini engelleme

Visual Studio'nın yeni bir projeyi otomatik olarak işlemesini önlemek için şu adımları izleyin:

1. Araçlar>Seçenekleri bölmesini açın ve Tüm Ayarlar>Kaynak Denetimi>Git Ayarları bölümünü genişletin.

2. Birleştirmeden sonra değişiklikleri varsayılan olarak işle seçeneğini temizleyin.

Sanal ortam oluşturma ve kaynak denetimini dışlama

Projeniz için kaynak denetimini yapılandırdıktan sonra, projenin gerektirdiği gerekli Flask paketleriyle sanal ortamı oluşturabilirsiniz. Ardından, ortamın klasörünü kaynak denetiminden dışlamak için Git Değişiklikleri penceresini kullanabilirsiniz.

1. Çözüm Gezgini'ndePython Ortamları düğümüne sağ tıklayın ve Ortam Ekle'yi seçin.

   

2. Ortam ekle iletişim kutusunda Oluştur'u seçerek varsayılan değerleri kabul edin. (İsterseniz sanal ortamın adını değiştirebilirsiniz; bu da alt klasörünün adını değiştirir, ancak env standart bir kuraldır.)

   

3. Visual Studio yönetici ayrıcalıkları isterse onayınızı sağlayın. Visual Studio paketleri indirip yüklerken birkaç dakika bekleyin. Flask ve bağımlılıkları için işlem, 100'den fazla alt klasörde 1.000'e yakın dosya genişletmeyi gerektirebilir. İlerleme durumunu Visual Studio Çıkış penceresinde görüntüleyebilirsiniz.

4. Git denetimleri çubuğunda, Git Değişiklikleri penceresini açmak için kaydedilmemiş değişiklikleri (artık 99+) seçin:

   

   Sanal ortamın oluşturulması binlerce değişiklik getirir, ancak bunları kaynak denetimine eklemeniz gerekmez. Siz veya projeyi kopyalayan diğer herkes requirements.txt dosyasını kullanarak ortamı her zaman yeniden oluşturabilir.

5. Sanal ortamı kaynak denetiminden dışlamak için Git Değişiklikleri penceresinde env klasörüne sağ tıklayın ve Bu yerel öğeleri yoksay'ı seçin:

   

   Sanal ortamı dışladıktan sonra, kalan tek değişiklikler proje dosyasında (.py) ve sanal ortam klasörü için ek bir giriş içeren .gitignore dosyasındadır.

   .gitignore dosyasının farklılıklar görünümünü görmek için Git Değişiklikleri penceresinde dosyaya çift tıklayın.

6. Git Değişiklikleri penceresinde, "İlk proje değişiklikleri" gibi bir işleme iletisi girin:

   

7. İşleme açılan menüsünde İşleme Aşamalı ve Gönder'i seçin.

Git Deposu penceresini açabilir ve hazırlanmış işlemelerin geçerli dal için Yerel Geçmiş'te gösterilmesini onaylayabilirsiniz.

Sanal ortamların amacını anlama

Sanal ortam, uygulamanızın tam bağımlılıklarını yalıtmak için harika bir yoldur. Bu yalıtım yöntemi, genel python ortamındaki çakışmaları önler ve hem test hem de işbirliğine yardımcı olur. Zaman içinde, bir uygulama geliştirirken birçok yararlı Python paketi getirirsiniz. Paketleri projeye özgü bir sanal ortamda tutarak, kaynak denetimine dahil edilen ortamı açıklayan projenin requirements.txt dosyasını kolayca güncelleştirebilirsiniz. Projeyi derleme sunucuları, dağıtım sunucuları ve diğer geliştirme bilgisayarları gibi diğer bilgisayarlara kopyaladığınızda, ortamı yeniden oluşturmak kolaydır. Ortamı yalnızca requirements.txt dosyasını kullanarak yeniden oluşturabilirsiniz. Bu nedenle ortamın kaynak denetiminde olması gerekmez. Daha fazla bilgi için bkz. Sanal ortamları kullanma.

Kaynak denetimi altında sanal ortamı kaldırma

Sanal ortamı kaynak denetimi altında olduktan sonra kaldırabilirsiniz. Şu adımları izleyin:

1. Klasörü dışlamak için .gitignore dosyanızı düzenleyin:

   1. Dosya>Dosya'yı > seçeneğini seçerek açın.

      Dosyayı Takım Gezgini'nden de açabilirsiniz. Ayarlar sayfasında Depo Ayarları'nı seçin. Öznitelik Dosyalarını Yoksay bölümüne gidin ve .gitignore öğesinin yanındaki Düzenle bağlantısını seçin.

   2. Sonunda açıklama # Python Tools for Visual Studio (PTVS) içeren bölümü bulun.

   3. Bu bölümden sonra sanal ortam klasörü için /BasicProject/env gibi yeni bir satır ekleyin.

2. Bir komut penceresi açın ve env gibi sanal ortam klasörünü içeren klasöre (BasicProject gibi) gidin.

3. git rm -r env Şu anda kaynak denetimi altında olan sanal ortamı kaldırmak için komutunu çalıştırın.

4. Değişikliklerinizi komutuyla git commit -m 'Remove venv' işleyin veya Ekip Gezgini'ninDeğişiklikler sayfasından işleyin.

Kalıp kodu inceleme

Bu bölümde, Visual Studio'nun şablon seçiminize göre oluşturduğu Project dosyasındaki (.py) ortak kodu inceleyebilirsiniz.

1. Çözümünüzü ve proje dosyalarınızı görüntülemek için Çözüm Gezgini'ne gidin. İlk proje yalnızca iki dosya içerir: app.py ve requirements.txt:

   

   requirements.txt dosyası Flask paket bağımlılıklarını belirtir. Bu dosyanın varlığı, projeyi ilk oluştururken sizi sanal ortam oluşturmaya davet eder.

   Tek bir app.py dosyası, boş bir Flask web projesi için şablon kodu içerir.

2. düzenleyicide app.py dosyasını açın ve flask için bir import deyim olan ilk bölümü inceleyin.

   Bu deyim, Flask sınıfının bir örneğini oluşturur ve bu örnek app değişkenine atanır. Bu bölüm ayrıca bir wsgi_app değişken atar (bir web konağına dağıttığınızda yararlı olur, ancak şimdilik kullanılmaz):

   from flask import Flask
   app = Flask(__name__)
   
   # Make the WSGI interface available at the top level so wfastcgi can get it.
   wsgi_app = app.wsgi_app
   

3. gözden geçirecek ikinci bölüm dosyanın sonunda yer alır. Bu bölüm, Flask geliştirme sunucusunu başlatmak için kullanabileceğiniz isteğe bağlı kodu içerir.

   Ortam değişkenlerinden alınan belirli konak ve bağlantı noktası değerlerini kullanmak için kodu tanımlayabilir veya varsayılan konak ve bağlantı noktası değerini localhost:55551kullanabilirsiniz.

   if __name__ == '__main__':
       import os
       HOST = os.environ.get('SERVER_HOST', 'localhost')
       try:
           PORT = int(os.environ.get('SERVER_PORT', '5555'))
       except ValueError:
           PORT = 5555
       app.run(HOST, PORT)
   

4. İncelenen kodun üçüncü bölümü, URL yoluna bir işlev atar; bu da işlevin URL tarafından tanımlanan kaynağı sağladığı anlamına gelir.

   Flask'in @app.route dekoratörünü, site köküne göreli URL'yi belirten bir parametre ile kullanarak yolları tanımlarsınız. Kodda görebileceğiniz gibi işlev yalnızca bir metin dizesi döndürür ve bu da tarayıcının işlemesi için yeterlidir. Bu öğretici serisinin sonraki adımlarında, html ile daha zengin sayfalar işlemek için kodu güncelleştirin.

   @app.route('/')
   def hello():
       """Renders a sample page."""
       return "Hello World!"
   

Flask sınıfında 'name' parametresini anlama

name Flask sınıfındaki bağımsız değişken, uygulamanın modülünün veya paketinin adıdır. Flask, uygulamaya ait şablonların, statik dosyaların ve diğer kaynakların nerede arandığını belirlemek için bu adı kullanır. Tek bir modülde __name__ yer alan uygulamalar için her zaman uygun değerdir. Ad, hata ayıklama bilgilerine ihtiyaç duyan uzantılar için de önemlidir. Daha fazla bilgi ve diğer parametreler için Flask sınıfı belgelerine (flask.pocoo.org) bakın.

Birden çok yol dekoratörü kullanma

Bir işlevin birden fazla yol dekoratörü olabilir. Aynı işlev birden çok yola hizmet ediyorsa, istediğiniz kadar dekoratör kullanabilirsiniz. Örneğin, hem hello hem de / yolu için /hello işlevini kullanmak amacıyla aşağıdaki kodu kullanın.

@app.route('/')
@app.route('/hello')
def hello():
    """Renders a sample page."""
    return "Hello World!"

Değişken URL yollarını ve sorgu parametrelerini kullanma

Flask değişken URL yolları ve sorgu parametreleriyle çalışabilir. Bir yolda, herhangi bir değişkeni özniteliğiyle <variable_name> işaretlersiniz. Flask, URL yolunda adlandırılmış bir bağımsız değişken kullanarak değişkeni işleve geçirir. Örneğin, /hello/<name> şeklindeki bir yol, fonksiyona geçirilen name adlı bir dize bağımsız değişkeni oluşturur. Sorgu parametreleri, request.args özelliği aracılığıyla ve özellikle request.args.get yöntemi aracılığıyla kullanılabilir. Aşağıdaki kod bir örnek sağlar:

# URL: /hello/<name>?message=Have%20a%20nice%20day
@app.route('/hello/<name>')
def hello(name):
    msg = request.args.get('message','')
    return "Hello " + name + "! "+ msg + "."

Türü değiştirmek için değişkenin önüne int, float, path (klasör adlarını ayırmak için eğik çizgileri kabul eder) ve uuid ekleyin. Daha fazla bilgi için Flask belgelerindeki Değişken kuralları bölümüne bakın.

Paket yüklendikten sonra gereksinimleri oluşturma

Visual Studio, diğer paketleri yükledikten sonra sanal ortamdan bir requirements.txt dosyası oluşturabilir.

• Çözüm Gezgini'ndePython Ortamları düğümünü genişletin, sanal ortamınıza sağ tıklayın ve requirements.txtoluştur'a tıklayın.

Ortamı değiştirirken bu komutu düzenli aralıklarla kullanmak iyi bir uygulamadır. requirements.txt dosyanızdaki değişiklikleri kaynak denetimine ve bu ortama bağlı diğer kod değişikliklerine işleyin. Bir derleme sunucusunda sürekli tümleştirme ayarlarsanız, ortamı her değiştirdiğinizde dosyayı oluşturup değişiklikleri işlemeniz gerekir.

Projeyi çalıştırma

Artık bu yordamı izleyerek projenizi Visual Studio'da çalıştırmaya hazırsınız:

1. Visual StudioHata Ayıklama>Hata Ayıklamayı Başlat (F5) öğesini seçin veya ana araç çubuğunda web sunucusu seçin (gördüğünüz tarayıcı farklılık gösterebilir):

   

2. Her iki komut da PORT ortam değişkenine rastgele bir bağlantı noktası numarası atar ve Python app.py dosyasını çalıştırır.

   Kod, Flask geliştirme sunucusu içindeki bu bağlantı noktasını kullanarak uygulamayı başlatır.

   Visual Studio hata ayıklayıcı başlatılamadı iletisini gönderip hiçbir başlangıç dosyası bulunamadığını belirtiyorsa Çözüm Gezgini'ndeapp.py dosyasına sağ tıklayın ve Başlangıç Dosyası Olarak Ayarla'yı seçin.

3. Sunucu başlatıldığında, sunucu günlüğünü görüntülemek için bir konsol penceresi açılır. Visual Studio otomatik olarak bir tarayıcı http://localhost:<port>'i açar ve burada hello işlevi tarafından işlenen mesajı görmelisiniz.

   

4. İşiniz bittiğinde, Flask geliştirme sunucusunu durduran konsol penceresini kapatın. Ayrıca hata ayıklama>hata ayıklamayı durdurseçebilirsiniz.

Hata ayıklama komutlarını proje Python komutları ile karşılaştırma

Hata Ayıkla menü komutlarını kullanma ile projenin Python alt menüsünde listelenen sunucu komutları arasında bir fark vardır.

Hata Ayıklama menüsü komutlarına ve araç çubuğu düğmelerine ek olarak, projenin bağlam menüsünde pythonBaşlangıç sunucusu veya >>Başlat hata ayıklama sunucusu komutlarını kullanarak da sunucuyu başlatabilirsiniz.

Her iki komut da çalışan sunucunun yerel URL'sini (localhost:port) gördüğünüz bir konsol penceresi açar. Ancak, bu URL'ye sahip bir tarayıcıyı el ile açmanız gerekir ve hata ayıklama sunucusunu çalıştırmak Visual Studio hata ayıklayıcısını otomatik olarak başlatmaz. daha sonra isterseniz çalışan işleme bir hata ayıklayıcı eklemek için Hata Ayıklama>İşleme Ekle komutunu kullanabilirsiniz.

Sonraki adım

2. Adım: Görünümler ve sayfa şablonlarıyla Flask uygulaması oluşturma