Упражнение. Добавление контейнера разработки в существующий проект

Завершено

При настройке контейнера разработки для проекта необходимо сначала добавить конфигурацию контейнера в этот проект. Конфигурация контейнера настраивает среду в Visual Studio Code.

В этом упражнении вы добавите контейнер dev и откроете в нем проект Products Dashboard (Информационная панель продуктов).

Добавление контейнера разработки

1. Вернитесь в VS Code и клонированный ранее проект.

2. Нажмите клавишу F1, чтобы открыть палитру команд.

3. Введите фразу добавить контейнер разработки и выберите элемент Dev Containers: добавить файлы конфигурации контейнера разработки. В этом разделе представлен список шаблонов контейнеров разработки. Шаблоны содержат исходные файлы, необходимые для настройки полной среды разработки для указанного стека технологий.

4. Выберите " Добавить конфигурацию в папку данных пользователя".

5. Выберите следующие параметры.

   Вариант	Значение
   Выберите шаблон конфигурации контейнера	Python 3
   Python version	3.11
   Выберите дополнительные компоненты для установки	Выберите ОК

Важно!

На первом этапе при выборе шаблона конфигурации, возможно, потребуется выбрать "Показать все определения..." в списке. В таком случае, когда весь набор шаблонов загрузится, выберите Python.

В проект будет добавлена конфигурация контейнера разработки. Visual Studio Code сообщит, что теперь можно открыть проект в контейнере. Пока закройте это уведомление.

Проверка файлов конфигурации

1. Обратите внимание, что в проект была добавлена новая папка с именем .devcontainer.
2. Разверните эту папку и обратите внимание, что она содержит файл devcontainer.json.

Открытие проекта в контейнере

1. Нажмите клавишу F1, чтобы открыть палитру команд.
2. Введите reopen in container (повторно открыть в контейнере).
3. Выберите Dev Containers: Reopen in Container (Контейнеры разработки: повторно открыть в контейнере) в списке доступных параметров.

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

Просмотр удаленного индикатора

После сборки контейнера вы можете проверить, удалось ли к нему подключиться. Для этого просмотрите текст, отображаемый в удаленном индикаторе. Кроме того, теперь вы увидите файлы проекта, загруженные в VS Code.

• Изучите удаленный индикатор, просмотрев сведения в левом нижнем углу VS Code. Обратите внимание, что теперь здесь отображается текст "Контейнер разработки: Python 3".

  

Внимание

Вы можете заметить уведомления о Pylance или повышении производительности в Windows. Все отображаемые в VS Code уведомления можно закрыть. Вам не нужно выполнять эти действия.

Проверка контейнера

1. Откройте встроенный терминал в Visual Studio Code, нажав CTRL + `, если он еще не открыт.

2. Обратите внимание, что командная строка терминала может отличаться от обычной командной строки терминала.

   

3. Выполните следующую команду, чтобы убедиться, что установлена нужна версия Python:

   python --version
   

   В выводе терминала должна быть указана версия Python, используемая в контейнере.

Установка зависимостей проекта

• Выполните следующую команду в терминале, чтобы установить зависимости Flask, необходимые для запуска проекта:

  pip3 install --user -r requirements.txt
  

Запуск проекта

1. Введите в терминале следующую команду, чтобы запустить проект:

   python app.py
   

2. Откройте проект в браузере, перейдя по адресу http://127.0.0.1:5000.

   

Отлично! У вас есть веб-приложение Python с Flask, работающее на вашем компьютере, и вы, возможно, даже не знаете, что это такое. Это нормально. Это и необязательно. Контейнер отвечает за настройку всей среды.

Из следующего раздела вы узнаете, как автоматизировать установку зависимостей с помощью файла devcontainer.json и как настроить VS Code для этого проекта Python.