Tutorial: Bekerja dengan kerangka kerja web Django di Visual Studio

Artikel ini adalah Langkah pertama dalam seri tutorial lima bagian yang menunjukkan cara bekerja dengan Django di Visual Studio. Django adalah kerangka kerja Python tingkat tinggi yang dirancang untuk pengembangan web yang cepat, aman, dan dapat diskalakan. Visual Studio menyediakan templat proyek yang dapat Anda gunakan untuk menyederhanakan pembuatan aplikasi web berbasis Django. Seri tutorial ini menjelajahi kerangka kerja Django dalam konteks templat proyek Visual Studio.

Di Langkah 1 tutorial, Anda mempelajari cara:

• Buat proyek aplikasi web Django dengan menggunakan template Proyek Web Django Kosong
• Periksa kode boilerplate dan jalankan aplikasi
• Membuat repositori Git untuk aplikasi web Django
• Bekerja dengan kontrol kode sumber Git
• Membuat lingkungan virtual untuk aplikasi web Django

Prasyarat

• Visual Studio 2022 di Windows dengan opsi berikut dipilih di Penginstal Visual Studio:

  • Pada tab Beban Kerja, pilih opsi pengembangan Python. Untuk informasi selengkapnya, lihat Menginstal dukungan Python di Visual Studio.

  • Pada tab Komponen individual di bawah alat kode , pilih opsi Git untuk Windows.

Templat proyek Django di Visual Studio disertakan dengan semua versi Python Tools for Visual Studio yang lebih lama. Detail templat mungkin berbeda dari deskripsi dalam seri tutorial ini, terutama untuk versi kerangka kerja web Django yang lebih lama.

Visual Studio untuk Mac tidak didukung. Untuk informasi selengkapnya, lihat Apa yang terjadi pada Visual Studio untuk Mac? Visual Studio Code di Windows, Mac, dan Linux bekerja dengan baik dengan Python melalui ekstensi yang tersedia.

Proyek Visual Studio dan proyek Django

Dalam terminologi Django, proyek Django memiliki beberapa file konfigurasi tingkat situs bersama dengan satu atau beberapa "aplikasi." Untuk membuat aplikasi web lengkap, Anda dapat menyebarkan aplikasi ini ke host web. Proyek Django dapat berisi beberapa aplikasi, dan aplikasi yang sama dapat berada di beberapa proyek Django.

Proyek Visual Studio dapat berisi proyek Django bersama dengan beberapa aplikasi. Dalam seri tutorial ini, istilah "proyek" mengacu pada proyek Visual Studio. Ketika konten mengacu pada bagian "proyek Django" dari aplikasi web, itu mengacu pada "proyek Django" secara khusus.

Membuat proyek dan solusi Visual Studio

Di Langkah 1 dari seri tutorial ini, Anda membuat satu solusi Visual Studio untuk berisi beberapa proyek Django. Setiap proyek berisi satu aplikasi Django. Anda membuat proyek dengan menggunakan templat proyek Django yang berbeda yang disertakan dengan Visual Studio. Dengan menjaga proyek dalam solusi yang sama, Anda dapat dengan mudah beralih bolak-balik di antara file yang berbeda untuk perbandingan.

Ketika Anda bekerja dengan Django dari baris perintah, Anda biasanya memulai proyek dengan menjalankan perintah django-admin startproject <project_name>. Di Visual Studio, template Proyek Web Django Kosong menyediakan struktur yang sama dalam proyek dan solusi Visual Studio.

Ikuti prosedur ini untuk membuat solusi dan proyek:

1. Di Visual Studio, pilih File >Baru>Proyek dan cari "Django." Kemudian, pilih templat Proyek Web Django Kosong dan pilih Berikutnya .

   

2. Konfigurasikan proyek dan solusi baru Anda:

   1. Atur Nama proyek Visual Studio ke BasicProject. Nama ini juga digunakan untuk proyek Django.

   2. Tentukan Lokasi untuk Visual Studio guna menyimpan solusi dan proyek.

   3. Hapus solusi dan proyek Place dalam opsi direktori yang sama.

   4. Atur nama Solusi ke LearningDjango. Solusi ini berfungsi sebagai kontainer untuk beberapa proyek dalam seri tutorial ini.

3. Pilih Buat.

4. Setelah beberapa saat, Visual Studio menampilkan perintah file spesifikasi paket Python "requirements.txt" terdeteksi dalam proyek "BasicProject".:

   

   Dialog menunjukkan bahwa templat yang dipilih menyertakan file requirements.txt yang dapat Anda gunakan untuk membuat lingkungan virtual untuk proyek.

5. Pilih X di sebelah kanan untuk menutup perintah. Kemudian dalam tutorial ini, Anda membuat lingkungan virtual dan memastikan kontrol sumber mengecualikan lingkungan. (Lingkungan selalu dapat dibuat nanti dari file requirements.txt.)

Memeriksa kontrol Git

Dalam prosedur berikutnya, Anda membiasakan diri dengan dukungan Visual Studio untuk kontrol sumber Git.

Penting

Di Visual Studio 2019 dan yang lebih baru, pengalaman kontrol versi Git aktif secara default. Jika Anda ingin mempelajari selengkapnya tentang perbandingannya dengan Team Explorer, lihat Perbandingan berdampingan Git dan Team Explorer.

Jika Anda lebih suka terus menggunakan Team Explorer di versi Visual Studio yang lebih lama, buka Alat>Opsi>Fitur Pratinjau>Lingkungan dan alihkan kotak centang pengalaman pengguna New Git.

1. Untuk menerapkan proyek ke kontrol sumber lokal Anda, pilih Tambahkan ke Kontrol Sumber di kanan bawah di jendela utama Visual Studio lalu pilih Git:

   

   Jendela Buat repositori Git terbuka, di mana Anda dapat membuat dan mengunggah repositori baru.

2. Setelah Anda membuat repositori, bilah kontrol Git muncul di kanan bawah di jendela utama Visual Studio:

   

   Dari kiri ke kanan, bilah kontrol Git memperlihatkan jumlah penerapan keluar/masuk (panah #/#), jumlah perubahan yang tidak dilakukan (pensil #), nama cabang saat ini, dan nama repositori saat ini. Kontrol Git juga tersedia di menu Git pada toolbar utama.

3. Pada bilah kontrol Git, pilih perubahan (pensil #) untuk membuka jendela Perubahan Git. Anda juga dapat memilih Lihat perubahan Git> (Ctrl+O, Ctrl+G):

   

   Jendela ini menunjukkan detail tentang perubahan yang tidak dilakukan, termasuk perubahan yang disimpan. Karena proyek yang baru dibuat sudah berkomitmen untuk kontrol sumber secara otomatis, Anda tidak melihat perubahan yang tertunda.

4. Pada bilah kontrol Git, pilih penerapan (panah #/#) lalu pilih Tampilkan Semua Penerapan:

   

   Jendela repositori Git terbuka. Anda juga dapat memilih Lihat>repository Git (Ctrl+O, Ctrl+R):

   

   Jendela ini menampilkan detail-detail untuk repositori saat ini di panel kiri dan cabang saat ini dengan commit keluar/masuk di panel kanan.

   Untuk melihat tampilan perbandingan untuk file, pilih commit di panel tengah. Versi sebelumnya ditampilkan di sisi kiri dan versi yang direvisi ditampilkan di sisi kanan. Detailnya juga berisi pembuat perubahan, komitter perubahan, dan pesan penerapan.

Saat Anda bekerja melalui seri tutorial ini, masuk ke kebiasaan secara berkala menggunakan kontrol Git di Visual Studio untuk menerapkan dan mendorong perubahan. Langkah-langkah tutorial mengingatkan Anda pada titik yang sesuai.

Gunakan kontrol sumber dari awal

Ada beberapa keuntungan menggunakan kontrol sumber dari awal proyek. Saat Anda menggunakan kontrol sumber dari awal proyek, terutama jika Anda juga menggunakan repositori jarak jauh, Anda mendapatkan cadangan reguler di luar lokasi proyek Anda. Tidak seperti mempertahankan proyek hanya pada sistem file lokal, kontrol sumber juga menyediakan riwayat perubahan lengkap dan kemampuan mudah untuk mengembalikan satu file atau seluruh proyek ke status sebelumnya. Riwayat perubahan membantu menentukan penyebab regresi (kegagalan pengujian).

Kontrol sumber sangat penting jika beberapa orang mengerjakan proyek, karena mengelola penimpaan dan memberikan resolusi konflik. Kontrol sumber pada dasarnya adalah bentuk otomatisasi, mengatur Anda dengan baik untuk mengotomatiskan build, pengujian, dan manajemen rilis. Ini adalah langkah pertama dalam menggunakan Azure DevOps untuk proyek, dan karena hambatan untuk masuk sangat rendah, benar-benar tidak ada alasan untuk tidak menggunakan kontrol sumber dari awal.

Untuk informasi selengkapnya tentang kontrol sumber sebagai otomatisasi, lihat Sumber Kebenaran: Peran Repositori di DevOps, artikel di Majalah MSDN yang ditulis untuk aplikasi seluler yang juga berlaku untuk aplikasi web.

Mencegah Visual Studio menerapkan proyek secara otomatis

Ikuti langkah-langkah ini untuk mencegah Visual Studio menerapkan proyek baru secara otomatis:

1. Pilih Alat >Opsi>Kontrol Sumber>Pengaturan Global Git.

2. Kosongkan opsi Terapkan perubahan setelah penggabungan secara default dan pilih OK.

Membuat lingkungan virtual dan mengecualikan kontrol sumber

Setelah mengonfigurasi kontrol sumber untuk proyek, Anda dapat membuat lingkungan virtual dengan paket Django yang diperlukan proyek. Anda kemudian dapat menggunakan jendela Perubahan Git untuk mengecualikan folder lingkungan dari kontrol sumber.

1. Di Penjelajah Solusi, klik kanan pada node Lingkungan Python dan pilih Tambahkan Lingkungan.

   

2. Dalam dialog Tambahkan lingkungan, pilih Buat untuk menerima nilai bawaan. (Anda dapat mengubah nama lingkungan virtual jika mau, yang mengubah nama subfoldernya, tetapi env adalah konvensi standar.)

   

3. Jika Visual Studio meminta hak istimewa administrator, berikan persetujuan Anda. Tunggu beberapa menit saat Visual Studio mengunduh dan menginstal paket. Untuk Django dan dependensinya, prosesnya dapat memerlukan perluasan mendekati 1.000 file di lebih dari 100 subfolder. Anda dapat melihat kemajuan di jendela Output Visual Studio.

4. Pada bilah kontrol Git, pilih perubahan yang tidak dilakukan (yang sekarang memperlihatkan 99+) untuk membuka jendela Perubahan Git:

   

   Pembuatan lingkungan virtual membawa ribuan perubahan, tetapi Anda tidak perlu menyertakannya dalam kontrol sumber. Anda atau orang lain yang mengkloning proyek selalu dapat membuat ulang lingkungan dengan menggunakan file requirements.txt.

5. Untuk mengecualikan lingkungan virtual dari kontrol sumber, di jendela Perubahan Git, klik kanan folder env dan pilih Abaikan item lokal ini:

   

   Setelah Anda mengecualikan lingkungan virtual, satu-satunya perubahan yang tersisa adalah pada file proyek (.py) dan file .gitignore, yang berisi entri tambahan untuk folder lingkungan virtual.

   Untuk melihat tampilan perbedaan untuk file .gitignore, di jendela Perubahan Git, klik dua kali file.

6. Di jendela Perubahan Git, masukkan pesan commit, seperti "Perubahan proyek awal":

   

7. Di menu dropdown Commit, pilih Commit Staged dan Push.

Anda dapat membuka jendela Repositori Git dan mengonfirmasi penerapan bertahap yang ditampilkan di Riwayat Lokal untuk cabang saat ini.

Memahami tujuan lingkungan virtual

Lingkungan virtual adalah cara yang bagus untuk mengisolasi dependensi aplikasi Anda yang tepat. Metode isolasi ini menghindari konflik dalam lingkungan Python global, dan membantu pengujian dan kolaborasi. Seiring waktu, saat Anda mengembangkan aplikasi, Anda selalu membawa banyak paket Python yang bermanfaat. Dengan menyimpan paket dalam lingkungan virtual khusus proyek, Anda dapat dengan mudah memperbarui file requirements.txt proyek yang menjelaskan lingkungan tersebut, yang disertakan dalam kontrol sumber. Saat Anda menyalin proyek ke komputer lain, termasuk server build, server penyebaran, dan komputer pengembangan lainnya, mudah untuk membuat ulang lingkungan. Anda dapat membuat ulang lingkungan hanya dengan menggunakan file requirements.txt, itulah sebabnya lingkungan tidak perlu berada dalam kontrol sumber. Untuk informasi selengkapnya, lihat Menggunakan lingkungan virtual.

Menghapus lingkungan virtual di bawah kontrol sumber

Anda dapat menghapus lingkungan virtual setelah berada di bawah kontrol sumber. Ikuti langkah-langkah berikut:

1. Sunting file .gitignore Anda agar tidak memasukkan folder:

   1. Buka file dengan memilih File >Buka File>.

      Anda juga dapat membuka file dari Team Explorer. Pada halaman Pengaturan, pilih Pengaturan Repositori . Buka bagian Abaikan File Atribut & dan pilih tautan Edit di samping .gitignore.

   2. Temukan bagian di akhir yang memiliki komentar # Python Tools for Visual Studio (PTVS).

   3. Setelah bagian itu, tambahkan baris baru untuk folder lingkungan virtual, seperti /BasicProject/env.

2. Buka jendela perintah dan buka folder (seperti BasicProject) yang memiliki folder lingkungan virtual, seperti env.

3. Jalankan perintah git rm -r env untuk menghapus lingkungan virtual yang saat ini berada di bawah kontrol sumber.

4. Terapkan perubahan Anda dengan perintah git commit -m 'Remove venv', atau terapkan dari halaman Perubahan di Team Explorer.

Memeriksa kode yang sering digunakan berulang

Di bagian ini, Anda memeriksa kode boilerplate dalam file Proyek (.py) yang dibuat Visual Studio berdasarkan pilihan templat Anda.

Nota

Kode boilerplate sama apakah Anda membuat proyek di Visual Studio dari templat Django, atau menghasilkan proyek dengan menggunakan perintah CLI django-admin startproject <project_name>.

1. Buka Penjelajah Solusi untuk melihat solusi dan file proyek Anda. Proyek awal hanya berisi dua file, manage.py dan requirements.txt:

   

   File requirements.txt menentukan dependensi paket Django. Kehadiran file inilah yang mengundang Anda untuk membuat lingkungan virtual saat pertama kali membuat proyek.

   File manage.py adalah utilitas administratif baris perintah Django yang secara otomatis ditetapkan Visual Studio sebagai file startup proyek. Anda menjalankan utilitas pada baris perintah dengan menggunakan perintah python manage.py <command> [options].

   Untuk tugas Django umum, Visual Studio menyediakan perintah menu yang nyaman. Klik kanan proyek di Solution Explorer dan pilih Python untuk melihat daftar perintah. Anda menggunakan beberapa perintah ini dalam seri tutorial ini.

2. Selain dua file, proyek ini juga memiliki subfolder dengan nama yang sama dengan proyek. Folder ini berisi file proyek Django dasar:

   

   • __init__.py: File kosong yang memberi tahu Python bahwa folder ini adalah paket Python.
   • settings.py: Pengaturan untuk proyek Django, yang Anda ubah saat mengembangkan aplikasi web.
   • urls.py: Daftar isi untuk proyek Django, yang Anda ubah saat mengembangkan aplikasi web Anda.
   • wsgi.py: Titik masuk untuk server web yang kompatibel dengan WSGI untuk melayani proyek Anda. Anda biasanya meninggalkan file ini as-is karena menyediakan kait untuk server web produksi.

Membuat persyaratan setelah penginstalan paket

Visual Studio dapat menghasilkan file requirements.txt dari lingkungan virtual setelah Anda menginstal paket lain.

• Di Penjelajah Solusi, perluas simpul Lingkungan Python, klik kanan lingkungan virtual Anda, dan pilih Hasilkan requirements.txt.

Ini adalah praktik yang baik untuk menggunakan perintah ini secara berkala saat Anda memodifikasi lingkungan. Terapkan perubahan pada file requirements.txt Anda ke kontrol sumber bersama dengan perubahan kode lain yang bergantung pada lingkungan tersebut. Jika Anda menyiapkan integrasi berkelanjutan di server build, Anda harus menghasilkan file dan menerapkan perubahan setiap kali Anda memodifikasi lingkungan.

Jalankan proyek

Sekarang Anda siap untuk menjalankan proyek Anda di Visual Studio dengan mengikuti prosedur ini:

1. Di Visual Studio, pilih Debug>Mulai Penelusuran Kesalahan (F5) atau pilih Server Web pada toolbar utama (browser yang Anda lihat mungkin berbeda):

   

2. Salah satu perintah menjalankan server dengan menggunakan perintah manage.py runserver <port>, yang memulai server web bawaan di Django.

   Kode memulai aplikasi dengan menggunakan port yang ditentukan dalam server pengembangan Django.

   Jika Visual Studio memposting pesan Gagal memulai debugger dan menunjukkan tidak ada file startup yang ditemukan, klik kanan file manage.py di Penjelajah Solusi dan pilih Diatur sebagai File Startup.

3. Saat server dimulai, jendela konsol terbuka untuk menampilkan log server. Visual Studio secara otomatis membuka browser untuk http://localhost:<port>. Karena proyek Django Anda tidak memiliki aplikasi, Django hanya menampilkan halaman default untuk mengonfirmasi kode saat ini berfungsi seperti yang diharapkan.

   

4. Setelah selesai, tutup jendela konsol, yang menghentikan server pengembangan Django. Anda juga dapat memilih Debug>Hentikan Debugging.

Menggunakan server web dan kerangka kerja Django

Django memiliki server web bawaan yang dapat Anda gunakan untuk tujuan pengembangan. Saat Menjalankan aplikasi web Django secara lokal, Anda menggunakan server pengembangan web Django bawaan. Contoh skenario ini adalah ketika Anda men-debug aplikasi web Django Anda di Visual Studio.

Ketika Anda menyebarkan aplikasi web Django Anda ke host web, Anda menggunakan server web di host daripada server web Django bawaan. Modul wsgi.py dalam proyek Django menghubungkan ke server produksi.

Membandingkan perintah Debug dengan perintah Python proyek,

Ada perbedaan antara menggunakan perintah menu Debug dan perintah server yang tercantum pada submenu Python menu proyek.

Selain perintah menu Debug dan tombol toolbar, Anda juga dapat meluncurkan server dengan menggunakan perintah Python>Start server atau Python>Mulai server debug pada menu konteks proyek.

Kedua perintah membuka jendela konsol tempat Anda melihat URL lokal (localhost:port) untuk server yang sedang berjalan. Namun, Anda harus membuka browser secara manual dengan URL tersebut, dan menjalankan server debug tidak secara otomatis memulai debugger Visual Studio. Anda dapat melampirkan debugger ke proses yang sedang berjalan nanti, jika Anda ingin dengan menggunakan perintah Debug>Lampirkan ke Proses.

Langkah berikutnya

Langkah 2: Membuat aplikasi Django dengan tampilan dan templat halaman