Vue-FAQ
940 subscribers
580 photos
92 videos
564 links
Канал сайта https://vue-faq.org
Информация о Vue.js, фронтенд разработке и не только

Contacts: @RuslanMakarov
Download Telegram
Release candidate готов (смена репозитория сверху слева)

К версии пакета для Vue 3 проектов и для встраивания в VitePress добавил Web components версию, так что можно запускать на React или простом HTML через <release-timeline />

Просьба потестить. Eсли кто проверит работает ли на Nuxt - буду благодарен

Вижу основное применение в замене changelog проектов в их доках на VitePress. При создании релиза на GitHub генеришь описание, правишь его.

Документация

#releasetimeline #pet
🔥5
This media is not supported in your browser
VIEW IN TELEGRAM
С утра на PHP распарсиваю HTML для нового пет-проекта

Настроение:

#pet #php #video
😁4👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Несколько лет назад нужна была анимация для синхронизации данных с сервером для немецкой системы высшего образования, сделалась вот такая кнопка / прогресс-бар.

Есть варианты на Vue 2, Vanilla JS и Web components. Может кто-то захочет проапгрейдить до Vue 3.

#pet #animation
🔥7
Много лет Google Tasks был таким сирым и убогим отпрыском в семействе продуктов Google. Из плюсов в нём был доступный API.

Из-за чрезмерной упрощенности Google Tasks ранее не пригождался, и для небольших напоминаний я давно использовал Google Calendar события + Google Keep или TickTick (который на телефоне постоянно выгружается из памяти), но тут обнаружил, что Google Tasks сильно переделали и привели в соответствующий эпохе вид. Даже в "канбан" доску засунули.

Выглядит удобоваримо. И семантика поправилась: "Позвонить Маше" - это, всё-таки, задача, а не событие.

Используя их API можно, кстати, сделать свои Задачи, и, с моей точки зрения, это намного более полезный пет-проект для фронтендера, нежели стандартный магазин. Потому что магазин ты слабал и выкинул, при собеседовании на них даже не смотрят, понимая, что 99% это просто чужая копия. А вот хорошо сделанными Задачами можно пользоваться самому или распространять их для других. Мне такие качественные приложения встречались.

#google #tasks #pet
👍10
Замутил тут проект от нечего делать.

Есть сайт знакомств, там 9000 кандидаток. Настоящих, не ботов.
Работает наподобие Тиндера - с пролистыванием. Ну и описание у каждой немаленькое.

Листать вручную и читать всё - влом
Написал на Playwright бота, который все это пролистал и загрузил как HTML.

Распарсил в JSON.
Выделил четкие параметры (возраст, блондинка/брюнетка, локейшн и т.п.) - это хард-скилы.
Выделил нечеткие - описание, увлечения, мечты и т.д. - это софт-скилы.

Загрузил все в БД.

Дальше фильтруем сперва по хард-скилам. Остается пару тысяч вариантов.

Выгружаем всё частями в CSV для экономии, и скармливаем батчами AI с нужным промптом - подходим ли по интересам, насколько серьёзные у нее намерения и тому подобное. В gpt-4o-mini, чтоб недорого.

Ну он ранжирует, и получаем 30 самых подходящих потенциальных невест с хорошим приданным и прямыми ссылками на профили.

День работы.

#pet #ai
😁25🥴6❤‍🔥3👎2🔥21🤣1
Как приятно выйти на пенсию и заниматься только пет-проектами...

Предпоследний - Библеистика

Фронт в целом занял где-то треть работы. Технически было много интересных моментов, особенно на бэке (сбор данных, нормализация, структурирование, размещение, организация/оптимизация передачи их на фронт, индексация, морфологический поиск и т.п.). Был (и есть) даже вариант, что сайт может быть полностью статичным, без бэка, даже с поиском.

В итоге сайт "сотки" и близко к ним выбивает на PageSpeed

Репозиторий

#pet
👎8🔥76👍3💊2💩1🕊1
Потестируйте и покритикуйте (UX, UI, функционал и др.) последний пет-проект

lissa-health.com

Позволяет держать в одном месте свою медицинскую информацию (лабораторные анализы, заключения, произвольные записи) и делать AI аналитику по ним

На сайте есть демо-видео
Также можно загрузить демо-данные

#lissa #pet
👍5🔥2👎1
Технические детали проекта выше

ark-ui в некоторых местах глючит, но как UI библиотека понравилась, буду использовать.

Для графика (chart) модели из TS переделал на классы (без реактивности внутри), стало намного удобней

AI очень помогает делать перевод сайта сразу на нескольких языках одновременно с кодингом

Используются разные LLM для парсинга файлов и аналитических отчетов (подешевле и подороже)

Кнопка справа внизу (FAB) идет как волшебная палочка - в ней разные действия в зависимости от страницы и контекста.
Её задача - сделать удобный UX, чтобы пользователь не бегал по всему экрану пальцем

PWA, variable fonts, JSON-RPC, JSON5

#lissa #pet #arkui
👍3🔥1
Вышло обновление моей Lissa Health - приложения для хранения личной медицинской информации и ИИ аналитики по данным

Добавлено: вложения файлов, экспорт данных, улучшено распознавание документов, исправлены ошибки в графиках, интегрирована YooKassa, партнерская программа

Наконец сделаны e2e (playwright) и API (phpunit) тесты

Создан канал с новостями о разработке приложения - @lissahealth

Подписывайтесь. Будете свидетелями рождения единорога.

#lissa #pet
👍8👏2
Деривативом к Lissa Health создался телеграмный ботик для AI распознавания текста на фото и картинках

@argus_ocr_bot

Позволяет задать один уточняющий вопрос после распознавания для фильтрации данных, форматирования, перевода на другой язык или еще чего-то

Примеры:
1. Сфотографировать квитанцию СДЭК => Оставь только номер отправления
2. Сфотографировать визитку => Сделай json
3. Сфотографировать непонятный текст => Переведи на русский

Критика и предложения welcome

#lissa #tgbot #argus
🔥8