Skip to content

Сниппеты кода

Небольшие готовые куски кода, к которым я регулярно возвращаюсь — на разных языках и фреймворках.

// Коротко

Это личная подборка коротких сниппетов кода — утилитарных функций и паттернов, которые Alex Rel переиспользует в проектах, организованная по языкам и с поиском по ключевым словам.

Найдено сниппетов: 132
React.jsReact.js

React context + useReducer для глобального состояния

Замена библиотеки управления состоянием на Context и useReducer — предсказуемый, тестируемый паттерн без внешних зависимостей.

#React #Context #useReducer #State Management
React.jsReact.js

React useMediaQuery — адаптивный хук

Отслеживание CSS media queries в React-компонентах — определение брейкпоинтов, разный UI для мобильных/планшетов/десктопа и реакция на смену ориентации.

#React #Hooks #Responsive #Media Query
Tailwind CSS

Tailwind CSS анимации — keyframes и transition

Создание кастомных анимаций через `animate-*` и `@keyframes` в Tailwind — от микро-взаимодействий до переходов между страницами без выхода из конфига.

#Tailwind CSS #Animation #Keyframes #UX
Tailwind CSS

Tailwind CSS кастомная тема через CSS переменные

Расширение стандартной темы Tailwind кастомными цветами, шрифтами, отступами и брейкпоинтами — все значения через CSS-переменные для смены темы в рантайме.

#Tailwind CSS #Theme #Customization #Design System
Tailwind CSS

Tailwind CSS dark mode со стратегией class

Включение тёмной темы по кнопке вместо системных настроек — стратегия class даёт полный контроль через переключатель с сохранением в localStorage.

#Tailwind CSS #Dark Mode #Theme #Styling
Prisma

Prisma миграции — создание, применение и откат

Управление изменениями схемы базы данных через Prisma Migrate — создание миграций из изменений схемы, применение на продакшене и обработка рассинхронизации.

#Prisma #ORM #Migrations #Database
Prisma

Prisma пагинация — cursor и offset

Эффективная пагинация больших наборов данных через Prisma — offset для простых списков, cursor для infinite scroll и real-time лент.

#Prisma #ORM #Pagination #Performance
Prisma

Prisma CRUD — создание, чтение, обновление, удаление

Четыре базовые операции с данными через Prisma Client — создать пользователя, найти по email, обновить профиль, удалить аккаунт — всё с полной типизацией.

#Prisma #ORM #CRUD #TypeScript
NginxNginx

Nginx WebSocket прокси для real-time приложений

Проксирование WebSocket-соединений через nginx — необходимо для Socket.io, живого чата и совместного редактирования за reverse proxy.

#Nginx #WebSocket #Proxy #Real-time
NginxNginx

Nginx load balancing между Node.js инстансами

Распределение трафика между несколькими Node.js бэкендами с round-robin, проверками здоровья и пассивным failover — без изменений в приложении.

#Nginx #Load Balancing #Node.js #DevOps
NginxNginx

Nginx статический сервер с кешированием

Раздача статики (CSS, JS, изображения) с заголовками кеширования на год, gzip-сжатием и SPA-роутингом — без серверного приложения.

#Nginx #Static Files #Caching #Performance
GitHub Actions

GitHub Actions — запланированные задачи по cron

Запуск воркфлоу по расписанию — ежедневные бэкапы, еженедельные обновления зависимостей, почасовые проверки здоровья — через cron-синтаксис.

#GitHub Actions #Automation #DevOps
GitHub Actions

GitHub Actions — сборка и публикация Docker образа

Автоматическая сборка и публикация Docker образа в Docker Hub или GitHub Container Registry на каждый push в main — с кешированием слоёв.

#GitHub Actions #Docker #CI/CD #DevOps
GitHub Actions

GitHub Actions — CI пайплайн для PR

Запуск линтинга, type-check и тестов на каждый pull request до мержа — быстрый отказ с понятными аннотациями в PR.

#GitHub Actions #CI/CD #Testing #DevOps
GitGit

Git log — фильтрация и форматирование истории

Поиск, фильтрация и форматирование Git-лога — находите коммиты по автору, дате, файлу или содержимому одной строкой.

#Git #Workflow #Debugging
GitGit

Git cherry-pick и bisect — точечная работа с коммитами

Cherry-pick применяет конкретный коммит из любой ветки. Bisect — бинарный поиск по истории для нахождения коммита, внёсшего баг.

#Git #Workflow #Debugging
GitGit

Git stash — сохранение и восстановление черновиков

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

#Git #Workflow #Version Control
Docker

Docker безопасность — non-root пользователь и read-only

Усиление безопасности контейнеров — запуск от непривилегированного пользователя с read-only файловой системой и отключением возможностей ядра.

#Docker #Security #DevOps #Production
// CONNECT

Контактная информация

Оставьте заявку или напишите напрямую в телеграм. Я отвечу в течение 24 часов.