logoNext.js Русский
ДокументацияБлогИзучение
Введение/Создание приложения/Стилизация

Стилизация

Next.js поддерживает различные способы стилизации вашего приложения, включая:

  • Глобальные CSS (Global CSS): Прост в использовании и знаком тем, кто работал с традиционным CSS, но может привести к увеличению CSS-бандлов и сложностям в управлении стилями по мере роста приложения.
  • CSS-модули (CSS Modules): Создание локально ограниченных CSS-классов для избежания конфликтов имен и улучшения поддерживаемости.
  • Tailwind CSS: Утилитарный CSS-фреймворк, позволяющий быстро создавать кастомные дизайны путем комбинирования утилитарных классов.
  • Sass: Популярный CSS-препроцессор, расширяющий CSS такими возможностями, как переменные, вложенные правила и миксины.
  • CSS-in-JS: Встраивание CSS непосредственно в JavaScript-компоненты, что позволяет использовать динамическую и ограниченную стилизацию.

Узнайте больше о каждом подходе, изучив соответствующую документацию:

CSS Modules

Стилизация приложения Next.js с использованием CSS Modules.

Tailwind CSS

Стилизация приложения Next.js с использованием Tailwind CSS.

CSS-in-JS

Использование библиотек CSS-in-JS с Next.js

Sass

Узнайте, как использовать Sass в вашем приложении Next.js.

Получение данных на стороне клиента (Client-side Fetching)

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

CSS Modules

Стилизация приложения Next.js с использованием CSS Modules.