Skip to content

Lancement du Nouveau Site Web Alyonka.app

Je suis ravi de vous annoncer la mise en ligne du nouveau site alyonka.app — une plateforme interactive d'apprentissage des langues et une vitrine professionnelle développée pour Alyona Novikova, professeure d'anglais et de portugais basée à Cascais et Lisbonne, au Portugal.

Ce qui a débuté comme une simple idée de cartes de mémorisation est devenu une application web full-stack complète combinant des exercices pédagogiques interactifs (jeux d'association, mots croisés dynamiques, quiz) avec un site vitrine moderne et un espace d'administration pour la création de contenus.


Qu'est-ce qu'Alyonka.app ?

La plateforme répond à deux besoins majeurs :

  1. Site Vitrine et Réservation de Cours : Un portail en ligne pour les apprenants recherchant des cours d'anglais et de portugais (en ligne partout dans le monde ou en présentiel à Lisbonne et Cascais). Il intègre un support multilingue (anglais, portugais, russe, ukrainien, allemand, français), le détail des programmes, des témoignages et des coordonnées directes.
  2. Moteur d'Exercices Interactifs : Un espace d'entraînement ludique permettant aux étudiants de consolider leur vocabulaire, leur grammaire et leur compréhension orale à travers des jeux éducatifs.

Fonctionnalités d'Apprentissage Interactif

1. Jeux d'Association (Match-Up)

Le lecteur Match-Up permet d'associer des mots, des phrases, des définitions et des images. Il propose des animations fluides, un suivi de la progression et une célébration avec confettis lors de la réussite.

2. Mots Croisés Procéduraux

La plateforme intègre un générateur automatique qui organise les mots et indices sur une grille optimisée. Le lecteur interactif propose :

  • Navigation par clavier et écran tactile
  • Indices et explications pour chaque mot
  • Thèmes visuels personnalisés
  • Validation instantanée des réponses

3. Quiz Interactifs

Prise en charge de questions à choix unique et multiple, avec explications pédagogiques détaillées et récapitulatif des scores.

4. Catalogue d'Exercices avec Recherche

Les étudiants peuvent explorer et filtrer les exercices par titre, catégorie, tags et niveau linguistique.


Stack Technique et Architecture

CoucheTechnologie
Framework FrontendSvelteKit 2 + Svelte 5 (Runes)
StylesTailwind CSS v4
Backend et SSRSvelteKit (@sveltejs/adapter-node)
Base de DonnéesPostgreSQL + Kysely (Query builder typé)
AuthentificationBetter Auth (@better-auth/kysely-adapter)
Traitement d'ImagesSharp (conversion et optimisation WebP)
TestsVitest + Testcontainers (Conteneurs PostgreSQL)
DéploiementDocker et Docker Compose
ObservabilitéLogger Pino + métriques Prometheus

Points Clés d'Ingénierie

Les Runes Svelte 5 pour l'État des Jeux

Les lecteurs d'exercices exploitent le système de réactivité de Svelte 5 grâce aux runes ($state, $derived, $props). Cela permet de gérer facilement des états interactifs complexes (positions de curseur dans les mots croisés, historique des sélections, minuteurs) sans bibliothèques externes.

Couche de Données Typée avec Kysely

Toutes les requêtes SQL sont strictement typées. Les migrations sont gérées en TypeScript, et les tests d'intégration démarrent des instances PostgreSQL réelles et isolées via Testcontainers.

Optimisation Automatique des Médias

Lors de l'ajout d'illustrations ou de la génération d'images par IA, les fichiers sont automatiquement redimensionnés et convertis au format WebP via Sharp.


Liens du Projet