TechRocks
14.7K subscribers
769 photos
3 videos
1 file
2.08K links
Официальный телеграм-канал сайта techrocks.ru

Канал по Тестированию: @techrocksqa
Канал по веб-разработке: @techrocks_web

По вопросам рекламы: @anothertechrock

РКН: https://kurl.ru/JUrcd
Download Telegram
Уменьшаем время загрузки сайта

#webdev

Если сайту не удается предоставить хороший UX, то скорее всего - из-за плохо оптимизированного фронтенда. Чаще всего дело бывает в загрузке данных и изображений. Давайте разберемся, что и как можно улучшить.

Читать статью
HTTPS для разработчиков

#webdev

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

Читать статью
Генераторы CSS-кода: самая полная коллекция

#webdev #css

Представляем большую коллекцию самых разнообразных генераторов, с помощью которых вы сможете быстро получить CSS-код для сложных элементов.

Читать статью
👍1
Позиционирование в CSS и Flexbox — объяснение с примерами

#webdev

Если вам когда-либо приходилось использовать CSS, вы знаете, как тяжело располагать элементы. Но к концу этого руководства вы будете знать куда больше о позиционировании в CSS и о Flexbox, и сможете мастерски расположить элементы в своем любимом проекте.

Читать статью
4👍1
Получение размера окна на чистом CSS

#webdev

Вы не поверите, но теперь в CSS можно определять свойства, выполнять математические вычисления и даже напрямую получать размер окна! В этой статье мы расскажем вам, как это делается.

Читать статью
👍1
10 идей проектов для изучающих HTML

#webdev

Пожалуй, если мы скажем, что HTML изучают абсолютно все люди, вообще изучающие программирование, то это не будет преувеличением. А поскольку учиться эффективнее всего на практике, идеи проектов должны пригодиться очень многим. Автор этой статьи собрала десятку идей проектов, подходящих для начинающих.

Читать статью
👍1
Где искать бесплатные иконки для сайта?

#webdev

Благодаря высококачественным иконкам ваши проекты будут выглядеть более профессионально и станут более удобными для пользователей. Но где найти бесплатные иконки в хорошем качестве? В этой статье мы познакомим вас с 23 библиотеками иконок с открытым исходным кодом.

Читать статью
👍3
Атрибут ping элемента ссылки HTML5

#webdev

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

Читать статью
👍2
Почему опытные разработчики никогда не используют regex для валидации email?

#webdev

Представьте, что вы создаете форму регистрации. Что первое приходит вам в голову? Вставить regex в поле электронной почты. Но это плохой ход.

Читать статью
👍2
Как добавить водяной знак к изображению (HTML + JavaScript)

#webdev

Добавлять водяные знаки к картинкам очень просто, для этого используется элемент HTML5 canvas. Добавляемые таким образом водяные знаки можно стилизовать, настраивать их расположение и прозрачность.

Читать статью
Как создать модальное окно

#webdev

Модальные окна довольно часто используются на сайтах, порой без них не обойтись. Но если они реализованы неправильно, то могут серьезно испортить пользовательский опыт.

Читать статью
👍3
10 однострочников React, которые должен знать каждый UI-разработчик

#webdev

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

Читать статью
Нативный HTML-элемент dialog и его возможности

#webdev

Все основные браузеры теперь поддерживают элемент dialog. Зачем добавлять этот HTML-элемент? Подобный функционал, особенно в части захвата фокуса, имеет юзерленд-код — код, который разработчики пишут для заполнения пробелов в браузере. Что ж, браузерные движки отреагировали на это, добавив эту функциональность непосредственно в браузер.

Читать статью
👍31
Как использовать селектор :has() в CSS

#webdev

Селектор :has() предлагает новый уровень гибкости и возможностей в CSS, позволяя писать более чистые и эффективные таблицы стилей.

Читать статью
👍31
Подчеркивание в CSS (красивые эффекты с примерами кода)

#webdev

При создании ссылок или анимаций для кнопок меню у вас может возникнуть необходимость использовать подчеркивание. Из этой статьи вы узнаете о нескольких способах создать эффект подчеркивания с использованием CSS-свойств text-decoration, border-bottom, background-image, box-shadow, а также при помощи SVG.

Читать статью
Индикатор загрузки на чистом CSS

#webdev

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

Читать статью
👍1
4 грязных трюка в CSS, из-за которых на вас будут коситься другие разработчики

#webdev

Грязные уловки в CSS очень полезны. Да, на вас могут неодобрительно поглядывать коллеги, но ведь приемы-то рабочие! Автор статьи составила список своих любимых "грязных" уловок.

Читать статью
👍2
Селекторы атрибутов в CSS: продвинутая стилизация

#webdev #css

Такие атрибуты как class и id используются в СSS-коде довольно часто. В этой статье мы рассмотрели обращение к элементам по другим атрибутам и их значениям.

Читать статью
👍4
Круговая диаграмма на чистом CSS

#html #css #webdev

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

Автор этой статьи рассказал, как построить анимированную круговую диаграмму, используя CSS и всего один HTML-элемент.

Читать статью
6 свойств CSS, о которых вы и понятия не имеете

#css #webdev

Одни свойства CSS используются чаще других, и это естественно. Однако, не следует забывать и о редко используемых свойствах, по крайней мере, о них точно стоит знать. Томаш Лакомы представил в своей статье несколько примеров таких свойств.

Читать статью
👍3