Google Cloud интеграция

Fresh — это современный фреймворк для разработки веб-приложений на JavaScript и TypeScript, построенный на основе Deno. Он отличается высокой производительностью, минимальными накладными расходами и акцентом на серверный рендеринг (SSR). В основе Fresh лежит принцип islands architecture, при котором интерактивные части страницы (islands) загружаются отдельно, что позволяет экономить ресурсы и ускорять рендеринг.

Особенности Fresh

Zero runtime overhead: отсутствует лишний JavaScript на клиенте, если это не требуется интерактивностью компонентов.
Полная поддержка TypeScript: типизация доступна из коробки без дополнительной конфигурации.
Серверный рендеринг: HTML генерируется на сервере, что улучшает SEO и ускоряет начальную загрузку страницы.
Прямой импорт модулей: использование URL для импортов без установки npm-пакетов.

Структура проекта Fresh

Проект Fresh имеет строгую файловую структуру:

routes/ — директория для маршрутов приложения. Каждый файл или папка здесь автоматически становится URL-эндпоинтом.
components/ — переиспользуемые UI-компоненты.
islands/ — интерактивные компоненты, которые рендерятся отдельно и подгружаются на клиенте.
static/ — статические ресурсы (изображения, стили).

Файл main.ts или server.ts является точкой входа и запускает сервер Deno с приложением Fresh.

Интеграция с Google Cloud

Fresh прекрасно сочетается с облачными сервисами, включая Google Cloud. Основные сценарии интеграции:

1. Работа с Google Cloud Storage

Для хранения статических файлов или пользовательских данных используется GCS. Интеграция включает:

Установку официального SDK:

deno run --allow-net --allow-read https://deno.land/x/gcs/mod.ts

Конфигурацию клиента:

import { Storage } from "https://deno.land/x/gcs/mod.ts";

const storage = new Storage({
  projectId: "my-project-id",
  keyFilename: "./service-account.json",
});
const bucket = storage.bucket("my-bucket-name");

Пример загрузки файла:

const file = bucket.file("example.txt");
await file.save("Содержимое файла", { resumable: false });

Ключевые моменты: при работе с GCS важно использовать сервисные аккаунты и хранить ключи безопасно. Для Fresh можно хранить их в переменных окружения.

2. Работа с Firestore

Firestore позволяет хранить структурированные данные в режиме реального времени. В Fresh интеграция выглядит следующим образом:

Установка SDK:

import { initializeApp, getFirestore, collection, addDoc, getDocs } from "https://www.gstatic.com/firebasejs/9.23.0/firebase-firestore.js";

Инициализация приложения:

const app = initializeApp({
  apiKey: DENO_ENV_API_KEY,
  authDomain: DENO_ENV_AUTH_DOMAIN,
  projectId: DENO_ENV_PROJECT_ID,
});
const db = getFirestore(app);

Пример добавления документа:

await addDoc(collection(db, "users"), {
  name: "Иван",
  email: "ivan@example.com",
  createdAt: new Date(),
});

Firestore обеспечивает масштабируемое хранение данных и поддержку сложных запросов.

3. Аутентификация с Google Identity

Для приложений с пользовательскими аккаунтами используется Google Identity Platform. Пример интеграции:

Настройка OAuth 2.0 в Google Cloud Console.
Использование fetch на сервере для обмена кодом авторизации на токен доступа:

const response = await fetch("https://oauth2.googleapis.com/token", {
  method: "POST",
  headers: { "Content-Type": "application/x-www-form-urlencoded" },
  body: new URLSearchParams({
    code: authCode,
    client_id: CLIENT_ID,
    client_secret: CLIENT_SECRET,
    redirect_uri: REDIRECT_URI,
    grant_type: "authorization_code",
  }),
});
const data = await response.json();

Полученный токен позволяет обращаться к Google API от имени пользователя.

4. Деплой Fresh на Google Cloud

Fresh можно запускать на Google Cloud Run или App Engine. Основные шаги:

Создать Dockerfile:

FROM denoland/deno:alpine-1.42.0

WORKDIR /app
COPY . .

RUN deno cache main.ts

EXPOSE 8080

CMD ["run", "--allow-net", "--allow-read", "main.ts"]

Развернуть через Cloud Build или gcloud CLI:

gcloud run deploy my-fresh-app --source . --region us-central1 --platform managed

Преимущества: автомасштабирование, интеграция с секретами, минимальное время отклика.

5. Работа с Google Pub/Sub

Для событийной архитектуры Fresh может подписываться на сообщения Pub/Sub:

Подключение клиента Pub/Sub:

import { PubSub } from "@google-cloud/pubsub";

const pubsub = new PubSub({ projectId: "my-project-id" });

Отправка сообщения:

const topic = pubsub.topic("updates");
await topic.publishMessage({ json: { message: "New event" } });

Получение сообщений:

const subscription = pubsub.subscription("my-subscription");
subscription.on("message", (message) => {
  console.log(`Received message: ${message.data.toString()}`);
  message.ack();
});

Это позволяет реализовать реактивные системы, где сервер Fresh реагирует на события из облака.

Оптимизация взаимодействия

Использование server-side caching с Cloud Memorystore или встроенными возможностями Fresh.
Минимизация клиентских скриптов через islands architecture для сокращения нагрузки на браузер.
Хранение чувствительных данных через Secret Manager Google Cloud вместо жестких ключей в коде.
Разделение интерактивных компонентов и статического контента для ускорения TTFB (time to first byte).