Вправа – огляд інтерфейсу користувача коду Visual Studio

Завершено

Visual Studio Code надає інструменти для розробників, які тільки починають, але також розширюються та просунуті достатньо для професійних розробників.

У цій вправі ви відкриваєте Visual Studio Code і завершите швидку демонстрацію інтерфейсу користувача.

Відкрийте код Visual Studio та перегляньте сторінку привітання

  1. Скористайтеся меню "Пуск" Windows, щоб відкрити код Visual Studio.

    Якщо відкрити меню "Пуск" у Windows, ви побачите код Visual Studio у списку нещодавно доданих програм. Також можна прокрутити вниз, щоб знайти код Visual Studio.

    Інший варіант – ввести код Visual Studio в полі Пошуку Windows на панелі запуску в нижній частині екрана.

  2. Зверніть увагу, що код Visual Studio відкриється на сторінці "Ласкаво просимо", яка містить деякі посилання та інші відомості.

    Під час першого відкриття коду Visual Studio на сторінці привітання відображаються корисні покрокові вказівки, наприклад вміст "Початок роботи з кодом VS ". Ви можете перевірити цю інформацію під час відпочинку ще раз.

  3. Щоб закрити сторінку привітання, натисніть кнопку Закрити (в інтерфейсі відображається символ X ).

    Кожна сторінка, відкрита в редакторі, містить кнопку Закрити (X), розташовану праворуч від заголовка сторінки. Вкладка Сторінка привітання відображається у верхній лівій частині вікна Visual Studio Code під головним меню. Якщо навести вказівник миші на X, з'явиться слово Закрити .

Перевірка панелі дій і бічної панелі

  1. Зверніть увагу, що бічну панель праворуч від панелі дій згорнуто.

    Ви можете згадати, що панель дій – це вертикальний список піктограм у лівому куті вікна Visual Studio Code. Вміст бічної панелі залежить від того, що зараз вибрано на панелі дій.

  2. Наведіть вказівник миші на панель дій і наведіть вказівник миші на кожну з піктограм, щоб відобразити підписи.

    Підпис відображається, якщо навести вказівник миші на піктограми. На зображенні нижче відображаються кнопки панелі дій:

    Знімок екрана: панель дій із кодом Visual Studio з позначеними піктограмами.

    Згори вниз розташовано піктограми панелі дій: Explorer, Search, Source Control, Run and Debug, Extensions, Accounts і Manage.

  3. На панелі дій виберіть Провідник.

    Бічна панель має відкривати та відображати контекстні відомості.

  4. Зверніть увагу, що бічну панель тепер позначено провідником.

    Подання EXPLORER використовується для доступу до папок проекту та файлів коду.

    Код Visual Studio запам'ятає журнал роботи та відкриє найновіші файли проекту, коли він відкриється. Оскільки ви вперше відкрили код Visual Studio, папку проекту не відкрито.

  5. На панелі Дій виберіть розширення.

  6. Зверніть увагу, що бічну панель тепер позначено розширеннями.

  7. Перевірте відомості, які відображаються в поданні EXTENSIONS , зачекайте.

    Розширення Visual Studio Code дають змогу додавати мови кодування, налагоджувачі та інші інструменти до середовища на підтримку робочого циклу розробки. Ви інсталюєте розширення C# пізніше в цьому модулі.

  8. На панелі Дії, щоб закрити бічну панель EXTENSIONS , виберіть Розширення.

Перевірка основних параметрів меню

  1. Щоб переглянути параметри меню Файл, виберіть Файл.

  2. Зверніть увагу на параметри Створити, Відкрити, Зберегти та Закрити , перелічені в меню Файл .

  3. Знайдіть хвилинку, щоб перевірити параметри меню Редагування , а потім кожен з інших елементів меню верхнього рівня.

  4. Зверніть увагу, що деякі меню містять параметри взаємодії з кодом.

    Наприклад:

    • Меню Редагування містить параметри пошуку, заміни та перемикача приміток коду, а також стандартного вирізання, копіювання, вставлення, скасування та повторення.
    • Меню Виділення містить параметри вибору та керування рядками коду.
    • Меню Виконати містить параметри запуску та налагодження програми.
  5. У меню терміналу виберіть Новий термінал.

  6. Знайдіть хвилинку, щоб перевірити вміст панелі терміналів.

    Ви можете переключатися між вкладками (PROBLEMS, OUTPUT, DEBUG CONSOLE і TERMINAL) і навести вказівник миші на кнопки (у верхньому правому куті), щоб відобразити підписи кнопок.

  7. Зверніть увагу, що панель терміналів містить командний рядок.

    Панель терміналів можна використовувати для запуску команд інтерфейсу командного рядка (CLI). Ви використовуватимете команди .NET CLI пізніше в цьому модулі.

  8. У верхньому правому куті панелі терміналів виберіть X (Закрити панель).

  9. У меню Вигляд виберіть Палітра команд

    Палітру команд можна використовувати для пошуку та виконання будь-яких корисних команд. У вас немає часу (або необхідності) детально вивчити їх зараз, але добре знати, де знайти палітру команд.

  10. У командному рядку палітри введіть розширення

    Зверніть увагу, що список команд фільтрується на основі вашого запису.

  11. Щоб оновити відфільтрований список команд, змініть розширення , щоб допомогти

  12. У списку параметрів команд виберіть Довідка: Інтерактивний дитячий майданчик редактора.

    Документ "Дитячий майданчик редактора", який відкривається в редакторі, містить список інтерактивних дій.

  13. У маркірованому списку інтерактивних дій виберіть Форматування.

  14. Ознайомтеся з параметрами форматування за хвилину.

    Ви використовуватимете команди форматування коду під час дій, докладніше про програмування C#.

  15. Закрийте документ "Дитячий майданчик редактора".

Це завершить демонстрацію інтерфейсу користувача Visual Studio Code. Коли ви почнете кодування, навчальні матеріали продовжують вказувати на способи, якими Visual Studio Code може підвищити продуктивність.