For Web — фронтенд, дизайн, программирование
14.6K subscribers
5.47K photos
7 videos
5 files
1.74K links
Новости и полезности для фронтендеров.
Поддержать, чтобы в канале не было рекламы:
https://patreon.com/forweb
https://boosty.to/forweb
Download Telegram
Fig, полноценное автодополнение как в VS Code прямо в терминале → https://fig.io
Visual Viewport API: экспериментальный API, позволяющий узнавать и отслеживать изменение реальных размеров видимой области страницы → https://developer.mozilla.org/en-US/docs/Web/API/Visual_Viewport_API
Практическое введение в точечную реактивность: Райан Карниато объясняет принципы, лежащие в основе MobX, Vue, Svelte и Knockout → https://dev.to/ryansolid/a-hands-on-introduction-to-fine-grained-reactivity-3ndf
👍1
Хватит организовывать код по типу файлов: почему стоит попробовать организацию файлов по смыслу (например, по фичам или сущностям предметной области) → https://habr.com/ru/post/561240/
Изучаем тригонометрию с CSS и JavaScript: основы тригонометрии и способы её практического применения в серии статей Мишель Баркер.

1. Введение в тригонометрию
2. Творчески подходим к тригонометрическим функциям
3. Помимо треугольников: рисуем более сложные фигуры
Astro, новый инструмент для разработки сайтов с фокусом на минимум клиентского JS: используйте React, Svelte, Vue, Preact или веб-компоненты, получайте после сборки статический HTML, интерактивные компоненты подгружаются по необходимости → https://astro.build/blog/introducing-astro
👍1
Nano Stores, новый стейт-менеджер от Андрея Ситника (создателя PostCSS и Logux) с фокусом на атомарность сторов, тришейкинг и вынос логики из компонентов → https://github.com/ai/nanostores
Request Quest: викторина от Джейка Арчибальда, в которой нужно определить, приведёт ли выполнение примеров кода к инициированию HTTP-запроса браузерами → https://jakearchibald.github.io/request-quest/
Дизайнеры Treebo рассказали об опыте создания единой библиотеки иконок для своих продуктов: от мотивации до деталей реализации → https://tech.treebo.com/iconography-for-treebo-c379bc910da1
Лучше практики форм регистрации: чеклист приёмов, которые улучшат UX регистрации на вашем сайте → https://web.dev/sign-up-form-best-practices/
👍1
CSS Indexes, обновляемый справочник по всем терминам и понятиям CSS: свойства, функции, селекторы и многое другое → https://drafts.csswg.org/indexes
Дескрипторы шрифтов в CSS: новый способ уменьшить сдвиг элементов страницы при переключении на веб-шрифт за счёт подгона размеров фолбек-шрифта под загружаемый шрифт → https://www.smashingmagazine.com/2021/05/reduce-font-loading-impact-css-descriptors/
Проектируем таблицы для мобильных: обширное руководство по адаптации таблиц для узких экранов → https://www.uxmatters.com/mt/archives/2020/07/designing-mobile-tables.php
Iosevka, продвинутое семейство шрифтов для кода, терминалов и технических документов: отдельная узкая версия для повышения плотности текста, 17 наборов лигатур для разных языков программирования, настраиваемые символы в разных стилях и многое другое → https://typeof.net/Iosevka/
This media is not supported in your browser
VIEW IN TELEGRAM
Как запилить кастомный курсор: руководство по реализации и примеры практического применения из опыта креативного агентства 14islands → https://medium.com/p/89f1688a02eb
tiptap, крепкая основа для разработки WYSIWYG-редакторов:

— полный контроль над внешним видом;
— совместное редактирование, работа в офлайне и синхронизация между устройствами;
— не зависит от фреймворка;
— написана на TypeScript.

https://www.tiptap.dev
Тестирование фронтенда для всех: Евгений Клименченко с обзором видов тестирования фронтенда, от юнит-тестов до тестирования доступности → https://css-tricks.com/front-end-testing-is-for-everyone
Modern Unix, подборка современных и более удобных альтернатив стандартным утилитам командной строки → https://github.com/ibraheemdev/modern-unix
Скрипты для Nginx на JavaScript: Игорь Коровченко с обзором инструмента NJS, позволяющего использовать в Nginx скрипты на JS практически без потерь в скорости работы → https://web-standards.ru/articles/magic-njs/
mini-typescript, миниатюрная версия компилятора TypeScript для наглядного знакомства с его структурой и внутренним устройством → https://github.com/sandersn/mini-typescript
Вендоринг по умолчанию: мнение Тома МакРайта о пользе копирования исходников небольших зависимостей в свои проекты → https://macwright.com/2021/03/11/vendor-by-default.html