Saltar navegación

Defensa proyecto DAW MPPL

Ajuste de pantalla

El ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:

Subido el 22 de mayo de 2025 por Beatriz J.

3 visualizaciones

Defensa del proyecto de DAW - Mayo - Ignacio Ellacuria

Más información Transcripción

Descargar la transcripción

Bueno, pues buenas tardes. Hoy es día 22 de mayo, son las 7 y 5, y bueno, estamos convocados a través de Jefatura del Departamento para la Defensa del Módulo Profesional del Proyecto del Ciclo Formativo de Grado Superior de DAO, Desarrollo de Aplicaciones Web. 00:00:01
En el aula virtual de proyecto habéis sido informados de los criterios y rúbrica de la calificación. El orden de la presentación del proyecto es el siguiente. 15 minutos máximos para la defensa de tu proyecto, 15 minutos máximos por mi parte para hacerte preguntas y cuestiones y bueno, pues dicho esto, tu tiempo de exposición comienza a partir de este momento. Adelante y mucha suerte. 00:00:20
Vale, pues buenas tardes. Soy María Priscila Pineda Lima y nada, voy a contar un poco sobre mi proyecto que, bueno, como nombre tiene, Clarity Hub, y es un gestor de tareas eficientes. 00:00:42
¿Qué es Clarity Hub? Pues es una aplicación web sencilla, diseñada para la gestión de tareas personales 00:00:59
Esto surge sobre todo de las necesidades que yo por ejemplo como usuaria siempre he utilizado muchos gestores de tareas 00:01:10
pero muchas veces no son con demasiada carga de información, otros son de pago, no van a lo claro, a lo sencillo. 00:01:20
Entonces, pues mi idea fue hacer una aplicación web que tenga lo justo y necesario y que además no tengas que tener una conexión a internet para poder utilizarla. 00:01:34
Entonces, de ahí, como digo, los objetivos de esta aplicación. El objetivo principal era desarrollar este gestor de tareas de una forma que visualmente sea llamativa, accesible y eficiente. 00:01:46
Y algunos de los otros objetivos más específicos, pues que tuviera, lo que he comentado antes, que se pudiera usar sin conexión a internet con el uso de local storage, que tenga un diseño moderno y que se pueda adaptar sobre todo también tanto en las páginas web, o sea, en ordenadores como en pantallas de otros tamaños, tablet, móvil y demás. 00:02:06
También utilizar notificaciones desde la API del navegador y que sea funcional y sencilla y clara. 00:02:33
Dentro de las tecnologías y herramientas que he utilizado 00:02:48
En la parte de front he utilizado sobre todo Angular 00:02:55
JavaScript, TypeScript, Angular Materia, CSS, HTML 00:02:59
Todo para la parte de lógica y visual 00:03:04
Para ello he utilizado herramientas como Visual Studio Code 00:03:08
Angular Clip y Git y GitHub 00:03:13
para para sobre todo de tener un control de los pasos que iba haciendo y bueno si en el caso de 00:03:15
tener que volver atrás y demás bueno pues para tener las diferentes versiones vaquen como he 00:03:24
dicho mi objetivo era realizar no utilizar hacer algo sencillo personal y que puedas usarlo en tu 00:03:30
propio ordenador y no era necesario una base de datos y lo que utilizaba lo que he utilizado es 00:03:38
el propio locales torres y para la parte de la interfaz visual como he dicho también angular 00:03:46
material vale pues el diseño de clarity hub ha sido en una sola es una estructura modular que 00:03:52
Esto quiere decir que está utilizado diferentes bloques, diferentes módulos 00:04:06
y está todo organizado en una única carpeta, por así decir, 00:04:14
para que se pueda entender, en la que está dividida la parte lógica, 00:04:20
que sería la app-component.ts, que es esa parte lógica, 00:04:24
HTML para esa parte estructural y visual y la carpeta de CSS para poder poner los estilos, 00:04:30
tanto generales como específicos. 00:04:43
Y dentro de esa parte visual, de diseño, que es lo que le he dedicado bastante tiempo, 00:04:46
Bueno, he utilizado Angular Material 00:04:52
Y dentro de ello, por ejemplo, he utilizado 00:04:56
MatToolBad, que es para la cabecera 00:05:00
Del navegador, el MatForm para los formularios 00:05:05
Que ya os enseñaré, y bueno, así 00:05:09
Para el MatIcon, MatButton, y eso lo puedo ir explicando 00:05:12
Ahora cuando vaya enseñando la propia aplicación 00:05:16
Vale, las funcionalidades que he implementado en esta aplicación son las que he considerado que eran las esenciales, como crear, editar y eliminar tareas, agregar subtareas, poder tener categorías de tareas, 00:05:20
tanto si es personal, de trabajo, de estudio y que tenga también diferentes filtros que lo puedas poner, por ejemplo, por fecha de creación o por prioridad o por categorías, que puedas hacer un filtrado y ver únicamente lo que realmente te interesa en ese momento. 00:05:41
Otras de las funcionalidades, como he dicho, son los recordatorios de notificaciones locales 00:06:05
Y bueno, los filtros y órdenes que he comentado ya 00:06:11
Otras de las funcionalidades que puedes ver en las imágenes 00:06:14
Es que he agregado también un modo 00:06:20
La aplicación se basa en un modo claro 00:06:24
Pero también le he puesto para que pueda ser algo un poco más visual 00:06:27
Tenga la opción de modo oscuro 00:06:30
Y se puede poner tanto en vista de lista como en vista de cuadrícula. Y ahí en la última foto vemos un ejemplo de cómo se vería adaptada a un tamaño de un móvil habitual. 00:06:32
Vale, pues Clarity Hub no solo se centra en eso, también está pensado con una base sólida para que pueda ir creciendo a lo largo del tiempo y poder hacer de esta pequeña base sólida una aplicación mucho más robusta y poder llegar a diferentes vías de mejora, por así decirlo. 00:06:46
Entonces, algunas de esas vías de mejoras que yo puedo proponer para un futuro, por ejemplo, sería la sincronización en la nube. Es verdad que yo pretendía poner que no tuviera un backend como tal en esta primera fase, pero sí que se podría agregar que las tareas se guarden en la nube para poder abrirlas desde otro ordenador. 00:07:19
Si no, una de las limitaciones que tendría sería que solo es a nivel personal y se pueden guardar esas tareas solo en tu propio ordenador. Entonces, hay cosas que beneficia y cosas que, bueno, en un futuro se podrían ampliar. 00:07:45
También se podría hacer como una gestión múltiple de usuarios, esto podría venir bien como para que si tú estás con compañeros de estudio, por ejemplo, compartir tareas 00:07:59
Que uno se dividan y puedan, bueno, pues eso, dividirse un poco el trabajo y demás 00:08:11
Aunque la aplicación está adaptada a las pantallas de móvil, por ejemplo 00:08:17
Sí que se podría adaptar de una forma un poco más profunda 00:08:24
Con algunas aplicaciones específicas para aplicaciones móviles 00:08:31
Como IONI, por ejemplo 00:08:36
Y bueno, se podría también poner calendarios 00:08:37
Al final las notificaciones son a nivel local 00:08:42
pero se podrían integrar con calendarios externos como Google Calendar y que esas notificaciones también te puedan llegar a través de otras partes. 00:08:45
Bueno, y por último, hablar un poco de las conclusiones a las que llego con esta publicación. Creo que lo que me he planteado, al final, todos los objetivos que he ido teniendo, o sea, que he ido poniendo, los he alcanzado. 00:08:58
Y bueno, al final he podido poner en práctica los conocimientos que yo anteriormente también tenía de Angular y muchas veces, aunque yo estoy trabajando en esto, muchas veces te metes en un proyecto a hacer unas correcciones 00:09:28
o hacer cosas desde un punto donde otro programador lo ha dejado. 00:09:53
Entonces a mí esto me ha servido también mucho para poder hacer algo 00:10:00
desde un inicio hasta un final. 00:10:03
Entonces para mí ha sido también un logro de poder guiarme yo misma, 00:10:06
poner las pautas, los objetivos y poder ir avanzando y consiguiendo poner eso en práctica 00:10:11
todo lo que he aprendido hasta ahora. 00:10:16
vale y si te parece bien tengo aquí el enlace para poder demostrar la aplicación vale y a ver 00:10:23
vale estás viendo la pantalla perfecto vale vale pues esta sería la pantalla principal 00:10:44
Aquí sí que se pueden ver algunas modificaciones respecto a las imágenes que había puesto en el PDF, porque es una pantalla de ordenador un poco más pequeña, ¿vale? Entonces, se recolocan un poco los filtros, los botones, ¿vale? 00:10:54
Entonces, voy a hacer una demostración, ¿vale? Creando una tarea. Vale, aquí no sé por qué me sale un poco más grande el formulario de lo habitual, pero bueno. 00:11:13
Vale, perdón. 00:11:37
sí qué tipo de prioridad tiene la tarea vale yo la voy a poner en alta en este caso 00:12:18
vamos a poner sí que es una notificación para hoy son las 17 las 19 17 pues voy a poner las 19 10 y 00:12:27
nueve, ¿vale? 00:12:43
Diecinueve, para que dé tiempo. 00:12:48
Y aquí está lo que comentaba, las categorías, tanto de trabajo, personal, estudio, ¿vale? 00:12:51
Y añadimos la tarea. 00:12:57
Aquí estaría la tarea, ¿vale? 00:13:00
Con su prioridad, el color rojo, las demás tendrían color amarillo o verde según su prioridad, ¿vale? 00:13:03
Y aquí tenemos las diferentes opciones, como agregar subtareas, lengua, por ejemplo, ¿vale? Tanto la tarea en sí se puede editar o eliminar, igual que las subtareas, ¿vale? O modificar. 00:13:12
Y aquí podemos ver la notificación que teníamos, las 19.19, que queda unos segundos o un minutillo para que salte, y la categoría que le hemos puesto. 00:13:36
Esto, como comentaba, tiene los diferentes filtros, tanto pendientes como completadas, y los filtros de categorías, que en este caso si ponemos otro no tendríamos nada, y ordenar también por fecha de creación o prioridad. 00:13:52
también la parte de lista o cuadrícula aquí como vemos se ha modificado porque 00:14:17
lo estamos viendo en en lista y se modifica luego si no ponemos 00:14:23
podemos poner otro para verlo vale 00:14:29
la notificación no sé por qué no sé si es que no no sé si es que esta me salta 00:14:37
en otra pantalla o qué y si no hacemos ahora otra otra prueba 00:14:47
vale y esto que íbamos a mostrar pues las completadas y que aparecerían 00:14:53
vale lo mismo pues con el modo oscuro vale se verían los colores más 00:15:01
bueno más apagados 00:15:11
Y bueno, más o menos 00:15:12
¿Vale? Y con esto 00:15:17
Más o menos 00:15:20
Pues es la demostración un poco de la aplicación 00:15:22
No sé si 00:15:24
Si tienes alguna duda 00:15:29
O si quieres 00:15:30
Alguna preguntilla 00:15:32
Te comento, estoy viendo que lo estás utilizando 00:15:33
En un Apple, ¿no? 00:15:36
Entonces, mira, una pregunta era esa 00:15:38
Si valía solo para Windows 00:15:40
Sí, hay algunos pequeños matices, como por ejemplo la notificación, que veo que no me ha saltado bien y que puede ser que esté influyendo eso. 00:15:42
La verdad es que mi ordenador solo es Windows y aunque lo he probado en el móvil y demás, sí que me saltaba, pero es posible que sea uno de los inconvenientes con Apple. 00:15:59
Vale, una pregunta era esa y también lo de los avisos. También con respecto a lo de los avisos, si solo has probado a lo mejor en Windows, ¿has llegado a probar si o podría ser una mejora futura que se pudieran implementar en una aplicación externa? 00:16:15
¿Que nosotros tengamos una aplicación externa de avisos y poder implementar, fusionar lo que es tu aplicación con esa aplicación de avisos? 00:16:35
¿O al menos crees que podría ser posible en una aplicación futura? 00:16:44
No sé si te estoy entendiendo bien. 00:16:50
La aplicación, sí, los avisos como tal, las notificaciones, tú aquí lo configuras y... 00:16:52
Ah, para que sean, sí, como un aviso en el propio navegador, pero sí que se podría hacer que ese aviso sea no con el propio navegador, 00:16:59
pero sí que agregar una parte de alguna otra manera, sí que podría ser una mejora y sería factible que se pudiera hacer de una manera diferente para que no solo dependa de eso. 00:17:09
Vale. Y luego, bueno, estoy viendo que lo tienes en un GitHub, ¿cómo se diga? Y ahora mismo, bueno, lo tienes como compartido, digamos, de alguna manera para que tanto tú como yo, que lo he podido probar, accedamos a ello. 00:17:23
Pero como decías que es una aplicación en local, ¿cómo te lo descargarías en local? 00:17:43
Sería tal cual con ese, sería como un enlace, o sea, lo tendrías como en tu cuenta de navegador, no sé si me explico. 00:17:49
Pero es que como no he visto una gestión de usuarios como tal, o sea… 00:18:12
Claro, bueno, es que eso es verdad que solo está hecho, en principio solo está hecho esta primera fase, por así decirlo, que sea algo personal, es algo individual. 00:18:16
Entonces lo tienes tú en tu propio ordenador, pero sí que he pensado que para algunas otras de las mejoras que podría hacer sería ponerle un login para que pueda hacer algo más individual 00:18:28
y cada uno pueda conectarse con su propio mail, por ejemplo, su propia contraseña 00:18:42
y que cada persona pueda usarlo de esa manera y no solo esté en tu ordenador. 00:18:49
Vale, vale. Es que, ves, por ejemplo, yo ahora estoy accediendo y, bueno, pues en realidad no veo la que tú has creado, o sea, no es como… 00:18:57
No, porque es personal. Esto solo se guarda en el ordenador y solo lo puedo ver yo. 00:19:10
Si tú abres la aplicación, es como que vuelve a cero. 00:19:14
Es algo solo de cada ordenador. 00:19:20
Yo si, por ejemplo, apago el ordenador y mañana vuelvo a entrar, mi tarea está. 00:19:24
Vale. 00:19:29
Pero no vería la de nadie más. 00:19:30
Aunque no gestione usuarios, más o menos sí gestiona al final que sea particular, porque lo guarda el local. 00:19:32
Claro, exacto. 00:19:38
Vale. 00:19:39
Vale, bueno, pues tener también así un poquillo, no entendía tampoco muy bien como lo del uso del servidor local que mencionas en el, que accedes al localhost con el puerto 4200 que mencionas en el trabajo, no entiendo muy bien que funciona. 00:19:40
Claro, esto es simplemente para poder levantar la aplicación. 00:20:03
Yo, para, esto sí que es en el GitHub, pero yo para desarrollar la aplicación, 00:20:07
a lo que me refería era eso, en el momento del desarrollo de la aplicación, 00:20:15
para poder ir yo viendo los cambios a tiempo real que he ido haciendo, 00:20:19
lo que tiene el Visual Studio es que puedo levantar esa aplicación 00:20:25
y poder verlo en mi local store, por así decirlo, 00:20:31
en lo que tú has dicho del 42, 40.200, ¿vale? 00:20:37
Que es donde normalmente se levanta la aplicación 00:20:41
y yo entonces, yo todos los cambios que he ido haciendo, 00:20:43
he podido verlos a tiempo real. 00:20:46
Entonces, a mí me facilita mucho el trabajo 00:20:47
porque vas viendo todo lo que vas creando, 00:20:49
los errores vas probando. 00:20:52
Entonces, así al final vas viendo sobre, pues eso, 00:20:54
a tiempo real todo lo que vas creando 00:20:58
y si tienes que hacer alguna modificación antes de que veas que algo no funciona, o sea, que lo puedes ver en el momento. 00:21:00
Vale, o sea, que primero lo has implementado ahí y luego ya lo has subido al GitHub, ¿no? 00:21:09
Exacto, exacto. 00:21:16
Vale, vale. Vale, pues bueno, no tengo más preguntas. En principio ya he visto que has corregido todas las indicaciones que te dije y nada, pues está bien. 00:21:17
Estate tranquila, bueno pues si quieres cortamos por aquí la grabación porque esto es suficiente y dame un segundito, gracias por tu exposición, dame un segundín. 00:21:30
Sí. 00:21:44
Idioma/s:
es
Etiquetas:
Desarrollo de Aplicaciones Web
Niveles educativos:
▼ Mostrar / ocultar niveles
  • Formación Profesional
    • Ciclo formativo de grado básico
      • Primer Curso
      • Segundo Curso
    • Ciclo formativo de grado medio
      • Primer Curso
      • Segundo Curso
    • Ciclo formativo de grado superior
      • Primer Curso
      • Segundo Curso
Autor/es:
Beatriz Jiménez
Subido por:
Beatriz J.
Licencia:
Todos los derechos reservados
Visualizaciones:
3
Fecha:
22 de mayo de 2025 - 19:57
Visibilidad:
Clave
Centro:
IES CIFP a Distancia Ignacio Ellacuría
Duración:
21′ 47″
Relación de aspecto:
1.78:1
Resolución:
1920x1080 píxeles
Tamaño:
184.36 MBytes

Del mismo autor…

Ver más del mismo autor

EducaMadrid, Plataforma Educativa de la Comunidad de Madrid

Plataforma Educativa EducaMadrid