Implementar sistema de evaluación (quiz) para los posts #107
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This commit introduces an interactive quiz feature to allow users to test their understanding of the post content. Key changes include: - A new `PostActionsSheet` component is added to the end of posts, which opens a modal to start the evaluation. It uses `createPortal` to ensure proper stacking context. - The core `Quiz` component is created to manage the entire evaluation flow. It fetches questions from a dedicated JSON file based on the post's slug, tracks progress and score, and displays a results summary with a visual score indicator. - The post page (`[post]/page.jsx`) is updated to include the new action sheet. - Data for quizzes is structured in JSON files within `/public/quiz/qa/`, making it easy to add new evaluations for other posts.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Descripción
Este pull request introduce una nueva funcionalidad de evaluación interactiva para los artículos del blog. El objetivo es mejorar la participación del usuario y ofrecer una herramienta para que los lectores puedan autoevaluar su comprensión del contenido.
Los cambios principales incluyen:
PostActionsSheet.jsx: Un nuevo componente que se muestra al final de cada post. Contiene un botón "Evaluar" que despliega una hoja modal desde la parte inferior de la pantalla. UtilizacreatePortalpara renderizar el modal en elbody, asegurando que se muestre correctamente sobre todo el contenido.Quiz.jsx: El componente principal que gestiona toda la lógica del cuestionario. Sus responsabilidades incluyen:Integración en
[post]/page.jsx: Se ha modificado la página de los posts para incluir el nuevo componentePostActionsSheetal final del contenido.Datos de Quiz (
/public/quiz/qa/): Se han añadido tres archivos JSON como ejemplo, conteniendo las preguntas y alternativas para los posts "qué-es-react", "cuáles-son-las-características-principales-de-react" y "qué-significa-exactamente-que-sea-declarativo".Checklist
Quiz.jsxcon la lógica para cargar preguntas, gestionar respuestas y mostrar resultados.PostActionsSheet.jsx, una hoja modal que se abre concreatePortalpara iniciar la evaluación.[post]/page.jsx).EscapeyARIAattributes).