Статьи

Иконка Рубрики
13 часов назад

Курс по Tailwind CSS: Мини-лендинг на Flex, Grid и container query #10

Соберём небольшой, но «живой» лендинг: шапка, hero, карточки и футер. Главная фишка — правильно сочетать Flex, Grid и @container, чтобы страница выглядела аккуратно и на телефоне, и на десктопе.
Frontend 10
13 часов назад

Курс по Tailwind CSS: Совмещение breakpoints и container query #9

В прошлой статье мы познакомились с контейнер-кверями. Они позволяют карточкам и блокам адаптироваться по своей ширине. Но в реальных проектах почти всегда используется комбинация: глобальные брейкпоинты и локальные контейнер-квери.
Frontend 5
13 часов назад

Курс по Tailwind CSS: Container query #8

Раньше адаптивность вёрстки строилась только на медиазапросах (@media) и брейкпоинтах (sm:, md:, lg:). Но у этого подхода есть ограничение: стили меняются в зависимости от ширины экрана, а не от ширины самого блока.
Frontend 7
14 часов назад

Курс по Tailwind CSS: Grid-сетки #7

В прошлой статье мы разобрали flexbox. Он отлично подходит для выравнивания и простых макетов: меню, хедеры, блоки в строку. Но если нужно выстроить настоящую сетку карточек или галерею — удобнее использовать Grid.
Frontend 14
14 часов назад

Курс по Tailwind CSS: Flexbox #6

Flexbox — мощный инструмент для построения макетов. Он упрощает управление расположением элементов по горизонтали и вертикали. В Tailwind всё это сводится к простым утилитам, которые легко комбинировать и читать прямо в разметке.
Frontend 17
1 день назад

Курс по Tailwind CSS: Мини-лендинг #5

Мы уже познакомились с утилитами, цветами и шрифтами. Теперь соберём всё вместе и создадим маленький лендинг с тремя ключевыми блоками: шапкой (Header), главным блоком (Hero) и подвалом (Footer).
Frontend 21
1 день назад

Курс по Tailwind CSS: Цвета и шрифты #4

В прошлой статье мы разобрали базовые утилиты. Теперь углубимся в работу с цветами и шрифтами. В Tailwind CSS v4 эти возможности стали ещё удобнее: библиотека поддерживает современную цветовую модель OKLCH, P3-палитры, а также предоставляет новый способ расширять тему с помощью @theme.
Frontend 24
1 день назад

Курс по Tailwind CSS: Первые шаги с утилитами #3

В прошлой статье мы настроили окружение и убедились, что Tailwind работает. Теперь подробнее разберём самые часто используемые утилиты: отступы, цвета, текст и адаптивность.
Frontend 24
1 день назад

Курс по Tailwind CSS: Настройка окружения Vite + Tailwind CSS #2

В первой статье мы разобрались, что такое Tailwind и зачем он нужен. Теперь настроим рабочее окружение и сделаем проект, где будем практиковаться.
Frontend 25
1 день назад

Курс по Tailwind CSS: Что такое Tailwind CSS и подход utility-first #1

В классической вёрстке мы обычно создаём собственные CSS-классы: .header, .button, .card. Каждый класс хранит набор стилей. Но со временем проект разрастается: классы дублируются, их становится сотни, и поддерживать такой код становится всё сложнее.
Frontend 20
5 дней назад

Как зарабатывать на создании сайтов на Tilda в 2025 году

Tilda остаётся одной из самых удобных и «быстрых» платформ для запуска сайтов малого бизнеса, лендингов, блогов и небольших интернет-магазинов. В 2025 году экосистема Tilda включает визуальный редактор, Zero Block для свободной вёрстки, собственную CRM, блог Feeds, Members Area для закрытых разделов/курсов, экспорт кода и даже встроенного AI-помощника.
Frontend 68
2 месяца назад

SOLID на TypeScript: 5 простых правил для гибкого кода

Если вы хоть немного писали код на TypeScript, особенно в среде с реальными задачами и коллегами, то, скорее всего, сталкивались с запутанными классами, непредсказуемыми зависимостями и странным поведением при доработках.
Обучение 268
4 месяца назад

Лучшие процессоры для RTX 5060 Ti в 2025 году

Среднебюджетная видеокарта Nvidia RTX 5060 Ti наконец-то вышла, завершив насыщенный релизный цикл серии Blackwell. Эта модель обещает отличную производительность в разрешении 1440p и становится прямым преемником невероятно популярной RTX 4060 Ti — одной из самых выгодных видеокарт на рынке в своём классе.
Железо 11 155
4 месяца назад

Быстрый старт в Bootstrap 5: Формы и валидация #5

Bootstrap предлагает продуманные стили для форм, а также стандартный подход к валидации. При оформлении формы важно не только «красиво» сделать поля, но и обеспечить доступность (доступ) для всех пользователей.
Frontend 515
4 месяца назад

Быстрый старт в Bootstrap 5: Утилиты и кастомизация #4

Bootstrap предлагает обширный набор утилит-классов для быстрой стилизации без написания CSS. Это классы для отступов, цветов, теней, обтекания и прочего. Рассмотрим ключевые из них.
Frontend 443
4 месяца назад

Быстрый старт в Bootstrap 5: Компоненты интерфейса #3

Bootstrap содержит множество готовых компонентов, которые можно быстро встраивать в интерфейс. Рассмотрим некоторые из них. Кнопки (Buttons) Класс .btn служит основой для кнопок Bootstrap: он задаёт базовые отступы и выравнивание текста.
Frontend 457
4 месяца назад

Быстрый старт в Bootstrap 5: Сетка и адаптивная верстка #2

Одним из ключевых механизмов Bootstrap является сетка (Grid) – система на основе Flexbox, позволяющая легко строить адаптивные раскладки. Сетка разбивает страницу на 12 колонок по горизонтали и адаптируется под шесть основных «точек перелома» (размеров экранов) – от самых маленьких до очень больших.
Frontend 460
4 месяца назад

Быстрый старт в Bootstrap 5: Установка, структура, первые шаги #1

Bootstrap – это бесплатный и открытый фреймворк для адаптивной верстки (mobile-first), который предоставляет готовые HTML, CSS и JavaScript шаблоны для типографики, форм, кнопок, навигации и других элементов интерфейса.
Frontend 470
4 месяца назад

Быстрый старт в Next.js: Как работает рендеринг #2

Когда вы создаёте страницу в Next.js, вы должны понять: где она будет рендериться — на сервере, на клиенте или заранее при сборке.
Frontend 368
4 месяца назад

Лучшие процессоры Intel для игр в 2025 году

2025 год радует свежими процессорами Intel – как обновленной линейкой Core i5/i7/i9, так и абсолютно новыми чипами серии Core Ultra. Ниже мы рассмотрим семь лучших десктопных моделей Intel, уже доступных в продаже, которые отлично подходят для игр.
Железо 533