Windows-пользователи на месте?

На прошлой неделе Microsoft показала Dev Home и многое другое.

Dev Home - это новый центр управления для Windows, предоставляющий возможность отслеживать проекты на панели мониторинга с помощью настраиваемых мини-приложений, настраивать среду разработки путем скачивания приложений, пакетов или репозиториев, подключаться к учетным записям разработчиков и их средствам (например, GitHub), а также создавать диск разработки для хранения всего в одном месте.

Для разработчиков, которые используют Windows 11, выглядит это даже привлекательно. Кроме того, Microsoft объявила, что больше не будет поддерживать приложение Cortana в Windows 10 и Windows 11 в конце этого года из-за глубокой интеграции Copilot в Windows.

https://youtu.be/bC-60KNgLuE

TypeScript 5.2 представит новый оператор — using, которое вы можете использовать для удаления чего-либо с помощью функции [Symbol.dispose], когда оно выходит из области видимости.

С оператором using я еще познакомился в С#. Оно позволяет создавать блок кода, в котором происходит автоматическое освобождение ресурсов после завершения работы с ними. Таким образом, использование using позволяет управлять ресурсами в вашей программе, а сборщик мусора отслеживает неиспользуемые объекты и автоматически освобождает память, занимаемую ими.

TypeScript issue: https://github.com/microsoft/TypeScript/issues/52955
Proposal в TC39: https://github.com/tc39/proposal-explicit-resource-management

В обновлении TypeScript 5.2 будет исправлена ошибка для union массивов. Для обхода этой ошибки приходилось использовать метод, аналогичный тому, который используется в примере с fn2.

Panda CSS — новый продукт от разработчиков ChakraUI 🎉

Zero-runtime, поддержка серверных компонентов, variants, design tokens.
Работает в React, Next.js, Svelte и других.

Генерирует современный CSS код во время сборки использует современные возможности, такие как cascade layers, селекторы where и CSS переменные. Как аналог vanilla-extract и stitches пойдет 👍

На этой неделе планирую писать только про расширения для VS Code, первое из таких мне попалось в Twitter и я сразу же взял его на вооружение.

Git File History — интуитивно понятный интерфейс для просмотра истории изменений в git.

Также для просмотра истории можно использовать команду git blame, или же на самом GitHub есть кнопка "blame", когда просматриваете файл.

Пишите в комментариях, какие вы используете приложения для просмотра git истории.

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.