https://user-images.githubusercontent.com/1911623/52807635-d5043480-306a-11e9-9b03-351b7cda4936.gif

Забыл что Telegram жмет gif, больше такого не повторится 🫢

Сегодня я расскажу вам о своём любимом расширении для VS Code.

JavaScript Booster — предоставляет различные быстрые исправления (More Actions…) при написании кода на JavaScript и TypeScript. Перевести function declaration в function expression и наоборот, конвертировать строку в шаблонную, обернуть React компонент в forwardRef и тд.

Figma выкатила самый жирный апдейт года — жирнющий Dev Mode, Figma в VS Code, интеграция со Storybook, Jira и GitHub, переменные, определение локализации, Wrap Auto Layout, обновленный Font picker, редизайн File browser, продвинутые прототипы и прочее мелочи.

https://figma.com/whats-new/

Пропозал Change Array by copy теперь поддерживается всеми браузерами!

Firefox (последний) недавно добавил поддержку в v115, а также Mozilla объявила, что версия Firefox v115 станет последней, которая будет поддерживать Windows 7, 8, и 8.1, а также macOS 10.12, macOS 10.13 и macOS 10.14. Пользователи будут получать обновления безопасности до сентября 2024 года.

Новые Array immutable методы к изучению:
- toSorted
- toReversed
- toSpliced
- with

Codesandbox прямо в VS Code.

Недавно стал снова использовать Stackblitz. У меня были какие-то странные проблемы с Codesandbox, подсветка синтаксиса, отсутствие настроек ESLint (покрайней мере я не нашел настроек). Расширение выглядит очень даже интересным, лишний раз не нужно заходить на сайт, при этом открывается больше возможностей внутри самого редактора, ваши индивидуальные настройки, которых нету на сайте, сниппеты, расширения и тд.

https://marketplace.visualstudio.com/items?itemName=CodeSandbox-io.codesandbox-projects

Solid.js в массы 🔥

Я эти мысли про Solid хотел написать еще раньше, но тут мне приглянулся интересный видос, сравнивающий концепцию React с Solid, также меня в последнее время сильно напрягает развитие React в сторону гибридных компонентов (RSC) и отказ от развития SPA.

Вкратце, я хочу сказать, что наличие Solid на рынке дает новый глоток воздуха для React разработчика.

Лично я жду стабильный релиз их метафреймворка SolidStart, который, как я надеюсь, станет убийцей Next.js.

В обновлении Node.js 20.4.0 уже добавили поддержку Symbol.dispose Symbol.asyncDispose.
Кроме того, в node:test теперь можно мокать таймеры.

https://nodejs.org/en/blog/release/v20.4.0

Интересное из обновления VS Code 1.80

- Встроенный терминал теперь поддерживает отображение изображений.
- Добавлена новая настройка files.dialog.defaultPath, которая позволяет изменить стандартный путь при открытии проводника для сохранения или открытия файла.
- При поиске теперь учитываются исключения из файла .gitignore, если включена настройка search.useIgnoreFiles.
- Параметр editor.smartSelect.selectSubwords позволяет настроить выделение подслова. По умолчанию подслова выделяются, но теперь это можно отключить.

https://code.visualstudio.com/updates/v1_80

Prisma 5: Еще быстрее 🔥

Мажорное обновление Prisma привнесло мало чего нового ы плане функционала.
Была проведена огромная работа по улучшению перформанса, уменьшен бандлсайз, jsonProtocol включен по умолчанию, ускорен холодный запуск в 9 раз.

Интересно, что там у конкурентов. Drizzle, TypeORM... 🤔

Какую ORM используете Вы и почему?

Как создать favicon в 2023 году

Ранее я часто задавался вопросом о том, как правильно создавать и использовать favicon. Похоже, что до сих пор я не знаю, как это делается правильно, самое главное чтобы было кроссбраузерно 😁

В блоге Evil Martians есть информация о том, как создавать и использовать favicon правильно: https://evilmartians.com/chronicles/how-to-favicon-in-2021-six-files-that-fit-most-needs

- Для легаси браузеров используйте в корне сайта favicon.ico.
- Для устройств на Android используйте webmanifest с иконками размером 192x192 и 512x512.
- Оптимизируйте png и svg иконки с помощью инструментов svgo и Squoosh.
- Используйте svg иконку со светлой/темной версией для современных браузеров.

NPM теперь имеет галочку верификации пакета, опубликованный через GitHub Actions.

https://github.blog/2023-04-19-introducing-npm-package-provenance/

Краткий гайд как добавить галочку [тык]:
- В package.json указать repository.url
- В GitHub Actions workflow указать env NPM_CONFIG_PROVENANCE: true и id-token: write в permissions
- Выставить версию Node.js 18

В create-vite было добавлено много новых темплейтов и парочка фреймворков.

Фреймворки:
- Solid
- Qwik

Добавился пункт Others, который включает в себя create-vite-extra и create-electron-vite темплейты.

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

Многие тут не в курсе до сих пор где я, и почему канал пустовал больше месяца. Поэтому, предлагаю вам подписаться на мой Telegram форум «ТВИЧ КОРЫТО» (я пишу в топике VS_Code Web_Storm).

В ближайшую неделю планирую начать писать хоть какие-нибудь посты, на очереди разбор грядущих обновлений Vitest 1.0 и Vite 5.0.

До сих пор не придумал название для канала. Пускай пока будет так 😄
Пишите в комментариях, если есть идеи 🤔

Оказывается с версии Node.js 20.6.0 была встроена поддержка .env
Прощай dotenv получается 😁

Вышел Mantine 7.0 🎉

Из самого вкусного, то что теперь библиотека не зависит от emotion css-in-js, тем самым, это изменение повышает производительность, уменьшает размер js-бандла и позволяет использовать библиотеку в средах, где css-in-js не поддерживается, например, Next.js с App Router.

- Список изменений - https://mantine.dev/changelog/7-0-0
- Релиз на GitHub - https://github.com/mantinedev/mantine/releases/tag/7.0.0

Всем привет. Немного подпропал ибо происходило много всего интересного.

Но давайте по порядку:
1. Официально подтвердили мое участие в ufadevconf. Начинаю готовиться с докладом "JS которого нет", в котором буду обсуждать заблуждения и мифы вокруг языка JS, а так же как 1 язык существует сразу в нескольких реальностях.

2. Совершенно спонтанно из моей идеи сделать курс по вью и прогнать по нему 1 человека это превратилось в публичную серию лекций по ускоренному изучению Vue за 2 недели (ауф маркетинг XD). Принять участие в нем может любой и совершенно бесплатно, кто напишет мне в лс с просьбой в участии.

Как будет все происходить
1. Мы будем все собираться в районе 17-18 00 по мск на стриме (поэтому +- кто работает будет ок)
2. Будет лекция с вопросами/ответами на 1,5-2ч
3. Будет домашка чтоб быстро закрепить пройденное
4. Будем смотреть прошлую домашку либо по желанию, либо рандомно
5. На финалочку смотрим проект по реализацию real time чата с реактивностью, фильтрами и тп

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