TSDHN

January 22, 2025 · View on GitHub

TSDHN es una aplicación web para la estimación de parámetros de tsunamis de origen lejano mediante simulaciones numéricas. Este proyecto forma parte del Programa de Investigación Científica (PICV 2025) de la Universidad Nacional Mayor de San Marcos.

Arquitectura

flowchart LR
    subgraph Cliente
        User((👤 Usuario))
        style User fill:#f9f,stroke:#333
    end

    subgraph CapaFrontend["Frontend"]
        direction TB
        Web["🌐 Aplicación web<br/>(Next.js + TypeScript)"]
        style Web fill:#90CAF9,stroke:#1565C0
    end

    subgraph Despliegue["Deploy"]
        CF["☁️ Cloudflare Pages"]
        style CF fill:#F4511E,stroke:#BF360C
    end

    subgraph Backend["Backend"]
        API["⚙️ API REST<br/>(Python)"]
        Model["📊 Modelo numérico<br/>(Fortran)"]
        style API fill:#81C784,stroke:#2E7D32
        style Model fill:#FFB74D,stroke:#EF6C00
    end

    %% Conexiones
    User <--> Web
    Web <--> CF
    CF <--> API
    API <--> Model

    classDef default fill:#fff,stroke:#333,stroke-width:2px
    linkStyle default stroke:#666,stroke-width:2px

El sistema está dividido en dos componentes principales que trabajan en conjunto para procesar y visualizar las simulaciones de tsunamis:

El backend (picv-2025) maneja el procesamiento numérico y cálculos, implementado en Python y Fortran. Este componente expone una API REST que procesa las solicitudes y ejecuta las simulaciones necesarias.

El frontend (picv-2025-web) proporciona la interfaz de usuario, desarrollada en Next.js y TypeScript. Permite a los usuarios configurar parámetros y visualizar los resultados de las simulaciones.

Desarrollo

Para comenzar, necesitarás:

  • Node.js 20.x (puedes usar nvm)
  • Git (opcional, pero recomendado)

Configuración del entorno

  1. Instalar Node.js 20:
nvm install 20
nvm use 20
  1. Configurar el proyecto:
git clone https://github.com/totallynotdavid/picv-2025-web
cd picv-2025-web
npm install

Variables de entorno

Crea un archivo .env.local en la carpeta principal del proyecto con las siguientes variables:

VariableDesarrolloProducción
API_URLhttp://localhost:8000https://api.tsdhn.pages.dev (pendiente)
NODE_ENVdevelopmentproduction

Deploy

El sistema utiliza Cloudflare Pages para el frontend y un servidor privado del GI para el backend, conectados mediante Cloudflare Tunnel. La configuración de despliegue es automática y se activa con cada push a la rama principal del repositorio.

Para configurar un nuevo deploy en Cloudflare Pages:

  1. Selecciona Next.js como framework preset
  2. Establece npm run build como build command
  3. Configura las variables de entorno en el panel de Cloudflare

Equipo

El desarrollo está a cargo de: