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

Contacts: @RuslanMakarov
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Проджект менеджер объясняет джуну, что надо сделать

(осторожно, мат)

#humor #offtop
🤣13
Vue реализовала систему непрерывных релизов pkg.pr.new

Теперь можно локально поставить любой еще неопубликованный на NPM коммит для тестирования нового функционала фреймворка

pnpm add https://pkg.pr.new/vue@7a6c665


#vuejs
👍2
Тут еще один вариант портировать через WebView своё веб-приложение на мобильные и десктопные платформы нарисовался - Socket Runtime

Выглядит пока малоизведано

#mobile #desktop
👍4
Очень интересное интервью ведущего разработчика Yandex Cloud Андрея Мелихова о состоянии дел с Node.js.

Поговорили о том, полезен ли Node.js на бэкенде, нужна ли сквозная типизация между фронтом и бэком, мёртв ли PHP и многом другом.

Кратко: Node.js только для Next.js (BFF), для бэкенда есть много других более подходящих языков, включая PHP

#nodejs #interview #video
👍6👎3🤡31
This media is not supported in your browser
VIEW IN TELEGRAM
FormKit добавил AI себе в KickStart

Впечатляет.

Сейчас как раз экспериментирую с AI на проекте - им можно довольно сильно расширить функционал и повысить UX приложения самым разным образом.

#forms #formkit #ai
Nuxt славится своей агрессивной маркетинговой политикой, Vue на фоне его идет тихой сапой.

Но если посмотреть на NPM статистику скачивания пакетов для того и другого, то видно, что проектов на Vue где-то в 6-7 раз больше, чем проектов на Nuxt

#nuxt #vuejs #stats
5🗿2😁1💩1💊1
Еще один вариант для "умного" бэкенда как альтернатива Firebase и Supabase - Convex

Open source, можно сделать self-hosted, есть бесплатный тарифный план, но реализует все по-своему (= сильная привязка)

П.С. Попробовав разные `BaaS` решения пришел к выводу, что баловство всё это. Для сколь-нибудь серьезного продукта нужен свой сервер, своя база и свой бэк.

#baas #firebase #supabase #convex
👍4
Если говорить о действительно маст-хэвных скиллах фронтендера, то это никакие не VueUse-ы, а, например, UML.

Умение читать и составлять 3-4 основных типа диаграмм сильно помогает в описании структуры программы, потоков выполнения кода, умении сформулировать и выполнить задачу.

Визуальное представление очень облегчает понимание и декомпозицию сложных систем.

#uml #architevture
👍143👎3
Фронтендером нынче быть накладно...

FrontendConf

#conf #event
🤯21👎9😐2
К Дурову можно по-разному относиться, но людей, у которых руки растут не из жопы, он умеет находить

Chrome DevTools -> Memory -> Total JS heap size

#benchmark #telegram #nuxt

Web WhatsApp - 170MB
Slack - 125MB
VK.com - 120MB
Dzen.ru - 70MB
Nuxt.com - 40MB
Google Calendar - 40MB
Google.com (пустой) - 30MB
Web Telegram - 25MB
Vuejs.org, vue-faq.org - 5-10MB
👍25
This media is not supported in your browser
VIEW IN TELEGRAM
Этого человека убили сразу после интервью

Жуткая правда о js мета-фреймворках...

#video #vercel
👍6🤡1🗿1
Vue-FAQ
Этого человека убили сразу после интервью Жуткая правда о js мета-фреймворках... #video #vercel
Кратко, о чем нам поведал безвременно ушедший

В мире фронтед мета-фреймворков крутятся огромные деньги в виде рекламы, спонсорства и донатов - сотни миллионов долларов. Деньги просто так никто давать не будет. Смысл в том, чтобы втянуть молодых (18-20 лет) разработчиков в работу на этих фреймворках, чтобы потом стричь деньги со стартапов и компаний, которые будут нанимать подобных разработчиков, потому что размещать эти проекты будут на платформах типа Vercel, стоимость хостинга на которой в тысячи раз больше обычного хостинга.

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

При этом огромные деньги тратятся на продажных ютюберов и прочих инфлюенсеров, агрессивно впаривающих тебе эту шнягу из каждого утюга. Убеждающих, что если ты не используешь их "современные технологии", то ты какой-то ущербный. Часто это работает наподобие сетевого маркетинга типа продаж БАДов или продукции Avon.

В частности, следствием этого является, также, многолетняя ложь, что SEO без SSR невозможно, что Web Vitals с ними лучше и прочая маркетинговая ахинея.

Так что Nuxt, ребята, это не про свободу open source-а и лучшие практики.

Лучшие практики - это когда ты как пастушок с дудочкой пасешь коровок на экологически чистых горных альпийских лугах.

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

#nuxt #verсel #ssr
👍9💯4🤡1
Поставил рекламируемый AI IDE Cursor , задал одинаковый вопрос "increase fom=те size in vs code" ему и Codeium. Последний однозначно выиграл с комбинацией клавиш.

Это Cursor с gpt-4o. При переключении на claude-3.5-sonnet (он позволяет выбирать LLM) про клавиши сказал, про settings.json забыл.


Попробовал более кодерский промпт: "add new view "TestView.vue" with corresponding route"

Оба справились более-менее. Cursor пишет код детальней, по шагам, даже чересчур. Основной плюс - есть подсветка в коде во Vue файлах. Но пока не видно, чем он ощутимо лучше Codeium.

Тестировались бесплатные версии.
Продолжаем наблюдение.

#ai #codeium #cursor
👍4
Средняя школа в Аризоне, США

Родители должны давать явное письменное согласие, чтобы их отпрысков-шестикласников обучали числам, дробям, процентам и т.п.

#math #learning
😱9🤣6🤡2😁1🥴1
Vue-FAQ
Поставил рекламируемый AI IDE Cursor , задал одинаковый вопрос "increase fom=те size in vs code" ему и Codeium. Последний однозначно выиграл с комбинацией клавиш. Это Cursor с gpt-4o. При переключении на claude-3.5-sonnet (он позволяет выбирать LLM) про…
Погорячился я с выводами, Cursor действительно нечто иное.
Особенно его Composer - он может сам изменять разные файлы в проекте. Не сказать, чтобы прям за тебя всё кодит и думать не надо, но помогает неплохо.

Например, жмешь Ctrl+I , пишешь: @Codebase улучши стили BaseButton

Конечно, давайте улучшим стили для компонента BaseButton. Вот обновленный код с улучшенными стилями:

Основные изменения и улучшения:
- Добавлены новые пропсы: type для разных стилей кнопок и size для разных размеров.
- Добавлен проп disabled для отключения кнопки.
- Улучшена структура CSS с использованием классов для типов и размеров.
- Использованы переменные цветов из вашей темы для согласованности с общим дизайном.
- Добавлены эффекты при наведении и фокусировке для улучшения пользовательского опыта.
- Улучшена доступность с помощью стилей для :focus-visible.
- Добавлены стили для отключенного состояния кнопки.
- Эти изменения сделают ваш BaseButton компонент более гибким и соответствующим современным стандартам дизайна пользовательского интерфейса. Теперь вы можете использовать кнопку с разными типами и размерами, например:

<BaseButton type="primary" size="large">Большая основная кнопка</BaseButton>
<BaseButton type="secondary" size="medium">Средняя вторичная кнопка</BaseButton>
<BaseButton type="text" size="small">Маленькая текстовая кнопка</BaseButton>

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


Жмешь Accept All и всё. На сохраненном времени одной этой генерации он отрабатывает свою месячную зарплату на Pro тарифе.

Хотя, type у HTML button - зарезервированный атрибут, и тут он неудачно сделал. Так что, ползарплаты.

Интеграций с Вебштормом и другими IDE с закрытым кодом, скорей всего, не будет, потому что их Plugin API вряд ли позволяет так глубоко интегрироваться.

#ai #cursor
👍9
Анимацию в вебе обычно делают с помощью CSS (keyframes) или JavaScripts.

С появлением математических CSS функций таких как round(), mod(), sin() появился третий способ, сочетающий в себе плюсы обоих подходов

Здесь подробнее

#css #animation
👍2