Практичен водич за 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, изберете го јазикот што сакате да го уредите, а потоа можете да уредувате исечоци од код.
   • На пример, можете да креирате исечок од код clog за JavaScript за брзо да вметнете 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 директно во прелистувачот и се поврза со API-то на CodeSandbox.

VS Code Препораки за алатки: Создадете го вашето сопствено IDE

Силата на VS Code лежи во неговиот богат екосистем на екстензии. Еве неколку препораки за често користени екстензии:

• Prettier: Алатка за форматирање на код, може автоматски да го форматира кодот и да одржува конзистентен стил на код.

  ext install esbenp.prettier-vscode
  

• ESLint: Алатка за проверка на JavaScript код, може да ги провери грешките и потенцијалните проблеми во кодот.

  ext install dbaeumer.vscode-eslint
  ```*   **EditorConfig за VS Code:** Алатка за одржување на конзистентност на стилот на кодот помеѓу различни уредувачи.
  
  ```shell
  ext install EditorConfig.EditorConfig
  

• Live Server: Брзо стартување на локален сервер, за полесно дебагирање на front-end код. @@ThreatSynop споменува безбедносен пропуст во Live Server, потсетувајќи ги програмерите да внимаваат на безбедноста при користење на екстензијата.

  ext install ritwickdey.LiveServer
  

• Code Runner: Поддржува извршување на повеќе програмски јазици, за полесно брзо тестирање на фрагменти од код. Исто така, @@ThreatSynop посочува безбедносен пропуст во Code Runner.

  ext install formulahendry.code-runner
  

• GitLens: Екстензија која ги подобрува Git функционалностите, овозможува прегледување на историјата на commit-и, информации за авторот итн.

  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 сподели метод за тренирање на LLM во VS Code. @@MacopeninSUTABA спомена интеграција на AI агентот за кодирање на Anthropic "Claude Code" со VS Code. Сето ова навестува дека AI ќе игра сè поважна улога во идниот развој.

Безбедносни совети

Како што спомена @@ThreatSynop, некои екстензии за VS Code имаат безбедносни пропусти, кои можат да доведат до кражба на датотеки и далечинско извршување на код. Затоа, при користење на екстензии, внимавајте на следниве точки:

• Изберете официјални или екстензии со добра репутација.
• Редовно ажурирајте ги екстензиите.
• Внимателно прочитајте ги објаснувањата за дозволите на екстензиите.
• Инсталирајте алатки за проверка на кодот, како што е ESLint, кои можат да ви помогнат да откриете потенцијални проблеми во кодот.
• Следете ги безбедносните известувања за VS Code и екстензиите и навремено поправете ги пропустите.## Заклучок

VS Code, како моќен уредувач на код, има многу практични техники и богат екосистем на екстензии, кои можат да им помогнат на програмерите да ја подобрат ефикасноста на развојот. Со совладување на кратенки на тастатурата, прилагодени поставки, користење на фрагменти од код, инсталирање соодветни екстензии итн., можете да го претворите VS Code во ваше сопствено IDE. Во исто време, треба да обрнете внимание и на безбедносните прашања, да изберете официјални или реномирани екстензии и редовно да ги ажурирате екстензиите. Се надевам дека овој напис ви помогна!