Простой кейс создания закругленных углов в CSS

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

➡️ @tips_frontend

Простой способ визуализации списка данных с помощью console.table(): на заметку фронтенд-разработчику

➡️ @tips_frontend

⏪7 инструментов для повышения производительности веб-приложений ⏩

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

📕 Читать статью

➡️ @tips_frontend

Не нужно ждать изменений от backend API. Мы можем легко переопределить ответ на любой запрос локально, чтобы продолжить работу с помощью Dev Tools

➡️ @tips_frontend

Отложенная загрузка некритических модулей для повышения производительности загрузки страниц в действии: на заметку фронтенд-разработчику

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

➡️ @tips_frontend

Как избежать булевых значений в сигнатуре функции JavaScript

Сложно не согласиться с автором, ведь options object или enums почти всегда являются лучшим выбором.

⏩ Читать статью

➡️ @tips_frontend

Мини-гайд по добавлению изображения с помощью HTML

Если принимать во внимание такие аспекты, как производительность, размеры экрана, доступность или пользовательские настройки, в какой-то момент можно задаться вопросом, достаточно ли для этой задачи простого HTML.

И ответ — да! HTML имеет много опций и достаточно мощен, чтобы справиться с этой задачей. В статье рассказано о том, что следует учитывать при добавлении изображения с помощью HTML.

⏩ Читать

➡️ @tips_frontend

Советы по CSS при работе с текстовыми полями: на заметку фронтенд-разработчику

⏩ Используйте field-sizing: content, чтобы текстовая область автоматически изменяла размер в соответствии с ее содержимым.
⏩ Используйте единицы измерения lh, чтобы установить высоту в вычисленных единицах высоты строки шрифта.

➡️ @tips_frontend

Playwright и Allure как хорошая практика для разработки веб-приложения

Фронтенд-разработчик из Clevertec делится опытом использования Playwright в сочетании с Allure для автоматизации тестирования и оптимизации работы команды.

👉 Читать

➡️ @tips_frontend

Лучший способ создания паттерна проектирования Singleton в JavaScript и TypeScript

Делимся эффективными методами реализации паттерна Singleton в JavaScript и TypeScript. Кроме того рассмотрим преимущества паттерна и потенциальные риски его использования.

🔗 Читать статью

➡️ @tips_frontend

Оператор логического ИЛИ с присваиванием (||=) в действии

Он используется для упрощения присваивания значения по умолчанию и работает следующим образом: если левый операнд имеет ложное значение (например, null, undefined, 0, пустая строка "", false, или NaN), то правое выражение присваивается левому операнду.

➡️ @tips_frontend

Шпаргалка по Nuxt.js от Vue Mastery: на заметку фронтенд-разработчику

➡️ @tips_frontend

Простой способ получения доступа к любому значению атрибута в виде строки с помощью CSS: на заметку фронтенд-разработчику

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

➡️ @tips_frontend

Бесплатное IT-образование в 2024

Отобрали для вас полезные телеграм-каналы, которые помогут освоить программирование и другие IT-направления

Выбирайте нужное и подписывайтесь:

👩‍💻 Frontend: @FrontendPortal
⚙️ Backend: @BackendPortal
📱 GitHub: @git_developer
🤓 Книги айти: @portalToIT
👩‍💻 Python: @PythonPortal
👩‍💻 Java: @Java_Iibrary
👩‍💻 C#: @KodBlog
👩‍💻 С/С++: @Cpportal
🖥 Базы Данных & SQL: @SQL
👩‍💻 Golang: @juniorGolang
👩‍💻 PHP: @PHPortal
👩‍💻 Моб. разработка: @MobDev
👩‍💻 Разработка игр: @GameDevgx
👩‍💻 DevOps: @loose_code
🖥 Data Science: @DataSciencegx
🤔 Хакинг & ИБ: @cybersecinform
🐞 Тестирование: @QAPortal
📱 Маркетинг: @MarketingPortal
🖥 Дизайн: @PortalToDesign

➡️ Сохраняйте себе, чтобы не потерять

Простой способ форматирования числа в качестве валюты без использования сторонних библиотек

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

➡️ @tips_frontend

Знаете ли вы, что к числам в упорядоченном списке можно добавить 0?

➡️ @tips_frontend

Простой способ изменения стиля кнопки выбора файлов с помощью CSS: на заметку фронтенд-разработку

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

➡️ @tips_frontend

Мы не можем изменить цвет внешней SVG-иконки с помощью свойств fill/storke, но есть способ сделать это с помощью CSS mask

➡️ @tips_frontend

Полезный сниппет, позволяющий скрыть контент, но оставить его доступным для скрин-ридеров

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

➡️ @tips_frontend

Псевдокласс :focus-visible вместо :focus в CSS применяется только тогда, когда фокусировка элемента происходит способами, видимыми для пользователя, например, через клавиатурный ввод.

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

➡️ @tips_frontend