Pull to refresh

Справочник здорового питания из Вкусвилл

Level of difficultyEasy
Reading time2 min
Views7.4K
Когда уже 10 минут пытаешься выбрать самое полезное печенье
Когда уже 10 минут пытаешься выбрать самое полезное печенье

Привет, Хабр!

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

Оказалось, найти в сетевых магазинах подходящие продукты не так уж и просто. Замучавшись выискивать на полке с готовой едой самое высокобелковое блюдо, я задался вопросом - а можно ли упростить этот процесс? В процессе размышления я пришел к идее сделать справочник продуктов из сетевых магазинов с продвинутыми сортировками и фильтрацией.

Для MVP был выбран каталог сети Вкусвилл, как позиционирующей себя для здорового питания. Я написал простой скрипт на Python с использованием Selenium, который ходил по онлайн-каталогу этой сети и парсил в JSON данные о БЖУ, калориях и цене продуктов. Каталог никак не препятствовал автоматическому обходу, и уже через пару часов у меня были готовы JSON-чики для нескольких категорий товаров.

Далее я вооружился Vue и Nuxt.JS с UI-библиотекой PrimeVue, и создал веб-интерфейс для просмотра данных. Из PrimeVue я использовал компонент таблицы с уже реализованными сортировками - удобно! Благодаря Nuxt.JS, сайт получился статическим, и я захостил его на Guthub Pages. Благодаря вёрстве на флексбоксах, сайт адаптивен и удобен даже с телефона.

Текущий UI
Текущий UI

В первой версии можно сортировать таблицу, выбирая низкоуглеводные, высокобелковые, низкокалорийные продукты - что больше подходит под ваш стиль питания. Например, вы любите сладости, но хотите придерживаться низкоуглеводной диеты. Отсортируйте таблицу "Сладости" по возрастанию столбца "Углеводы", и увидите, что в протеиновом брауни всего лишь 7г. углеводов,. А самой низкокалорийной сладостью будет веганский десерт "Ананасовый" - всего 165 ккал! Также есть раздел с вегетарианским питанием.

В планах добавить более сложные фильтры (например, ограничение по цене). Сейчас база данных составлена из каталога Вкусвилл для Петербурга. В будущем возможно выкачаю всероссийский каталог. На более позднем этапе развития возможно добавление каталогов других сетей.

Исходный код проекта на GitHub

С Новым Годом!

Tags:
Hubs:
Total votes 5: ↑4 and ↓1+3
Comments10

Articles