В этой статье речь пойдет о разработке и развертывании простейшего дашборда по COVID-19 с помощью Streamlit. Streamlit — фреймворк, предназначенный для быстрой разработка веб приложений с помощью php и mysql по обработке данных путем развертывания организованного на Python пользовательского интерфейса. Streamlit не требует от разработчика предшествующего опыта (хотя практические навыки, конечно, не помешают).
Начнем с создания виртуальной среды для проекта. Затем напишем код на Python, который будет служить движком приложения. Потом воспользуемся библиотекой Streamlit, чтобы создать пользовательский интерфейс для кода на Python, и, наконец, развернем приложение. Надеюсь, это пошаговое руководство даст вам полное представление о процессе разработка веб приложений на python.
Настройка виртуальной среды
Приступая к работе над проектом, первым делом надо установить виртуальную среду. Представьте себе виртуальную среду как место, пригодное для жизни вашего приложения и полностью отгороженное от остального мира.
Виртуальная среда не должна ничего знать ни о других программах, написанных вами, ни о библиотеках Python, которые вы установили. Это важно, потому что библиотеки Python, уже установленные на компьютере, могут создать проблемы для нового приложения.
Например, последняя версия пакета может сломать код из-за устаревания некоторых функций. Виртуальные среды решают эту проблему, позволяя разработчику учитывать версии используемых библиотек и отделять их от уже установленных на компьютере, что позволяет предотвратить перезапись и конфликт зависимостей.
Кроме того, виртуальная среда помогает поддерживать чистоту и организованность разработки. Приложение, вероятно, не будет использовать все библиотеки Python, установленные на компьютере. Если создавать его вне виртуальной среды, каждую библиотеку надо было бы включить в так называемый файл требований (подробнее об этом позже), необходимый для развертывания приложения. Это привело бы к значительному раздуванию кода.
Чтобы настроить виртуальную среду, откройте терминал или командную строку. Если работаете на Mac, перейдите к рабочему столу, набрав cd desktop, а для windows это будет cd C:\Users\YOUR PC USERNAME\Desktop. Затем введите mkdir streamlit_project && cd streamlit_project. В каталоге проекта создайте виртуальную среду с помощью python3 -m venv, за которым следует любое название. Обычно виртуальные среды называют .venv, но в данном примере будет virt_env. Вот как это выглядит:
python3 -m venv virt_env # Mac
python -m venv virt_env # Windows
Теперь можно активировать виртуальную среду и приступить к установке пакетов, необходимых для проекта. Чтобы активировать виртуальную среду, введите одну из следующих комбинаций в зависимости от типа операционной системы:
source virt_env/bin/activate # Mac
virt_env\Scripts\activate # Windows
После активации вы должны увидеть
(virt_env) …
Создание приложения
Теперь установим streamlit и другие пакеты, которые понадобятся в приложении на Python:
python3 -m pip install streamlit # Mac
python -m pip install streamlit # Windows
python3 -m pip install pandas # Mac
python -m pip install pandas # Windows
python3 -m pip install matplotlib # Mac
python -m pip install matplotlib # Windows
После установки этих пакетов скопируйте и вставьте код из Github-репозитория, сохранив его под именем covid_dashboard.py в каталоге виртуальной среды. Этот файл Python, содержащий приложение streamlit, выполняет две основные задачи.
1) Вычисляет четыре метрики.
2) Строит граф временных рядов новых случаев по штатам.
Объясню каждый раздел более подробно.
@st.cache(allow_output_mutation=True)
def load_dataset():
try:
df = pd.read_csv(
«https://raw.githubusercontent.com/nytimes/covid-19-data/master/us-counties.csv», sep=»,»)
states = list(df[‘state’].unique())
except:
Exception
return df, states
Функция load_dataset() извлекает все данные по COVID-19 из аккаунта NYT на Github и создает список штатов США для фильтрации. Важно использовать st.cache над этой функцией, чтобы сохранить весь набор данных в памяти. В таком случае программе не придется перезагружать весь набор данных каждый раз при применении другого фильтра.
def pct_change(data, state, today):
….
Функция pct_change принимает три аргумента: набор данных по COVID-19, штат, выбранный нами в выпадающем списке и сегодняшнюю дату. Эта функция возвращает словарь с четырьмя метриками (новые случаи, изменение по случаям за 14 дней, новые смерти и изменение по смертям за 14 дней).
def chart_data(data, state):
…
def chart_data берет набор данных по COVID-19 и выбранный штат из выпадающего списка и возвращает временной ряд данных о новых случаях для выбранного штата.
Переходим к последней части кода (именно здесь вызываются функции, а данные возвращаются и отображаются в приложении). Вызываемая функция load_dataset() создает датафрейм и список штатов США. Затем создаем выпадающий список с помощью st.selectbox, добавляем к нему метку и список штатов. Добавляем логику, когда выпадающий список выбран.
Наконец, streamlit предлагает удобный способ добавления колонок и графов на веб-страницу, создавая более чистый общий формат. Главное преимущество — возможность создавать организованные и отзывчивые HTML-компоненты на чистом Python с минимальным количеством кода.
df, states = load_dataset()
state_dropdown = st.selectbox(‘Select a State’, states)
if state_dropdown:
data_dict = pct_change(df, state_dropdown, today)
col1, col2, col3, col4 = st.columns(4)
col1.markdown(f»New Cases: {data_dict[‘Cases’]}»)
col2.markdown(
f»»»<p>14-Day Change: <span style=»color:red»>{data_dict[‘Case Change’]}%</span></p>»»», unsafe_allow_html=True)
col3.markdown(f»New Deaths: {data_dict[‘Deaths’]}»)
col4.markdown(f»»»<p>14-Day Change: <span style=»color:red»>{data_dict[‘Death Change’]}%</span></p>»»», unsafe_allow_html=True)
chart_data = chart_data(df, state_dropdown)
st.line_chart(chart_data)
Развертывание приложения: начальные шаги
Пока созданное в виртуальной среде приложение streamlit живет только на локальном компьютере. Чтобы поделиться им со всем миром, нужно установить Git и Heroku.
Чтобы установить Git, откройте новое окно командной строки и на Mac введите:
git —version
Должно появиться всплывающее окно с дальнейшими инструкциями, позволяющее продолжить установку. Если вы пользователь Windows, используйте следующую ссылку для загрузки Git.
Чтобы установить Heroku на Mac, сначала установите Homebrew (если этого еще не сделали), а затем введите в новом окне терминала:
brew tap heroku/brew && brew install heroku
Если компьютер Mac работает на чипе M1, может произойти ошибка. Для решения проблемы воспользуйтесь страницей поддержки Apple.
Если вы пользователь Windows, используйте следующую ссылку для загрузки Heroku CLI.
После установки этих зависимостей можно опубликовать код на Github. Сначала создайте файл .gitignore, чтобы исключить файл виртуальной среды из репозитория Github, а затем измените его, введя virt_env/ (сохраните файл после внесения изменений):
(virt_env) > touch .gitignore # Mac
(virt_env) > echo.>.gitignore # Windows
Теперь инициализируйте Git в окне командной строки, где активна виртуальная среда, через git:
git init
git add -A
git commit -m «initial commit»
Войдите в аккаунт Github, создайте новый репозиторий, а затем выберите опцию Push an existing repository from the command line. Скопируйте и вставьте фрагмент кода из этой опции в командную строку, где запущена виртуальная среда.
Чтобы завершить этот этап, создайте файл требований с помощью pip freeze. Это сообщит веб-серверу, какие зависимости ему необходимы для успешного запуска приложения.
python -m pip freeze > requirements.txt
Создайте новый файл в каталоге виртуальной среды под названием setup.sh и сохраните в нем следующее:
mkdir -p ~/.streamlit/
echo «\
[server]\n\
headless = true\n\
port = $PORT\n\
enableCORS = false\n\
\n\
» > ~/.streamlit/config.toml
Затем создайте Procfile (назовите его просто Procfile) в каталоге виртуальной среды и сохраните в нем следующее:
web: sh setup.sh && streamlit run covid_dashboard.py
Теперь пришло время добавить файлы requirements.txt, Procfile и setup.sh в репозиторий Github:
git add -A
git commit -m «files for Heroku deployment»
git push -u origin main
Развертывание приложения на Heroku
Чтобы развернуть приложение в производственной среде, введите следующее в командной строке, где запущена виртуальная среда:
(virt_env) > heroku login
(virt_env) > heroku create
Это создаст случайное url-имя и развернет приложение, что займет 1–2 минуты. Вы должны увидеть в командной строке url, подобный приведенному здесь. Можете скопировать его в свой браузер.
Надеюсь, после прочтения этой статьи времена, когда код был заперт на вашем компьютере, уйдут в прошлое навсегда.
