Dreative

Indice

Descripcion del proyecto

Temática 💡

Esta será una aplicacion que usará la API de openAI para crear imagenes a traves de inteligencia artificial a partir de una descripción aportada por el usuario. Las imágenes se guardarán y podrán ser vistas por el resto de usuarios.

Funciones 🚀

Main Page: Podremos ver un ejemplo de una imagen creada por un usuario a modo de ejemplo, y se invitará al usuario a formar parte de la comunidad creando una imagen.

Creador de Imágenes: En esta página se podrá escribir una descripción de la imagen deseada (Prompt) y ésta empezará a ser generada, una vez completada la carga el usuario podrá decidir si quedarse con ella y publicarla.

Descubrir imágenes: Una página para ver otras imágenes creadas por otros usuarios, ya sean las últimas subidas, o las más populares.

Imagen y comentarios: Además de tener un contador de los "me gusta" otorgados por los usuarios, cada imagen también podrá contar con comentarios los cuales se verán desde una página dedicada a cada obra. La finalidad de esta página será también poder ver la imágen en una mayor resolución.

Perfil: En el perfil de un usuario se pueden ver tanto sus obras creadas, así como sus obras favoritas. Un usuario también puede guardar imágenes sin que esta información sea pública, y también aparecerán en el perfil pero solo para el usuario autenticado.

Tecnologías 💻

Frontend ⚛️

La tecnología para hacer la interfaz de usuario será React (javascript), apoyado en Tailwind como framework de css para los estilos.

Backend 📡

El lado del servidor se apoyará en Laravel (PHP)

Otros 🛠️

Base de Datos principal: MySQL

Base de Datos y Host para almacenar imágenes: Firebase

Organización de tareas: Notion

Control de versiones: Git

Base de Datos 💾

Historial de cambios

  • Migracion BBDD
  • Modelos
  • Factorías para llenar BBDD con fake data
  • PAGE: Homepage
  • PAGE: Discover (galeria imagenes de los usuarios)
  • Custom hook para manejar like a fotos
  • Pagination para página de discover (Infinite scroll)
  • PAGE: Creador de imagenes (UPLOAD IMAGE POR AHORA)
  • PAGE: User Dashboard
  • PAGE: Pagina dedicada a una sola imagen (/picture/{picture_id})
  • Comments
  • Diseño y desarrollo de las vistas de autenticacion
  • Modificar paginacion para funcionar con scroll
  • Implementar OPENAI API para crear imagenes
  • Error Handler Create page
  • PAGE: Galeria de cada usuario (/user/{user_id})
  • Añadir apartado de imagenes guardadas a (Dashboard/Galery pages)
  • User profile
  • Admin page

Bibliografía

Documentación de Laravel

Documentación de Inertia

Documentación de React

Documentación de la API de OpenAI

Cliente de OpenAI para PHP

Boceto de Diseño ✏️

Mockup en Figma

Landing Page 🚀

Landing Page Desplegada

Codigo en github

Video explicativo

Click para ver video en youtube