Forwarded from Исходный Код
ИИ может быстро собрать DatePicker, но доступным по WCAG он от этого не становится.
ℹ️ На Хабре новая статья
❓ Ответили на главный вопрос:
ℹ️ Если делаете интерфейсы на React и не хотите получить формально доступный, но неудобный компонент, вот разбор по делу.
🔗 Читать статью на Хабре!
Разобрали кейс, где Claude помог с каркасом React-компонента, а дальше началась нормальная инженерная работа: тесты, правки, проверки на реальных сценариях и решения, которые не всегда совпадают со спецификацией один в один.
Где ИИ правда экономит время, а где без ручной доводки получается «почти работает»?
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
✍️ Aston Script – каллиграфический шрифт с витиеватыми заглавными и строчными буквами. Пример использования можно посмотреть в заголовках макетов Colour Palettes/Moodboards
Сайтодел | #шрифт
Сайтодел | #шрифт
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Inner Glow Card – прозрачная карточка с внутренней неоновой подсветкой. Рамка имеет волнообразную анимацию, цвета плавно перетекают друг в друга.
Сайтодел | #сниппет #css
Сайтодел | #сниппет #css
🐙 Aos – библиотека анимаций для JavaScript, сокращенно от "Animate On Scroll". Она позволяет не только пользоваться готовыми анимациями скролла, но и кастомизировать их для любого проекта.
Сайтодел | #репозиторий #github
Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 Travalizer – макет приложения с советами для путешественников. Теплые оттенки зеленого и кремового ассоциируются с природой и отпуском.
Сайтодел | #макет #figma
Сайтодел | #макет #figma
This media is not supported in your browser
VIEW IN TELEGRAM
💾 CSS3 Speedometer Emoji Gauge – шкала оценки, где каждой реакции соответствует свой цвет и эмодзи. Перетаскивать можно только бегунок на горизонтальной шкале.
Сайтодел | #сниппет #css
Сайтодел | #сниппет #css
🐙 JSON Server – это библиотека с фейковыми REST API. Она поддерживает динамическую генерацию "баз данных", кастомную маршрутизацию и использование модулей.
Сайтодел | #репозиторий #github
Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
🐙 Clean Code JavaScript – репозиторий с материалами по чистому коду применительно к JavaScript. Для каждого концепта тут есть примеры хорошего и плохого кода.
Сайтодел | #репозиторий #github
Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Image Grids Animation – анимация для картинок в виде сетки из скругленных рамок. Шаблон подстраивается под ширину каждого изображения.
Сайтодел | #сниппет #css
Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Atom Preloader – сложный лоадер в форме атома с элементами, которые вращаются в разные стороны. Кольца крутятся как в одной плоскости, так и по собственной оси.
Сайтодел | #сниппет #css
Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Order Button Animation – анимация, которая появляется после нажатия кнопки вместо лоадера. Когда заказ принят, кнопка возвращается обратно.
Сайтодел | #сниппет #css
Сайтодел | #сниппет #css
🐙 Transformers.js – библиотека, которая помогает обрабатывать естественный язык, генерировать и переводить тексты, классифицировать изображения, а также распознавать речь.
Сайтодел | #репозиторий #github
Сайтодел | #репозиторий #github
🐙 HTMX – библиотека, которая дает возможность работать с AJAX, CSS-переходами, веб-сокетами и событиями, посылаемыми сервером прямо через разметку HTML.
Сайтодел | #репозиторий #github
Сайтодел | #репозиторий #github
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Click To Zoom Calendar – полупрозрачный календарь с возможностью увеличивать выбранную дату. Текущий день выделяется белой полоской снизу.
Сайтодел | #сниппет #css
Сайтодел | #сниппет #css
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Hypnotic Loader – лоадер с двумя элементами, которые вращаются независимо друг от друга. Сложная анимация точно не даст пользователю заскучать при долгой загрузке.
Сайтодел | #сниппет #css
Сайтодел | #сниппет #css
🐙 Eruda – консоль для мобильных браузеров. Отображает JavaScript-логи, показывает локальное хранилище, информацию о файлах cookie и статусы запросов.
Сайтодел | #репозиторий #github
Сайтодел | #репозиторий #github