Alıştırma - Mevcut projeye geliştirme kapsayıcısı ekleme

Tamamlandı

Proje için geliştirme kapsayıcısı ayarlarken önce bu projeye bir kapsayıcı yapılandırması eklemeniz gerekir. Kapsayıcı yapılandırması Visual Studio Code’da ortamınızı ayarlar.

Bu alıştırmada bir geliştirme kapsayıcısı ekleyecek ve kapsayıcıda Ürünler Panosu projesini açacaksınız.

Geliştirme kapsayıcısı ekleme

  1. VS Code'a ve daha önce kopyaladığınız projeye dönün.

  2. Komut Paleti'ni açmak için F1 tuşuna basın.

  3. Geliştirme kapsayıcısı ekle yazın ve Geliştirme Kapsayıcıları: Geliştirme Kapsayıcısı Yapılandırma Dosyaları Ekle'yi seçin. Bu, Geliştirici KapsayıcıSı Şablonlarının listesini sunar. Şablonlar, belirtilen teknoloji yığını için tam bir geliştirme ortamı yapılandırmak için gereken kaynak dosyaları içerir.

  4. Çalışma alanına yapılandırma ekle'yi seçin.

  5. Aşağıdaki seçenekleri belirleyin:

    Seçenek Değer
    Kapsayıcı yapılandırma şablonu seçme Python 3 karşılaştırması
    Python sürümü 3.11
    Yüklenecek ek özellikleri seçin Tamam'ı seçin

Önemli

Yapılandırma şablonunu seçerken ilk adımda "Tüm Tanımları Göster..." seçeneğini belirlemeniz gerekebilir ögesini seçin ve ardından tam şablon kümesi yüklendikten sonra Python'ı seçin.

Projenize bir Geliştirme Kapsayıcısı yapılandırması eklenir. Visual Studio Code artık projeyi kapsayıcıda açabileceğinizi bildirir. Şimdilik bu bildirimi kapatın.

Yapılandırma dosyalarını inceleme

  1. Projeye '.devcontainer' adlı yeni bir klasörün eklendiğine dikkat edin.
  2. Bu klasörü genişletin ve bir devcontainer.json dosyası içerdiğine dikkat edin.

Projeyi kapsayıcıda açma

  1. Komut Paleti'ni açmak için F1 tuşuna basın.
  2. Kapsayıcıda yeniden açma yazın.
  3. Kullanılabilir seçenekler listesinden Geliştirme Kapsayıcıları: Kapsayıcıda Yeniden Aç'ı seçin.

Kapsayıcı derlenmeye başlar. Yeni bir görüntünün çekilmesi ve makinenizde derlenmesi gerektiğinden, ilk derleme birkaç dakika sürebilir. Kapsayıcının ilk kez derlenmesinin ardından, sonraki derlemeler çok daha hızlı olacaktır.

Uzak Göstergeyi Görüntüleme

Kapsayıcı derlemesi tamamlandığında, Uzak Gösterge'yi inceleyerek kapsayıcıya bağlı olduğunuzu onaylayabilirsiniz. Artık proje dosyalarınızın VS Code'da yüklendiğini de görmeniz gerekir.

  • VS Code'un sol alt köşesini görüntüleyerek Uzak Gösterge'yi inceleyin. Artık "Dev Container: Python 3" görüntülediğine dikkat edin.

    Dev container python 3 yazan metin içeren Uzak Göstergenin ekran görüntüsü

Önemli

Windows'ta Pylance veya performansı artırma hakkında bildirimler görebilirsiniz. VS Code'da gördüğünüz bildirimleri güvenle kapatabilirsiniz. Böyle şeyler yapmanıza gerek yok.

Kapsayıcıyı inceleme

  1. Henüz açık değilse Visual Studio Code'da tümleşik terminali açmak için Ctrl tuşuna

  2. Terminal isteminin normal terminal isteminizden farklı görünebileceğine dikkat edin.

    VS Code tümleşik terminal istemi

  3. Python'ın yüklendiğinden emin olmak için aşağıdaki komutu çalıştırın:

    python --version
    

    Terminalin çıkışı, kapsayıcıda kullanılan Python sürümü olmalıdır.

Proje bağımlılıklarını yükleme

  • Projeyi çalıştırmak için ihtiyacınız olan Flask bağımlılıklarını yüklemek için terminalde aşağıdaki komutu çalıştırın:

    pip3 install --user -r requirements.txt
    

Projeyi çalıştırma

  1. Terminalde aşağıdaki komutu girerek projeyi başlatın:

    python app.py
    
  2. adresine giderek http://127.0.0.1:5000projeyi tarayıcıda açın.

    Python Ürünleri Panosu uygulamasının ekran görüntüsü.

Tebrikler! Makinenizde Flask'in çalıştığı bir Python web uygulamanız var ve bunların ne olduğunu bile bilmiyor olabilirsiniz. Sorun değil! Bilmeniz gerekmiyor. Kapsayıcı tüm ortamın ayarlanmasıyla ilgilenir.

Sonraki bölümde, bağımlılık yüklemesini devcontainer.json otomatikleştirmek ve bu Python projesi için VS Code'u özelleştirmek için dosyanın nasıl kullanılacağını öğreneceksiniz.