How this site is built.

This site: a Next.js and TypeScript portfolio that presents each project through its findings, charts and source code.

Project: Interactive Portfolio & Analytics Platform
Role: Full-Stack & Systems Engineer
When: 1 Month
Framework: Next.js 16
Charts: Recharts

Source code

What I found

Pages are prerendered at build time; project pages use generateStaticParams.
The GitHub page lists public repositories from the GitHub API, with a plain list of project repos if the API is unavailable.
Deployed clean source repository to GitHub at benman17/ben-portfolio.

Filter-to-SQL demo

Sample data, not from a real business. Pick a segment and a metric to see the chart and the SQL that would produce it.

Segment

Metric

SQL (PostgreSQL), illustrative

SELECT 
  DATE_TRUNC('month', order_date) AS month,
  SUM(sales_amount) AS total_revenue
FROM fact_sales f
JOIN dim_customer c ON f.customer_id = c.customer_id
WHERE c.customer_segment = 'All'
  AND f.order_date >= '2026-01-01'
GROUP BY 1
ORDER BY 1 ASC;

The question

A PDF resume and a list of links do not show what the analysis found or how it was built.

How I built it

Architected a modular Next.js 16 App Router application with full TypeScript type safety.
Built interactive chart components with Recharts (TFT level chart, NFL tier scatter plot, Northstar dashboard views, a labeled sample revenue sandbox).
Integrated dynamic client-side fetching with GitHub REST API to display live public repositories.

The code

TypeScript (Next.js)

// Next.js App Router API & Static Generation
export async function generateStaticParams() {
  return PROJECTS.map((project) => ({
    slug: project.slug,
  }));
}

export async function fetchGitHubRepos(username: string = 'benman17') {
  const res = await fetch(`https://api.github.com/users/${username}/repos?sort=updated`, {
    next: { revalidate: 3600 }
  });
  return res.json();
}

What I delivered

A portfolio that shows each project through its own data: the findings, the queries behind them and links to the source.