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 ​