SpaceBP

Una página web en la que podrás aprender y saber sobre las últimas noticias del universo que nos rodea.

A web page where you can learn and know about the latest news about the outer space.

Checkpoint

https://youtu.be/BFuq3WSRzIM

Anteproyecto

Todo lo escrito a partir de aquí está sujeto a cambios.

Landing page

• La "landing page" tendrá lo siguiente:
• 1 enlace para el "Sign in" o "autenticación"
• 1 enlace para el "Sign up" o "Registro"
• Tendrá un vídeo de fondo de temática espacial
• En el centro de la página tendrá una breve descripción del sitio web

Páginas de autenticación y de registro

• En las páginas de autenticación y registro tendrán sus respectivos campos (con esto me refiero a los típicos campos de nombre usuario, contraseña, email, ...).
• En la página de registro tendrá el añadido de que el usuario podrá subir una foto de perfil.

Sobre el usuario

• El usuario tendrá una foto de perfil.
• Tendrá un apartado con sus fotos favoritas (las que se ha guardado).
• Tendrá un apartado con sus noticias favoritas (las que se ha guardado).
• Tendrá un apartado con sus publicaciones subidas.

Roles de usuarios

Super Administrador

• El usuario super administrador podrá eliminar y editar a usuarios super administradores, administradores y normales.

Administrador

• El usuario super administrador podrá eliminar y editar a usuarios administradores y normales.

Usuario normal

• Este usuario podrá guardarse tanto fotos como noticias.

Páginas dentro de la aplicación

El fondo de esta páginas será un fondo negro, en el que irán apareciendo svg con forma de estrellas de forma aleatoria por el fondo.

Noticias

• En otra de las páginas lo que habrá serán noticias importantes sobre el mundo de la astronomía, como despegues o novedades en naves, etc. El usuario podrá almacenar, o darle favorito a una de estas noticias y quedarán guardadas en perfil. Este punto me gustaría hacerlo con la ayuda de una api que de información sobre este tema.

Galería

• En unas de las páginas habrá una galería de imágenes en las que al pulsar, se abrirá un cuadro que contendrá un texto en el que pondrá el título de la foto, la descripción en sí y el nombre del autor.

Publicaciones

• En esta página aparecerán publicaciones sobre el espacio, ya sean curiosidades, aartículos científicos, etc..., subidas por los usuarios.

Sistema solar

• Usando un framework para hacer páginas en 3D (A-FRAME seguramente), intentaré hacer un sistema solar, con el que se podrán ver los planetas, sus recorridos e información sobre ellos.

Dentro de la página web habrá un botón para poner/quitar música.

Donde hay un recuadro en el que pone perfil, estará la foto de usuario empequeñecida.

Enlace al prototipo/esquema de mi página web

He de aclarar que este es meramente un boceto, la página web va a tener un aspecto totalmente diferente a este. Este prototipo solo sirve para saber como va a estar estructurada la página. https://www.figma.com/file/EaCTyHyz2zIQh3lrWcPsyQ/Prototipo-Proyecto-final?node-id=0%3A1

Diagrama E/R

Las relaciones muchos a muchos entre usuarios - fotos y usuarios - noticias, son las noticias y las fotos que los usuarios se han guardado/le han dado favoritos.

Semanas

Semana 1

• Landing page
• Autenticacíon
• Registro
• El estilo de las páginas anteriormente dichas

Semana 2

• Arreglo de errores
• Página principal
• Perfil

Semana 3

• Arreglo de errores
• Perfil de usuario terminado
• Elección de APIs y de herramientas para realizar las páginas principales de la página web

Semana 4

• Arreglo de errores
• Empezado la vista de Galería
• Empezado la vista de Noticias
• Empezado con la funcionalidad del like

Semana 5

• Terminado la vista de la Galería
• Terminado la vista de las Noticias
• Terminada la vista de una sola foto
• Sigo con la funcionalidad del like

Semana 6

• Resolución de errores
• Terminada la funcionalidad del like
• Terminada la gestión de usuarios por parte de usuarios administradores y super administradores
• Paginación

Tecnologías

Las tecnologías que voy a utilizar van a ser las solicitadas/obligatorias, de los requisitos escritos por los profesores:

• Backend = Laravel
• Frontend:
  • Html
  • CSS3
  • JQuery
  • A-frame
  • Ajax
  • También me estoy planteando utilizar Livewire, pero aún me tengo de documentar sobre esta tecnología

En el caso de cambiar alguna de estas tecnologías por otras, lo hablaré con el profesor pertinente de esa asignatura.

Despliegue de la aplicación

Para el despliegue de la aplicación tengo pensado utilizar es Amazon Web Services, tanto para la base de datos como para web en sí y sería en 2 máquinas separadas.

Aplicación terminada

https://spacebp.com/en

Video tutorial

https://youtu.be/G9sR3KCwKAg

Como usar la aplicación

Landing page

login

Registro

Entrar a la aplicación sin autenticación

Galería

Imágenes guardadas

Noticias

Noticias guardadas

paginacion

Perfil de usuario

Bibliografía

Para cambiar las rutas de Fortify: https://www.youtube.com/watch?v=Z3O9Pflsl4g&ab_channel=Codecourse

Para cambiar las rutas de Laravel Jetstream: https://www.youtube.com/watch?v=jEHxoMXmKhs&ab_channel=Codecourse

Documentación de Laravel: https://laravel.com/docs/8.x/installation

Documentación de Livewire: https://laravel-livewire.com/docs/2.x/quickstart

Documentación API Nasa: https://api.nasa.gov/

API noticias: https://www.spaceflightnewsapi.net/

Documentación API noticias: https://api.spaceflightnewsapi.net/v3/documentation

Sistema solar utilizado: https://paulohscwb.github.io/solar-system/vr/solar.html

Para utilizar Ajax he utilizado los apuntes de Mayorga.

Documentación de Sass: https://sass-lang.com/documentation/

Documentación de Laravel Jetstream: https://jetstream.laravel.com/2.x/introduction.html