← All projects

Aug 2026 to Oct 2026

Ecos

Audio transcription service: upload a file or speak into the microphone and read the text in the app itself. A React SPA on a serverless AWS infrastructure declared entirely as code.

Role
Full-stack (own project)
Period
Aug 2026 to Oct 2026
Client
Ecos
Screenshot of Ecos

Problem

People who work with recorded voice (interviews, meetings, dictated notes) need the text, not the audio, and usually end up spread across recorders, folders and services that only hand back a file. Ecos brings the whole cycle into a single private place: record or upload, transcribe in the background without blocking the user, and come back later to read, copy or download every transcript from the history.

Stack

  • React
  • TypeScript
  • Vite
  • Tailwind
  • TanStack Query
  • Node.js
  • AWS
  • Serverless Framework
  • DynamoDB
  • Speechmatics
  • Jest
  • Cypress

Summary

A private SPA that turns speech into text. Live recording is the primary action: the text appears word by word while you speak, and stopping saves it to the history. Every transcript is read inside the app itself, set in a reading typeface, and copied or downloaded in one click.

Live recording in dark mode: waveform and text appearing while speaking

Decisions that matter

  • Audio never goes through a Lambda. Lambda caps payloads at 6 MB and the product accepts 20, so the browser uploads straight to S3 with a presigned POST and an S3 event starts the transcription.
  • Real time without exposing the key. The browser opens a WebSocket to Speechmatics with short-lived credentials issued by the API; the provider key lives only in SSM.
  • Protected webhook. The provider posts the result to an endpoint that requires a shared secret and compares it in constant time.
  • Hexagonal backend, domain-sliced frontend. Ports and adapters in the API; in the SPA, each domain with its own layers and a barrel as the only way in.
  • All infrastructure as code, CloudFront, OAC and security headers included, deployed from GitLab CI with an OIDC role scoped by name to the project's resources.
Split sign-in screen: form on the left and a live transcript preview on the right

Live demo at ecos-ochre.vercel.app: the sign-in screen shows the demo account and everything is simulated in the browser. Public code at gitlab.com/cristianpadillagm/ecos.

Hiring a full-stack or frontend developer for your remote team? Let's talk.

Contact me