Вайб кодинг
2.56K subscribers
1.15K photos
143 videos
53 files
212 links
Кодим с ИИ + мозги

Авторский канал, сотрудничество: @hand_of_ragnaros
Download Telegram
Простой способ форматирования числа в качестве валюты без использования сторонних библиотек

Поиграть можно здесь

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Знаете ли вы, что к числам в упорядоченном списке можно добавить 0?

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Простой способ изменения стиля кнопки выбора файлов с помощью CSS: на заметку фронтенд-разработку

➡️ Поиграть можно здесь

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Мы не можем изменить цвет внешней SVG-иконки с помощью свойств fill/storke, но есть способ сделать это с помощью CSS mask

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Полезный сниппет, позволяющий скрыть контент, но оставить его доступным для скрин-ридеров

Поиграть можно здесь

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Псевдокласс :focus-visible вместо :focus в CSS применяется только тогда, когда фокусировка элемента происходит способами, видимыми для пользователя, например, через клавиатурный ввод.

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

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Если вы добавляете символы кавычек, используйте в качестве содержимого open-quote и close-quote, поскольку они учитывают язык документа.

👉 Подробнее

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Простой способ использования свойства gap

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Простая шпаргалка по поисковой оптимизации для веб-разработчика

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Простой способ упрощения CSS селекторов с использованием :where(): на заметку фронтенд-разработчику

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Руководство по Next.js: пополняемая серия для фронтенд-разработчика

Часть 1
Часть 2
Часть 3

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Простой способ изменения числового представления упорядоченного списка в CSS: на заметку фронтенд-разработчику


➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Как устроена асинхронность в JavaScript: гайд для фронтенд-разработчика

Что такое Event loop и очередь событий?
При чём здесь Web API?
Как работают промисы и async/await?

🔜 Читать

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
HTML-элемент <meter> в действии: на заметку фронтенд-разработчику

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Тестирование React-приложений на практике

Запись 5-часового воркшопа о TDD и тестировании React приложений, в рамках которого Александр Беспоясов написал конвертер валют и покрыл его тестами. Вы узнаете, как:

☑️ Выделять и тестировать бизнес-логику
☑️ Разделять код на модули так, чтобы их было удобно тестировать
☑️ Применять разные стратегии моков, готовить стабы и тестовые данные
☑️ Тестировать сайд-эффекты и React-хуки
☑️ Работать с асинхронными функциями и тестировать их
☑️ Подключать сторонние библиотеки через адаптеры для удобного тестирования

▶️ Смотреть

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
React + структуры данных = суперкод: 7 примеров для практики

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

🔜 Читать статью

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Простой способ сортировки без учета регистра в JavaScript: на заметку фронтенд-разработчику

➡️ @tips_frontend
Please open Telegram to view this post
VIEW IN TELEGRAM