---
title: "BALLPARK Xmas — Campaign Site & Instagram API — Tran Manh Tuan"
description: "The BALLPARK Xmas YOKOHAMA KANNAI campaign site — Instagram integration with a fully automated token lifecycle, and Contentful content rendered per request instead of rebuilding the site."
canonical: "https://tmtuan.dev/en/projects/ballpark-xmas"
language: "en"
image: "https://tmtuan.dev/_img/projects/ballpark-xmas/ballpark.197a892f-og.jpg"
tokens: 630
---

# BALLPARK Xmas YOKOHAMA KANNAI

**BALLPARK Xmas YOKOHAMA KANNAI** is the campaign website for the Christmas event season in the Kannai area of Yokohama — a seasonal site with two distinctive requirements: showing live social-media content and updating content instantly for the duration of the event.

The **Instagram** integration is the part clients ask about most: the system runs the OAuth flow itself to obtain a long-lived token, **Cloud Scheduler** refreshes the token before it expires and tokens are kept in **Secret Manager** — nobody handles keys manually or stores them anywhere unsafe for the whole event season.

Unlike the statically built projects elsewhere in this portfolio, content here is fetched at request time: the CMS API calls **Contentful GraphQL**, validates the data with Zod and renders rich text to HTML — when an editor updates something, it changes immediately, with no site rebuild. Images are served through **Akamai CDN** with automatic cache purging on publish, and the entire infrastructure is defined with **Terraform**.

## Details

- **Role:** Technical Lead
- **Website:** [ballparkfantasia.com](https://ballparkfantasia.com)

## Technology

- Contentful
- GraphQL
- Node.js
- Instagram API
- Akamai CDN
- Secret Manager
- Cloud Scheduler
- Terraform

## Services this project shows

- [Corporate & Content Web Platforms](https://tmtuan.dev/en/services/web-platforms)

## Related articles

- [Docs-as-code Knowledge Base + Context Graph for a 15-project portfolio](https://tmtuan.dev/en/articles/knowledge-base-docs-as-code-context-graph)

## Structured data (JSON-LD)

```json
{"@context":"https://schema.org","@graph":[{"@type":"WebPage","@id":"https://tmtuan.dev/en/projects/ballpark-xmas#webpage","url":"https://tmtuan.dev/en/projects/ballpark-xmas","name":"BALLPARK Xmas — Campaign Site & Instagram API","description":"The BALLPARK Xmas YOKOHAMA KANNAI campaign site — Instagram integration with a fully automated token lifecycle, and Contentful content rendered per request instead of rebuilding the site.","inLanguage":"en","isPartOf":{"@id":"https://tmtuan.dev/#website"},"about":{"@id":"https://tmtuan.dev/#person"}},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://tmtuan.dev/en"},{"@type":"ListItem","position":2,"name":"Projects","item":"https://tmtuan.dev/en/projects"},{"@type":"ListItem","position":3,"name":"BALLPARK Xmas YOKOHAMA KANNAI","item":"https://tmtuan.dev/en/projects/ballpark-xmas"}]}]}
```