iamteya.ru

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

Next.js 16 + React 19 — последние версии на момент разработки. Tailwind CSS v4 для стилей. Framer Motion для анимаций: параллакс при скролле, scroll-triggered reveals с кастомными easing-кривыми, typing-эффект в hero, word-by-word reveal в манифесте, count-up для метрик.

Блог на markdown-файлах: gray-matter парсит frontmatter (title, date, excerpt), marked конвертит в HTML. Статические страницы генерируются через generateStaticParams.

Система кейсов: данные в TypeScript-файле, динамические страницы через [slug], скриншоты сайтов как визуальные доказательства.

Тёплая светлая тема: бежевый фон #faf9f7, коралловый акцент #ff6b35. Inter как основной шрифт. Noise-текстура поверх всего для глубины (SVG filter через CSS ::before).

Никаких стоковых фото, градиентных орбов, glassmorphism или shimmer-эффектов. Только текст, типографика и структура. Минимализм, который не выглядит стерильно.

Адаптив: от мобилки до десктопа, три брейкпоинта (md, lg). Все анимации отключаются на медленных устройствах через prefers-reduced-motion.

Docker-контейнер с Next.js standalone output. Traefik как reverse proxy с автоматическим Let's Encrypt SSL. Важный нюанс: HOSTNAME=0.0.0.0 обязателен для Next.js 16 в Docker, иначе Traefik не достучится до контейнера.

Обновление: rsync исходников на сервер → docker build → docker run с Traefik-лейблами. Без CI/CD — для одностраничного сайта это overkill.