VS Code-ийн хэрэглээний гарын авлага: Үр ашигтай хөгжүүлэгчдэд зориулсан зайлшгүй техник, хэрэгслийн зөвлөмж

Visual Studio Code (VS Code) нь үнэ төлбөргүй, нээлттэй эхийн, олон платформтой код засварлагч бөгөөд хөгжүүлэгчдийн дунд маш их алдартай. Энэ нь хүчирхэг функц, өргөтгөлийн баялаг экосистем, хялбар хэрэглэх интерфэйстэй. Энэхүү нийтлэлд бид саяхан X/Twitter дээрх хэлэлцүүлгийг үндэслэн VS Code-ийн хэрэглээний техник, хэрэгслийн зөвлөмжийг нэгтгэн танилцуулж, хөгжүүлэлтийн үр ашгийг дээшлүүлэхэд туслах болно.

VS Code-ийн сэтгэл татам байдал юунд байна вэ?

X/Twitter дээрх хэлэлцүүлгээс харахад хөгжүүлэгчид VS Code-д маш их дуртай байдаг. @@freeCodeCamp нь VS Code-ийн түгээмэл байдал, үнэ төлбөргүй байдлыг олон удаа дурдаж, түүний санал болгож буй баялаг функцуудыг онцолсон. @@chomado өөрийн дуртай засварлагчаа хуваалцаж, фронт-энд инженерүүдэд зориулсан өргөтгөлийн функцийг санал болгосон.

Дүгнэж хэлэхэд VS Code-ийн гол давуу талууд нь:

• Үнэ төлбөргүй, нээлттэй эх сурвалж: Хэн бүхэн үнэ төлбөргүй ашиглах боломжтой бөгөөд нийгэмлэгийн хөгжилд оролцох боломжтой.
• Олон платформ: Windows, macOS, Linux гэх мэт олон үйлдлийн системийг дэмждэг.
• Хөнгөн жинтэй: Ачаалах хурд хурдан, нөөцийн хэрэглээ багатай.
• Өргөтгөлийн хүчирхэг экосистем: Өргөтгөл суулгаснаар VS Code-ийн функцийг сайжруулж, хөгжүүлэлтийн янз бүрийн хэрэгцээг хангах боломжтой.
• Суурилуулсан дибаг хийх хэрэгсэл: Хөгжүүлэгчдэд асуудлыг хурдан тодорхойлж, шийдвэрлэхэд хялбар болгохын тулд олон програмчлалын хэлийг дибаг хийхийг дэмждэг.
• Git-тэй нэгтгэсэн: Хөгжүүлэгчдэд хувилбарын хяналтыг хялбаршуулах.
• Ухаалаг санамж: Код бөглөх, синтакс шалгах гэх мэт функцуудыг хангаж, кодлох үр ашгийг дээшлүүлдэг.

VS Code-ийн хэрэглээний техник: Хөгжүүлэлтийн үр ашгийг дээшлүүлэх

1. Товчлолыг эзэмших: VS Code нь баялаг товчлолыг санал болгодог бөгөөд эдгээр товчлолыг эзэмшсэнээр хөгжүүлэлтийн үр ашгийг эрс дээшлүүлэх боломжтой. Доор хамгийн түгээмэл хэрэглэгддэг товчлолуудыг жагсаав.

   • Ctrl+Shift+P (Windows/Linux) / Cmd+Shift+P (macOS): Командын самбарыг нээнэ. Энэ нь VS Code-ийн гол функцуудын нэг бөгөөд командын самбараар дамжуулан янз бүрийн үйлдлийг гүйцэтгэх боломжтой.
   • Ctrl+P (Windows/Linux) / Cmd+P (macOS): Файлыг хурдан нээнэ.
   • Ctrl+Shift+O (Windows/Linux) / Cmd+Shift+O (macOS): Тэмдэгт рүү хурдан үсрэх (функц, класс гэх мэт).
   • Ctrl+Shift+F (Windows/Linux) / Cmd+Shift+F (macOS): Глобал хайлт.
   • Ctrl+D (Windows/Linux) / Cmd+D (macOS): Дараагийн тохирох зүйлийг сонгоно. Нэгэн зэрэг ижил текстийг засварлах боломжтой.
   • Alt+Shift+Down/Up (Windows/Linux) / Option+Shift+Down/Up (macOS): Одоогийн мөрийг дараагийн мөр/өмнөх мөрөнд хуулна.
   • Ctrl+/ (Windows/Linux) / Cmd+/ (macOS): Одоогийн мөрийг эсвэл сонгосон кодын блокыг тайлбарлах/тайлбарыг цуцлах.
   • Alt+Up/Down (Windows/Linux) / Option+Up/Down (macOS): Одоогийн мөрийг эсвэл сонгосон кодын блокыг дээш/доош шилжүүлнэ.
   • Ctrl+K Ctrl+S: Гарын товчлолын тохиргооны интерфэйсийг нээнэ, товчлолыг харж, өөрчлөх боломжтой.

2. Командын самбарыг сайн ашиглах: Ctrl+Shift+P / Cmd+Shift+P товчийг дарж командын самбарыг нээснээр янз бүрийн үйлдлийг гүйцэтгэх боломжтой, жишээлбэл:

   • Settings: Тохиргооны интерфэйсийг нээнэ.
   • Extensions: Install Extension: Өргөтгөл суулгана.
   • Git: Commit: Git-ийн өөрчлөлтийг илгээнэ.
   • Format Document: Одоогийн баримт бичгийг форматлана.
   • Go to Symbol in Workspace: Ажлын талбайн доторх тэмдэгт рүү хурдан үсэрнэ.

3. Тохиргоог өөрчлөх: VS Code нь хэрэглэгчдэд зориулж сэдэв, үсгийн хэлбэр, зай авах арга зэрэг олон төрлийн тохиргоог өөрчлөх боломж олгодог. File -> Preferences -> Settings цэсээр тохиргооны цонхыг нээх эсвэл settings.json файлыг шууд засварлах боломжтой.

   • Сэдэв: Өөрийн дуртай сэдвийг сонгох нь код бичихэд тав тухтай байдлыг нэмэгдүүлдэг.
   • Үсгийн хэлбэр: Кодыг уншихад хялбар болгохын тулд тохиромжтой үсгийн хэлбэрийг сонгоорой. Fira Code, JetBrains Mono гэх мэт тогтмол өргөнтэй үсгийн хэлбэрийг ашиглахыг зөвлөж байна.
   • Зай авах арга: Төслийн стандартын дагуу зай авах аргыг тохируулна уу. Зай эсвэл Tab товчийг ашиглаж болно.
   • Автоматаар хадгалах: Автоматаар хадгалах функцийг идэвхжүүлснээр хадгалахаа мартсанаас болж кодоо алдахаас сэргийлж болно.

4. Кодны хэсгүүдийг ашиглах (Code Snippets): Кодны хэсгүүд нь түгээмэл хэрэглэгддэг кодын блокуудыг хурдан оруулахад тусалдаг. VS Code нь зарим түгээмэл кодын хэсгүүдийг агуулдаг бөгөөд та өөрөө кодны хэсгүүдийг тохируулах боломжтой.

   • Командын самбарыг нээж Preferences: Configure User Snippets гэж бичээд засварлахыг хүссэн хэлээ сонгоод дараа нь кодны хэсгүүдийг засварлаж болно.
   • Жишээлбэл, JavaScript-д clog кодны хэсгийг үүсгэж console.log()-г хурдан оруулах боломжтой.

   "Print to console": {
       "prefix": "clog",
       "body": [
           "console.log('$1');",
           "$2"
       ],
       "description": "Log output to console"
   }
   

5. Олон курсор засварлах: Alt (Windows/Linux) / Option (macOS) товчийг дараад хулганаар дарж олон байршилд курсор үүсгэж, олон мөрийг нэгэн зэрэг засварлах боломжтой. Мөн Ctrl+D / Cmd+D товчийг ашиглан дараагийн тохирох зүйлийг сонгож, олон курсор засварлах боломжтой.

6. Засварлагчийг хуваах: Засварлагчийг олон цонхонд хувааж, олон файлыг нэгэн зэрэг үзэж, засварлах боломжтой. View -> Editor Layout -> Split Editor командыг ашиглан засварлагчийг хувааж болно.

7. Зайнаас хөгжүүлэх: VS Code нь Remote Development өргөтгөлийг санал болгодог бөгөөд энэ нь танд алсын серверийн кодоо локал дээрээ засварлах боломжийг олгодог. Энэ нь серверийн талын програм хөгжүүлэхэд маш хэрэгтэй.

8. VS Code-ийг хөтчид ашиглах: @@Prathkum-ийн дурдсанаар vscode.dev хаягаар зочилсноор та VS Code-ийг шууд хөтчид ашиглах боломжтой бөгөөд энэ нь хялбар бөгөөд хурдан юм. Энэ нь түр зуурын засвар хийх эсвэл VS Code суулгаагүй төхөөрөмж дээр ажиллахад маш хэрэгтэй. @@CompuIves-ийн ажил үүнийг улам сайжруулсан бөгөөд тэр VS Code-ийг шууд хөтчид ажиллуулж, CodeSandbox-ийн API-д холбож чадсан.

VS Code хэрэгслийн зөвлөмж: Өөрийн гэсэн IDE-г бүтээгээрэй

VS Code-ийн хүч чадал нь түүний баялаг өргөтгөлийн экосистемд оршдог. Доор түгээмэл хэрэглэгддэг өргөтгөлийн зөвлөмжийг орууллаа.

• Prettier: Код форматлах хэрэгсэл, кодыг автоматаар форматлаж, кодын хэв маягийг тогтвортой байлгах боломжтой.

  ext install esbenp.prettier-vscode
  

• ESLint: JavaScript кодын шалгах хэрэгсэл, кодын алдаа болон болзошгүй асуудлыг шалгах боломжтой.

  ext install dbaeumer.vscode-eslint
  ```*   **VS Code-д зориулсан EditorConfig:**  Янз бүрийн редакторуудын хооронд кодын загварыг тогтвортой байлгах хэрэгсэл.
  
  ```shell
  ext install EditorConfig.EditorConfig
  

• Live Server: Урд талын кодыг хурдан дебаг хийхэд зориулсан локал сервер ажиллуулах. @@ThreatSynop нь Live Server-ийн аюулгүй байдлын эмзэг байдлыг дурдаж, өргөтгөлийг ашиглахдаа аюулгүй байдалд анхаарахыг сануулж байна.

  ext install ritwickdey.LiveServer
  

• Code Runner: Кодын хэсгийг хурдан туршихын тулд олон програмчлалын хэлийг ажиллуулахыг дэмждэг. Үүнтэй адилаар @@ThreatSynop нь Code Runner-ийн аюулгүй байдлын эмзэг байдлыг онцолсон.

  ext install formulahendry.code-runner
  

• GitLens: Git-ийн функцийг сайжруулсан өргөтгөл, кодын коммит түүх, зохиогчийн мэдээлэл гэх мэтийг үзэх боломжтой.

  ext install eamodio.gitlens
  

• Bracket Pair Colorizer: Хаалтуудыг өнгөөр ялгаж, кодын бүтцийг харахад хялбар болгодог.

  ext install CoenraadS.bracket-pair-colorizer-2
  

• IntelliCode: (Microsoft-оос гаргасан) AI-ийн тусламжтайгаар кодыг автоматаар нөхөх, контекст дээр үндэслэн илүү ухаалаг кодын санал болгодог.

  ext install visualstudioexptteam.vscodeintellicode
  

• VS Code Copilot: (GitHub-аас гаргасан, төлбөртэй) AI код туслах, таны кодоор кодын хэсэг, функц, бүр бүхэл бүтэн файл үүсгэх боломжтой. @@aadhilkh нь VS Code Copilot-ийн өндөр үр ашгийг дурдсан.

• Markdown Preview Enhanced: Markdown-ийн илүү сайн урьдчилсан харагдах залгаас. @@ThreatSynop нь мөн энэ залгаасын аюулгүй байдлын асуудлуудыг онцолж, анхаарах шаардлагатай.

  ext install shd101wyy.markdown-preview-enhanced
  

• Remote Development өргөтгөлийн багц: SSH, Containers, WSL гэх мэт өргөтгөлүүдийг багтаасан бөгөөд алсын зайнаас хөгжүүлэхэд хялбар болгодог.

LLM болон VS Code-ийн интеграцийн тухай

X/Twitter дээр LLM болон VS Code-ийн интеграцийн талаар хэлэлцүүлэг өрнөсөн. @@akshay_pachaar нь VS Code-д LLM-ийг сургах аргыг хуваалцсан. @@MacopeninSUTABA нь Anthropic-ийн AI кодчилолын агент "Claude Code"-ийг VS Code-той нэгтгэсэн тухай дурдсан. Эдгээр нь ирээдүйн хөгжилд хиймэл оюун ухаан улам бүр чухал үүрэг гүйцэтгэх болно гэсэн дохио юм.

Аюулгүй байдлын зөвлөмж

@@ThreatSynop-ийн дурдсанчлан, зарим VS Code өргөтгөлүүд нь аюулгүй байдлын эмзэг байдалтай байж болох бөгөөд энэ нь файлын хулгай болон алсын зайнаас код ажиллуулахад хүргэж болзошгүй юм. Тиймээс өргөтгөлүүдийг ашиглахдаа дараах зүйлийг анхаарна уу:

• Албан ёсны эсвэл нэр хүндтэй өргөтгөлүүдийг сонгоорой.
• Өргөтгөлүүдийг тогтмол шинэчилж байгаарай.
• Өргөтгөлийн зөвшөөрлийн тайлбарыг анхааралтай уншаарай.
• Кодын шалгах хэрэгслийг суулгаарай, жишээлбэл ESLint, энэ нь танд кодын болзошгүй асуудлуудыг илрүүлэхэд тусална.
• VS Code болон өргөтгөлийн аюулгүй байдлын мэдэгдлийг дагаж, эмзэг байдлыг цаг тухайд нь засч байгаарай.## Дүгнэлт

VS Code нь хүчирхэг код засварлагчийн хувьд хөгжүүлэгчдийн ажлын бүтээмжийг дээшлүүлэхэд туслах олон тооны хэрэгтэй арга техник, өргөтгөлийн баялаг экосистемтэй. Товчлол, тохиргоог өөрчлөх, кодын хэсгүүдийг ашиглах, тохирох өргөтгөлүүдийг суулгах зэргээр VS Code-ийг өөрийн зориулалтын IDE болгон бүтээх боломжтой. Үүний зэрэгцээ аюулгүй байдлын асуудалд анхаарч, албан ёсны эсвэл нэр хүндтэй өргөтгөлүүдийг сонгож, өргөтгөлүүдийг тогтмол шинэчилж байх хэрэгтэй. Энэхүү нийтлэл танд тусална гэж найдаж байна!