This repository contains the frontend application for the Notebook2REST platform. It provides a web-based interface for discovering deployed notebook services, executing them with custom parameters, viewing typed outputs, and monitoring the CI/CD pipeline in real time.
Built with Next.js 15, shadcn/ui, and Tailwind CSS.
User opens the UI
│
▼
Next.js API routes discover notebook
services via Kubernetes service labels
│
▼
Sidebar lists all available notebooks
with parameters and health status
│
▼
User selects a notebook, fills in
parameters, and clicks Run Notebook
│
▼
Request is proxied through Next.js
to the notebook's FastAPI endpoint
│
▼
Papermill executes the notebook and
returns typed outputs (tables, images, …)
│
▼
UI renders each output with a
dedicated component per type
| Feature | Description |
|---|---|
| Service discovery | Auto-discovers notebook services in EKS via app.kubernetes.io/part-of=notebook2rest labels |
| Dynamic parameter forms | Reads /getParameters from each service and generates input fields per type |
| Notebook execution | Runs notebooks via GET (defaults) or POST (custom parameters) through the FastAPI proxy |
| Typed output rendering | Supports 11 output types: stream, text, image, svg, html, markdown, latex, json, dataframe, error, unknown |
| Pipeline visualization | Real-time 8-stage pipeline view sourced from GitHub Actions + Argo CD sync status |
| Argo CD integration | Sync and health stages reflect actual cluster state, with timestamp comparison to avoid stale status |
- Node.js 18+
- A running notebook service (locally or in EKS)
# Install dependencies
npm install
# Configure environment
cp .env.local.example .env.localEdit .env.local to point to a locally running notebook service:
NOTEBOOK_SERVICES='[{"slug":"demo-sales-analysis","url":"http://localhost:8000","apiPrefix":""}]'
# Optional — for pipeline visualization
PIPELINE_REPO_OWNER=dprRoberta
PIPELINE_REPO_NAME=DevOps
GITHUB_TOKEN=ghp_...# Start the dev server
npm run devOpen http://localhost:3000.
The UI is deployed as a containerized service through the same GitOps pipeline as the notebook services: Docker image → ECR → Helm values updated → Argo CD sync. The ALB routes / to the UI and /api/<service-name> to the notebook services.
| Area | Note |
|---|---|
| Service discovery | In-cluster: queries Kubernetes API with RBAC (see k8s-rbac.yaml). Local dev: reads NOTEBOOK_SERVICES env var |
| API proxy | All calls to notebook services go through Next.js API routes — no CORS issues, no credentials in the browser |
| Pipeline view | Requires PIPELINE_REPO_OWNER, PIPELINE_REPO_NAME, and GITHUB_TOKEN env vars. Token needs actions:read scope |
| Argo CD stages | Uses timestamp comparison (finishedAt vs CI run completion) to avoid showing stale sync status as success |
| Repository | Purpose |
|---|---|
| dprRoberta/Notebooks | Jupyter notebook source files |
| dprRoberta/DevOps | CI/CD pipeline & Terraform infrastructure |
| dprRoberta/notebook2rest-gitops | GitOps — Helm charts & Argo CD definitions |
| This repo | User interface |