Editor y previsualizador de lenguaje de marcado Markdown en tiempo real. Markdown es un lenguaje de marcado ligero que permite al usuario escribir utilizando un formato de texto fácil de leer y escribir, que luego se convierte en un HTML estructuralmente válido.
La aplicación consta de dos componentes principales: una área de texto de entrada donde los usuarios pueden escribir o editar texto en formato Markdown, y una vista previa que muestra cómo se renderiza el texto Markdown como HTML.
Mientras el usuario escribe en el área de texto de entrada, la vista previa se actualiza en tiempo real para reflejar los cambios. Esto permite a los usuarios ver inmediatamente el resultado final de su texto de Markdown, facilitando la creación y edición de contenido en Markdown.
Historias de usuario:
- Ver un elemento textarea con el atributo "id" correspondiente a "editor".
- Visualizar un elemento con el atributo "id" correspondiente a "preview".
- Al ingresar texto en el elemento #editor, deseo que el elemento #preview se actualice en tiempo real y muestre el contenido del área de texto mientras escribo.
- Al ingresar texto en formato Markdown en el elemento #editor, deseo que el texto se represente como HTML en el elemento #preview mientras escribo. (SUGERENCIA: Puede utilizar la biblioteca Marked para esto: https://cdnjs.com/libraries/marked).
- Al cargar la vista previa de Markdown por primera vez, el campo #editor debe contener un Markdown válido que represente al menos uno de cada uno de los siguientes elementos: un encabezado (tamaño H1), un subtítulo (tamaño H2), un enlace, código en línea, un bloque de código, una lista, una cita en bloque, una imagen y texto en negrita.
- Al cargar la vista previa de Markdown por primera vez, el contenido Markdown predeterminado en el campo #editor debe representarse como HTML en el elemento #preview.