Sitio web y aplicación para la escuela de lengua portuguesa Bairro Alto.

Proyecto en desarrollo

Tres roles de usuario:

1. Administrador

bairo-admin.mov

El administrador tiene acceso al CMS en el que puede editar el contenido de las páginas web, añadir noticias, artículos, imágenes, etc.

Las páginas web se editan en el WYSIWYG editor CKEditor 5.

2. Profesor

bairo-profe.mov

Desde el menú lateral, el profesor tiene acceso a las siguientes opciones:

1. Mis grupos

2. Crear un grupo

3. Crear lección

4. Chat

1. Mis grupos

El profesor tiene acceso a sus grupos y a todos los grupos de la escuela. Puede agregar o quitar cualquier grupo a su lista.

Entrando en uno de los grupos se pueden ver tabs:

• Los deberes

  Habiendo ingresado a uno de sus grupos, el profesor puede crear tareas para el grupo usando el WYSIWYG editor CKEditor 5. Puede agregar imágenes y archivos de audio(mp3, ogg, wav). Las imágenes en el servidor serán convertidas a formato .webp por el paquete sharp.

• Los alumnos

  Puede ver la lista de los estudiantes del grupo, eliminar a un estudiante del grupo.

• Agregar un alumno

  Puede agregar un estudiante al grupo, seleccionándolo de la lista de todos los usuarios en la tabla creada con ag-grid-vue. Donde puede utilizar la búsqueda por apellido, nombre o correo electrónico.

• Notas on-line

  Es la página para crear notas durante la clase online.

  • Puede ingresar la versión incorrecta de la palabra (frase) utilizada por el estudiante. (O puede ser una palabra (frase) nueva, p.e.)
  • Introduce la opción correcta.
  • Y marque "Palabra nueva", "Error", "Pronunciación", "Otro".

  Todas las notas se muestran en una tabla donde se pueden buscar, ordenar por tipo, nota, variante correcta o fecha.

• Lecciones del Grupo.

  El profesor puede ver la lista completa de lecciones en la tabla y agregar (eliminar) lecciones para este grupo. Esta tabla permite buscar y ordenar por Título de la lección, Autor, Nivel, Fecha de creación.

2. Crear un grupo

Input donde se puede ingresar el nombre del nuevo grupo

3. Crear lección

El profesor puede crear lecciones usando el WYSIWYG editor CKEditor 5. Puede agregar imágenes y archivos de audio(mp3, ogg, wav). Las imágenes en el servidor serán convertidas a formato .webp por el paquete sharp.

Es necesario asignar el nivel de la lección A1, A2, B1, B2

4. Chat

Chat similar a Telegram o WhatsApp.

• Es posible crear salas para la comunicación con los usuarios de la aplicación.
• Adjuntar archivos a los mensajes.
• Editar, eliminar mensajes.
• Reacciona con un emoji
• Grabar y enviar un mensaje de voz, etc.

Se utiliza el componente vue-advanced-chat.

Cloud Firestore para guardar mensajes y usuarios.

Realtime Database para comprobar si el usuario está on-line.

Firebase storage para guardar los archivos

3. Estudiante

bairo-student.mov

El alumno desde el menú lateral tiene acceso a las siguientes opciones:

• Notas

  Una tabla con todas las notas que el profesor tomó durante las lecciones. Todas las notas se muestran en la tabla donde se pueden buscar, ordenar por nota, variante correcta o fecha.

• Lecciones.

  Todas las lecciones añadidas por el profesor al grupo al que pertenece este alumno.

• Chat

  El mismo chat que se describe en la sección Profesor. Para la comunicación con el grupo y profesor. O con cualquier usuario de la aplicación.

---

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your unit tests

npm run test:unit

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.