Marketing landing page for ImageForge CLI built with Next.js App Router, TypeScript, Tailwind CSS, and pnpm.
- Next.js 16 (App Router)
- TypeScript
- Tailwind CSS 4
- pnpm
- Vercel-ready defaults
- Node >= 22
This site intentionally describes ImageForge as:
- Build-time image optimization (not runtime generation)
- WebP/AVIF conversion
blurDataURLplaceholder generation- Hash-based caching
- Concurrency control
--checkCI guard mode--jsonmachine-readable run report to stdoutimageforge.jsonmanifest output by default
/landing page/benchmarks/latestbenchmark evidence page/docsquick-start documentation entrypoint/contactsupport and feedback entrypoint
pnpm install
cp .env.example .env.local
pnpm devOpen http://localhost:3000.
pnpm dev # run dev server
pnpm lint # eslint
pnpm typecheck # typescript checks
pnpm test:unit # vitest unit/component checks
pnpm test:mutation:pilot # stryker mutation pilot (advisory)
pnpm test:e2e # playwright route smoke checks
pnpm test:visual # playwright visual regression checks
pnpm lhci # lighthouse-ci lab checks for / and /benchmarks/latest
pnpm quality:gates:local # local phase-3 quality gate bundle
pnpm check:ci # local CI-parity gate (recommended before opening PR)
pnpm build # production build
pnpm start # run production server
pnpm seo:tech # technical SEO checks
pnpm seo:content # content SEO checks
pnpm seo:offpage # off-page/public SEO checks
pnpm seo:full # full SEO checks (includes optional GSC adapter)
pnpm seo:check # CI-oriented SEO check (mode from SEO_MODE)
pnpm governance:pricing:freshness # fail-closed pricing freshness check
pnpm seo:test # SEO script unit tests
pnpm format # prettier check
pnpm format:writePhase 9CC8 3 adds non-blocking regression signals for landing and benchmark surfaces:
- Vitest component/hook tests (
pnpm test:unit) - Stryker mutation pilot with baseline trend summary (
pnpm test:mutation:pilot) - Playwright smoke E2E tests (
pnpm test:e2e) - Playwright visual snapshots with committed baselines (
pnpm test:visual) - Lighthouse CI lab checks (
pnpm lhci)
Initial rollout is advisory by design and runs in
.github/workflows/quality-gates.yml.
To update visual baselines intentionally:
pnpm test:visual:updateDeterministic benchmark route checks use fixture mode in quality-gate commands:
BENCHMARK_ENABLE_LOCAL_FIXTURE=1BENCHMARK_SNAPSHOT_FIXTURE=sample
- Contrast target: WCAG 2.1 AA for normal text (
>= 4.5:1). - Components remediated for contrast:
components/landing/StatsStrip.tsxcomponents/landing/FinalCtaFooter.tsx
- Release gate checks:
pnpm lintpnpm typecheckpnpm build- Lighthouse accessibility (desktop and mobile) against local production server
Verification snapshot (2026-02-11):
- Desktop accessibility score:
95 -> 100 - Mobile accessibility score:
95 -> 100 - Failing audit delta:
color-contrastonly,12 -> 0failing nodes
NEXT_PUBLIC_IMAGEFORGE_VERSION is used for public version display in the UI.
NEXT_PUBLIC_SITE_URL defines canonical/metadata base URL and should match production.
In non-development flows (CI, release verification, local production build checks), this value is required.
SEO_MODE controls audit mode (advisory or strict).
SEO_LOCALE defaults keyword/report locale (en-US).
SEO_COMPETITOR_URLS optionally enables competitor snapshot checks.
SEO_GSC_CLIENT_EMAIL, SEO_GSC_PRIVATE_KEY, and SEO_GSC_PROPERTY_URI enable Google Search Console analysis.
Example:
NEXT_PUBLIC_IMAGEFORGE_VERSION=0.1.6
NEXT_PUBLIC_SITE_URL=https://imageforge.devIf unset, the site falls back to local-dev.
Use this command to reproduce the CI-required quality gate locally:
pnpm check:ciThis command intentionally uses NEXT_PUBLIC_SITE_URL=https://example.com for deterministic local parity.
CI also runs pnpm governance:pricing:freshness as a required freshness gate.
- Push this repository to GitHub.
- In Vercel, create a new project and import the repository.
- Keep framework preset as Next.js.
- Set environment variables
NEXT_PUBLIC_SITE_URLandNEXT_PUBLIC_IMAGEFORGE_VERSION(required for release alignment and canonical metadata parity). - Deploy.
Vercel build command and output settings can remain default for Next.js.