Skip to content

Presentamos el Nuevo Sitio Web Alyonka.app

Me complace anunciar el lanzamiento del nuevo sitio web alyonka.app — una plataforma interactiva de aprendizaje de idiomas y presencia profesional en línea diseñada para Alyona Novikova, profesora de inglés y portugués radicada en Cascais y Lisboa, Portugal.

Lo que comenzó como una simple idea de tarjetas de vocabulario se ha convertido en una aplicación web full-stack completa que combina ejercicios interactivos de aprendizaje (juegos de emparejamiento, crucigramas dinámicos y cuestionarios) con una moderna página de presentación para profesores y un sistema de creación de contenidos administrativos.


¿Qué es Alyonka.app?

La plataforma cumple dos funciones principales:

  1. Página de Profesora y Reserva de Clases: Un espacio en línea para estudiantes que buscan clases de inglés y portugués (online en todo el mundo o presenciales en Lisboa y Cascais). Cuenta con soporte multilingüe (inglés, portugués, ruso, ucraniano, alemán, francés), detalles del plan de estudios, testimonios de estudiantes y opciones directas de contacto.
  2. Motor de Ejercicios Interactivos: Un entorno de práctica gamificado donde los estudiantes pueden reforzar vocabulario, gramática y comprensión auditiva a través de ejercicios atractivos.

Características de Aprendizaje Interactivo

1. Juegos de Emparejamiento (Match-Up)

El reproductor de Match-Up permite a los estudiantes emparejar palabras, frases, definiciones e imágenes. Cuenta con animaciones fluidas, seguimiento de progreso y celebración con confeti al completarlo.

2. Crucigramas Procedurales

La plataforma incluye un generador automático de crucigramas que distribuye palabras y pistas en una cuadrícula óptima interconectada. El reproductor interactivo proporciona:

  • Navegación táctil y por teclado
  • Pistas y explicaciones para cada palabra
  • Temas visuales personalizados
  • Validación instantánea y seguimiento de respuestas

3. Cuestionarios Interactivos (Quizzes)

Soporta preguntas de opción única y múltiple, explicaciones enriquecidas para cada respuesta y resúmenes de puntuación detallados.

4. Catálogo de Ejercicios con Búsqueda

Los estudiantes pueden buscar y filtrar ejercicios por título, categoría, etiquetas y nivel de idioma.


Pila Tecnológica y Arquitectura

CapaTecnología
Framework FrontendSvelteKit 2 + Svelte 5 (Runes)
EstilosTailwind CSS v4
Backend y SSRSvelteKit (@sveltejs/adapter-node)
Base de DatosPostgreSQL + Kysely (Constructor de consultas tipado)
AutenticaciónBetter Auth (@better-auth/kysely-adapter)
Procesamiento de ImágenesSharp (conversión y optimización WebP)
PruebasVitest + Testcontainers (PostgreSQL)
DespliegueDocker y Docker Compose
ObservabilidadPino structured logger + métricas Prometheus

Aspectos Técnicos Destacados

Runas de Svelte 5 para el Estado del Juego

Los reproductores de ejercicios aprovechan el nuevo modelo de reactividad de Svelte 5 con runas ($state, $derived, $props). Esto simplifica la gestión de estados interactivos complejos (posiciones de cursor en crucigramas, historial de cartas seleccionadas, temporizadores) sin librerías externas de estado.

Capa de Datos Tipada con Kysely

Todas las consultas a la base de datos están estrictamente tipadas. Las migraciones se gestionan con scripts TypeScript y las pruebas de integración utilizan Testcontainers para levantar contenedores PostgreSQL reales y aislados.

Optimización Automática de Imágenes

Al subir ilustraciones o generarlas mediante IA, las imágenes se procesan, escalan y convierten al formato WebP mediante Sharp, asegurando rapidez en conexiones móviles.


Enlaces del Proyecto