Axel Barraza

Full-Stack Developer | AI Product Engineer React · TypeScript · Agentic Workflows

“Obstinate rigor” — Leonardo da Vinci’s personal motto.

↓
// about

About Me

Almost everything I build starts with an obsession: a game, a sport, an idea.

I'm a full-stack developer. Day to day, I work with React and TypeScript, and use Azure for infrastructure. I also built my own plugin based on Spec-Driven Development (SDD) principles to structure how I approach complex projects, working with Claude Code.

Outside the code: I train Muay Thai — Tiger Thai is my home gym. I'm into racing sims; you can watch me drive in Rivazza.

// skills

Tech Stack

Core
Libraries
Frameworks
Tools

Click a skill to see more...

// projects

What I've Built

Rivazza — real-time Assetto Corsa telemetry dashboard with gauges, lap times, and track map, project by Axel Barraza Assetto Corsa in-sim view — the racing sim Rivazza pulls live telemetry from
01

Rivazza

Rivazza turns Assetto Corsa telemetry into an interactive dashboard for following a driving session in real time. From the car's gauges to lap times and racing lines on track, it transforms simulator data into a visual picture of every lap. It also includes a demo with a session in a Ferrari SF-25.

React · TypeScript · Node.js · UDP → WebSocket

Why I built it

On a 25.4 km lap of the Nürburgring Nordschleife I had no view of where I was on track. I also wanted to compare laps and sessions when I race my brother and my dad.

Decisions

  1. A Node bridge reads Assetto Corsa's built-in UDP telemetry and rebroadcasts it over WebSocket, because a browser cannot open a UDP socket and the game needs no mods this way.
  2. The map draws the lines actually driven instead of the game's map image, because that image is stroked at a constant width and misrepresents the track limits.
  3. The hosted demo replays a recorded session, because the bridge cannot run on a static host.

Data flow

Assetto Corsa → UDP → Node.js → WebSocket → React → Canvas

CombatAtlas country page — curated fight footage from México CombatAtlas — interactive world map of fighting styles, project by Axel Barraza
02

CombatAtlas

Martial arts are one of the most direct paths to understanding who someone really is. CombatAtlas grew out of that idea: giving structure to the many expressions of combat that have emerged around the world. A space to appreciate my country's style and, at the same time, discover the Muay Thai legends who took their discipline to another level.

React · TypeScript · MapLibre · Redux Toolkit · MongoDB · Express.js

Why I built it

An idea I wanted to see made real: a world map where each country opens onto its fighting tradition, with a fight already playing behind the page and the next one a click away. It started with Mexican boxing.

Decisions

  1. Countries live in a registry of lazy-loaded pages instead of in the router, so adding a country is one folder and one entry.
  2. Country data is cached in the session for 30 minutes, so going back to the map and returning does not fetch it again.
  3. The app pings the backend as soon as it loads and says when the server is waking up, because a hobby-tier host sleeps and an unexplained spinner reads as broken.

Data flow

MongoDB → Express.js → Axios → Redux Toolkit → React → MapLibre

in development
Trash Talk Chess mid-game — the Stockfish-powered engine taunting the player Trash Talk Chess — play against a trash-talking Stockfish engine, project by Axel Barraza
03

Trash Talk Chess

What if your opponent didn't just try to beat you, but made you keep thinking about the game long after it ended? Trash Talk Chess combines games against Stockfish with the ability to explore Chess.com profiles, as the groundwork for an opponent that tailors its taunts to the way you play. The project is still in development.

React · TypeScript · Stockfish

Why I built it

I want a chess opponent that feels like a human hustler across the table, not an engine: one that talks and knows how you play.

Decisions

  1. Stockfish runs in a Web Worker in the browser, so the game needs no server and the board never freezes while it thinks.
  2. Each move is classified from the engine's score and the tactics on the board, so the taunt reacts to what just happened.
  3. The taunts come from one swappable source, a written bank today, so a language model can take over later with the bank as its fallback.

Data flow

Chess.com API + chess.js → Stockfish WASM → Web Worker → React

Face Detector scanning an image — detected face highlighted with a bounding box Face Detector — real-time face detection web app, project by Axel Barraza
04

Face Detector

My first dive into machine learning: a tool that detects faces in images right in the browser and marks each detection with its confidence score. It uses TensorFlow.js and a lightweight face-detection model, with no need to send the image to a server for processing.

React.js 19 · TS · TensorFlow.js · In-browser ML

Why I built it

My first project was a face recogniser that needed an account and ran on credits that could run out. I rebuilt it to run entirely in the browser, with nothing to maintain and nothing to pay.

Decisions

  1. Detection runs on the visitor's device with TensorFlow.js, so the image never leaves the browser and there is no server or API key to keep alive.
  2. It uses a small model whose weights ship with the site, so it loads fast and runs on ordinary hardware.
  3. It tries the GPU through WebGL, then WebAssembly, then plain JavaScript, proving each with a real computation, so it still works where hardware acceleration is off or WebAssembly is blocked.

Data flow

Image → TensorFlow.js (WebGL → WASM → CPU) → TinyFaceDetector → React

// trajectory

Experience

Full-Stack Developer

Venteks - Guadalajara, Mexico
Apr 2025 — Present

Frontend lead on self-service fuel kiosks — Electron on hardware that takes real payments, wired into payment and tax services.

Electron · TypeScript · React · C# · YAML

Full-Stack Developer

Rentplan - Sacramento, California
Jan 2022 — 2025

Full-stack on a real-estate investment platform — led the React to Next.js migration, then built the data modules and analytics around it.

Next.js · React · Redux · Python · MongoDB · GA4/GTM

B.S. in Web Systems Development

University of Guadalajara (UDG)
2023 — 2026

Focused on Web Application Development.

// contact

Let's talk.

Have a project in mind, a question, or just want to say hello? I'd love to hear from you.

Please enter your name.
Please enter a valid email.
Please enter a message.

Message received.

Thanks I read everything and usually reply within 24 hours.

Or reach out directly:

barrazaaxel2000@gmail.com