Beranda » Toolkit » Kontrol Versi dalam Kode Visual Studio dengan Git [Panduan]

    Kontrol Versi dalam Kode Visual Studio dengan Git [Panduan]

    Dukungan Git yang terintegrasi adalah salah satu fitur terbesar dari Visual Studio Code, editor kode sumber baru Microsoft. Git adalah a sistem kontrol versi terdistribusi, yang memungkinkan Anda untuk melacak pekerjaan Anda, bergerak bolak-balik antara versi, dan bekerja pada cabang yang berbeda secara bersamaan. Ini juga digunakan oleh Github, layanan hosting repositori Git yang populer.

    Kode Visual Studio mendukung Git secara default, yang berarti Anda tidak perlu menginstal paket atau ekstensi apa pun untuk menggunakannya. Bar Samping berisi yang terpisah Git Lihat Anda dapat dengan cepat membuka dengan mengklik pada Git ikon di Bar Tampilan (lihat bagian Kode VS), atau dengan menekan tombol Ctrl + Shift + G.

    Instal Git

    Sebagai Kode Visual Studio menggunakan install Git dari komputer Anda, pertama Anda harus menginstal Git. Anda dapat dengan cepat mengunduhnya dari situs web resmi Git. Anda perlu menginstal setidaknya versi 2.0.0 untuk membuat fitur Git VS Code berfungsi dengan baik.

    Meskipun Visual Studio Code memungkinkan Anda untuk melakukannya kelola Git secara visual, jika Anda juga ingin mempelajari cara menggunakan Git dari baris perintah, berikut adalah beberapa sumber yang berguna:

    • Tutorial Git interaktif Github
    • Tutorial Git Atlassian - Atlassian adalah perusahaan di balik platform hosting kode sumber Bitbucket (mirip dengan Github)
    • Lembar Git Chit Atlassian (PDF) - ini adalah cara tercepat jika Anda sudah menggunakan Git, tetapi tidak ingat satu atau dua perintah
    • Seluruh buku pegangan Pro Git

    Inisialisasi Repositori Anda

    Jika ruang kerja Anda belum dilacak oleh Git, pertama-tama Anda harus melakukannya inisialisasi repositori baru. Untuk melakukannya, klik pada tombol Initialize git repository di Git View.

    Kode VS akan membuat .git folder di dalam ruang kerja Anda (Anda tidak dapat melihat ini dari VS Code, karena ini adalah direktori tersembunyi, tetapi Anda dapat menemukannya di file manager di folder root proyek Anda), dan itu juga akan tambahkan file Anda yang tidak dilacak ke Bar Sisi.

    Perubahan Tahap

    Setelah repositori Git Anda diatur, saatnya untuk buat komit awal Anda (komit adalah keadaan rekaman dari seluruh repositori Anda yang nantinya dapat Anda pindahkan kembali). Sebelum melakukan, Anda perlu menambahkan file yang ingin Anda lacak dengan Git ke area pementasan, atau dengan kata lain Anda perlu tahap perubahan. Klik pada tombol + yang muncul pada hover di sebelah setiap file untuk mementaskannya.

    Setelah Anda mengklik pada file yang ingin Anda panggung, Visual Studio Code berpindah dari Perubahan folder ke folder Perubahan bertahap folder, itu berarti sekarang mereka di area pementasan. Jika Anda menghendaki tahap semua file Anda sekaligus, ada tombol + di sebelah Perubahan subtitle juga (muncul di hover), dan klik di atasnya.

    Perubahan Komit

    Perubahan bertahap belum direkam, Anda juga perlu komit mereka, sehingga nanti Anda dapat melihat atau kembali ke menu keadaan repositori Anda saat ini. Untuk melakukan perubahan bertahap, Anda harus melakukannya tambahkan pesan komit yang menjelaskan perubahan yang Anda buat sejak komit sebelumnya.

    Seperti pada contoh kita ini akan menjadi komit awal, mari gunakan pemogokan “Komitmen Awal” pesan. Ketikkan pesan komit Anda ke dalam bilah masukan di bagian atas Bilah Sisi, dan klik pada ikon centang kecil. Sekarang Anda siap dengan komit pertama Anda, keadaan awal repositori Anda direkam.

    Direktori kerja Git Anda bersih, semua perubahan yang Anda buat sejauh ini dilacak, dan Tampilan Git Anda mengatakan ada 0 perubahan (selalu dibandingkan dengan komit terakhir Anda). Jika Anda membuat perubahan baru di ruang kerja Anda, perubahan baru akan muncul lagi di Bilah Sisi, dan Anda harus melakukannya komit lagi begitu mereka mencapai jumlah yang layak dilakukan.

    Pada tangkapan layar di bawah ini Anda dapat melihat bagaimana editor kode Anda perlu terlihat tepat setelah melakukan.

    Ikuti Perubahan

    Ketika Anda melanjutkan pekerjaan Anda, jika Anda tidak yakin tentang bagaimana versi saat ini dibandingkan dengan komit terakhir Anda, Anda dapat dengan cepat memeriksa perbedaannya. Di Git View, Anda hanya perlu klik dua kali pada file yang ingin Anda analisis, dan VS Code akan menampilkan versi saat ini dan sebelumnya berdampingan, jadi Anda bisa cepat membandingkannya.

    Ketika berbicara tentang mengikuti perubahan, penting juga untuk mengetahui tentang Visual Studio Code indikator selokan yang mencatat perubahan dibandingkan dengan komit Anda sebelumnya, bahkan ketika tampilan berdampingan tidak terbuka. Penggunaan Kode VS 3 macam indikator selokan:

    1. Sebuah segitiga merah untuk setiap penghapusan baris
    2. Sebuah bilah hijau untuk setiap penambahan baris
    3. Sebuah bilah biru untuk setiap modifikasi baris

    Buat Cabang

    Git memungkinkan Anda untuk melakukannya bekerja pada cabang yang berbeda pada waktu bersamaan. Ini tidak hanya baik untuk bereksperimen dengan solusi baru, tetapi juga dapat secara signifikan memfasilitasi kerja tim di mana pengembang dapat bekerja di cabang yang berbeda (namun ini tidak wajib, karena mereka juga dapat tetap di cabang yang sama).

    Dalam Visual Studio Code, Anda bisa buat cabang baru dengan membuka palet Buka Cepat dengan menekan Ctrl + P (Cmd + P pada Mac), lalu mengetikkan cabang git perintah ke bilah masukan. Anda juga perlu menambahkan nama cabang baru Anda di akhir perintah.

    Seperti nama cabang baru dalam contoh kita akan cabang uji, Saya akan menggunakan git branch test-branch perintah, tetapi Anda dapat menggunakan nama lain. Di sisi kiri bilah status (bilah biru di bagian bawah layar) Anda selalu dapat dengan cepat memeriksa cabang mana yang sedang Anda kerjakan. Pada tangkapan layar di bawah, Anda dapat melihat bahwa saya saat ini di menguasai cabang.

    Cabang Pembukaan

    Untuk beralih antar cabang, mengetik git checkout ke dalam palet Buka Cepat (Ctrl + P / Cmd + P), dan Anda dapat memilih dari cabang yang tersedia. Pada tangkapan layar di bawah, Anda dapat melihat dari bilah status bahwa saya saat ini di cabang dipanggil uji (Saya membuatnya setelah cabang uji), dan jika saya ingin pindah ke cabang lain, sekarang saya dapat memilih dari menguasai dan cabang uji ranting.

    Gunakan Perintah Git dari Palet Perintah

    Anda dapat mengakses perintah Git dari Command Palette (F1 di Windows dan Linux, Shift + Cmd + P di Mac) juga. Anda tidak perlu melakukan hal lain, cukup ketik perintah Git di dalam Palette Perintah, dan Anda mendapatkan daftar dropdown dari perintah yang tersedia yang dapat Anda pilih dengan cepat.

    Operasi Git Lanjut

    Sejauh ini, kami telah melihat cara menggunakan operasi Git dasar dalam Visual Studio Code untuk melacak pekerjaan kami. VS Studio Code juga memiliki fitur-fitur canggih Git, seperti mengelola repositori jarak jauh, menggabungkan konflik, dan Anda bahkan dapat mengonfigurasi VS Code sebagai editor Git eksternal Anda.

    Visual Studio Code Marketplace juga berisi ekstensi terkait Git yang dapat membuat alur kerja Git Anda semakin profesional.

    Saya sendiri menemukan ekstensi Git History sangat berguna, karena memungkinkan untuk melihat detail masing-masing commit dengan cepat, dan membandingkan dua commit sebelumnya yang dilakukan berdampingan. Anda juga dapat membaca ekstensi Git History di artikel saya sebelumnya tentang ekstensi Kode VS untuk pengembang front-end.