Desarrollar Progressive Web Application de Noticias

Se requiere implementar una aplicacion de noticias con la tecnologia Progressive Web Application. El entorno de programación se debe llevar a cabo con esta tecnologia y el backend de Firebase. Todo el cófigo fuente debe ser entregado. No se incluye ningun formato ni imagenes, debe ser proporcionado por el programador. El producto debe funcionar correctamente en los navegadores de Pc/Mac, mobiles y tablets ios/android con las funcionalidades que se describen a continuación: 1. Registro en la aplicación Es la página inicial de la aplicación. en la parte superior debe estar el logo y debajo los botones para entrar con facebook/google/twitter/email. Se debe introducir tambien Nickname y codigo postal. [login to view URL] en la parte superior. De izquierda a derecha: Logo noticias/ Logo Top/ Logo app/ Logo estrella/ Logo perfil 2.1 Submenu (Top/favoritas) Debajo del menu en horizontal: Filtrar/Ordenar/Mapa 3. Sección Noticias: es la pantalla inicial de la aplicación. Se muestran las noticias ordenadas de mas recientes arriba y mas antiguas abajo. 3.1 Boton añadir noticia. En alguna parte debe aparecer el boton + para poder añadir una noticia. Una vez pulsado se lanzaran diferentes pantallas tipo “wizard” 3.1.1 TITULO Nueva ventana donde se introduzca el titulo,hastag i el boton siguiente. 3.1.2 DESCRIPCIÓN Nueva ventana donde se introduzca la descripcón/foto o video i el boton siguiente/atras. 3.1.3 UBICACION Nueva ventana donde se introduzca la ubucaion el boton siguiente/atras. 3.1.3.1 La ubicacion debe seleccionar si es MUNDIAL/CONTINENTAL(europa/asia/america/etc...)/NACIONAL (españa/francia/etc...) REGIONAL (Madrid/Cataluña/Pais Vasco/etc...) CIUDAD(Barcelona/Madrid/Valencia) DISTRITO (Codigo Postal) Solo se puede seleccionar un ámbito. Mapa para introducir manualmente la ubicacion dentro de google maps. 3.1.4 RESUMEN Ultima ventana donde se verá el resumen de la noticia y el boton atras/Publicar. 3.2 Filtrado de noticias. Cada usuario tendrá filtradas sus noticias segun su ubicacion. Por ejemplo si el usuario se ha registrado en la ciudad de Barcelona, en el apartado noticias verá únicamente noticias publicadas en Barcelona/Cataluña/España/Europa/[login to view URL] podrá ver noticias de Madrid, Paris o Alemania. Si las relacionadas en el ámbito de España o Europa por ejemplo. 3.3 Diseño apartado noticias: Cada noticia debe estar en un recuadro y separada con un pequeño espacio entre ellas “estilo facebook”. Dentro del recuadro debe aparecer la foto y nickname del creador. El titulo, hastag, descripción, ambito, grafico estrellas (1 a 5), numero de likes, tiempo de publicación (hace 1 hora/ hace 1 mes) y el boton “Like”. 3.5 Seleccion de noticia: si el usuario pulsa sobre la noticia abrirá una página nueva donde mostrara la descripcion completa y la foto/video augmentado. 4. Seccion Noticias TOP Lo mismo que la sección noticias pero con un submenu con los siguientes puntos: Filtrar/Ordenar/Mapa. En esta seccion solo se veran las noticias con un minimo de 1 estrella y por defecto se ordenaran de mayor estrellas 5 a menor 1. 4.1 Filtrar: se abrirá un submenu seleccionando lo siguiente: Ubicacion: Mundial/Continental/etc... Estrellas: 1/2/3/4/5 Dias publicado: hoy/ ultima semana/ ultimo mes/ ultimos 3 meses/ ultimo año 4.2 Ordenar: se abrirá un submenu seleccionando lo siguiente: estrellas dias Proximos 4.3 Mapa: se abrirá una ventana con el mapa y la ubicación de las noticias. si se clica en una se debe ir a su contenido detallado. 4. Seccion Noticias FAVORITAS Lo mismo que el apartado TOP pero solo apareceran las noticias que hayamos pulsado en “Like” Si pulsamos cualquier noticia que tenga un Like del usuario tendrá acceso a dos apartados privados: 4.1 Seguimiento del creador: El creador podrá seguir publicando sub-noticias en una pagina destinada a ello 4.2 Chat abierto: se podrá chatear dentro de la noticia en un pagina destinada a ello. 5. Pagina perfil de usuario y paginas de seguridad y privacidad de la app