Инструменты разработчика

Fresh изначально ориентирован на экосистему Deno, поэтому ключевым инструментом разработчика становится сам рантайм. Установка Deno автоматически даёт доступ к большинству необходимых утилит без дополнительной настройки.

Создание проекта выполняется через официальный генератор:

deno run -A -r https://fresh.deno.dev my_project

В сгенерированной структуре сразу присутствуют:

  • готовый сервер разработки,
  • маршрутизация на основе файлов,
  • поддержка Islands Architecture,
  • интеграция с TypeScript без конфигурации.

Запуск локального сервера:

deno task start

Сервер разработки поддерживает горячую перезагрузку (HMR) для маршрутов и island-компонентов, что позволяет мгновенно видеть изменения без перезапуска процесса.

Сервер разработки и отладка

Fresh использует встроенный HTTP-сервер Deno. Это исключает необходимость в сторонних сборщиках и dev-серверах.

Особенности сервера разработки:

  • отсутствие этапа сборки,
  • серверный рендеринг по умолчанию,
  • автоматическое обновление модулей при изменении файлов,
  • корректная работа source maps для TypeScript.

Для отладки используется стандартный механизм Deno:

deno task start --inspect

После запуска инспектора доступна отладка через Chrome DevTools или совместимые IDE.

Структура проекта как инструмент

Строгая структура каталогов в Fresh — не ограничение, а средство навигации и контроля:

routes/        — HTTP-маршруты
islands/       — интерактивные компоненты
components/    — обычные JSX-компоненты
static/        — статические файлы

Каждый файл в routes/ автоматически становится маршрутом. Это упрощает:

  • анализ точек входа,
  • поиск серверной логики,
  • контроль над API-эндпоинтами.

Маршруты поддерживают:

  • динамические параметры ([id].tsx),
  • вложенность,
  • обработку HTTP-методов (GET, POST и др.).

Инструменты для Islands Architecture

Islands — ключевая концепция Fresh. Интерактивность изолируется в отдельных компонентах, которые загружаются и гидратируются только при необходимости.

Инструменты, связанные с islands:

  • автоматическая клиентская сборка только для islands,
  • отсутствие JavaScript на клиенте, если islands не используются,
  • прозрачная интеграция с Preact.

Island определяется простым размещением компонента в каталоге islands/. Никакой дополнительной конфигурации не требуется — это снижает вероятность ошибок и ускоряет разработку.

Работа с TypeScript

Fresh использует TypeScript как стандарт. Поддержка реализована средствами Deno, без tsconfig.json.

Преимущества:

  • строгая типизация из коробки,
  • мгновенная проверка типов при запуске,
  • единая модель модулей (ESM).

Deno автоматически:

  • загружает типы зависимостей,
  • кэширует модули,
  • сообщает об ошибках типов при старте сервера.

Управление зависимостями

Зависимости подключаются напрямую по URL:

import { h } from "preact";

Для централизованного управления версиями используется файл import_map.json. Он выполняет роль инструмента:

  • контроля версий,
  • упрощения импортов,
  • предотвращения дублирования зависимостей.

Пример import map:

{
  "imports": {
    "preact": "https://esm.sh/preact@10.19.2"
  }
}

Линтинг и форматирование

Deno предоставляет встроенные инструменты качества кода, которые полностью совместимы с Fresh:

deno lint
deno fmt

Эти инструменты:

  • не требуют конфигурации,
  • понимают TypeScript и JSX,
  • обеспечивают единый стиль кода.

Использование стандартных средств снижает количество сторонних зависимостей и упрощает поддержку проекта.

Тестирование

Fresh не навязывает тестовый фреймворк, но полностью совместим с встроенной системой тестирования Deno.

Пример теста маршрута:

Deno.test("главная страница возвращает 200", async () => {
  const res = await fetch("http://localhost:8000");
  if (res.status !== 200) {
    throw new Error("Ошибка статуса");
  }
});

Поддерживаются:

  • unit-тесты,
  • интеграционные тесты,
  • асинхронные сценарии.

Запуск тестов:

deno test

Инструменты сборки и деплоя

Fresh не использует классическую сборку. Приложение запускается напрямую на сервере, что делает процесс деплоя предельно простым.

Поддерживаются:

  • Deno Deploy,
  • любые VPS с установленным Deno,
  • контейнеризация без сложных этапов сборки.

Для production-режима используется тот же код, что и в разработке, без расхождений конфигураций.

Логирование и диагностика

Логирование строится на стандартном console или встроенных средствах Deno. Это даёт:

  • предсказуемое поведение,
  • отсутствие сторонних логгеров,
  • простую интеграцию с системами мониторинга.

Ошибки рендеринга, маршрутизации и islands отображаются с подробными стектрейсами, включая исходные TypeScript-файлы.

Интеграция с IDE

Fresh отлично поддерживается современными редакторами кода:

  • автодополнение TypeScript,
  • навигация по маршрутам,
  • встроенная отладка Deno.

Для Visual Studio Code используется официальный плагин Deno, который превращает структуру Fresh-проекта в полноценную рабочую среду без дополнительной настройки.

Расширяемость инструментов

Fresh допускает расширение стандартного функционала:

  • middleware на уровне сервера,
  • кастомные обработчики запросов,
  • собственные dev-утилиты поверх Deno API.

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

Оглавление