Proyecto:Formulario Web de Multi-Páginas

Introducción:

Esta aplicación sirve como un proyecto de ejercicio con el propósito de construir un formulario de varias páginas con autenticación en Firebase, almacenamiento y la integración de una base de datos como infraestructura backend. Básicamente, simula el proceso de solicitud para una oferta de trabajo.

Tipo

  • Web App
  • Diseño responsive

Herramientas:

  • CSS & HTML
  • Javascript ES6
  • React
  • Firebase
  • Git & GitHub
  • Netlifly

En vivo:

Propósito del proyecto

El proyecto formulario de Ofertas de trabajo ficticios para Meteorólogos tiene como objetivo simular un flujo de trabajo realista para la creación de ofertas de trabajo dirigidas a meteorólogos. Esta aplicación se construyó utilizando Vite y React, junto con Firebase Authentication, Realtime Database y Storage, para brindar una experiencia completa y segura.

El formulario se divide en pasos para una entrada de datos estructurada y una mejor experiencia de usuario.Emplea Firebase Authentication para permitir el acceso solo a usuarios autenticados, lo que brinda seguridad y privacidad.

Los datos del formulario se almacenan en Firebase Realtime Database en tiempo real, facilitando el acceso y la gestión de la información.

Permite a los usuarios cargar archivos relevantes junto con la oferta de trabajo, como detalles adicionales o formularios de solicitud. Utiliza componentes reutilizables de React para mantener un código limpio y organizado.

Mi papel en el proyecto

En el proyecto hemos trabajadores dos colobadores.

Este proyecto me proporcionó una valiosa experiencia en el desarrollo frontend utilizando tecnologías modernas como Vite y React. Además, aprendí a integrar Firebase para autenticación y almacenamiento de datos, lo que mejora la interacción en tiempo real y la seguridad del usuario.

La creación de formularios con pasos progresivos también mejoró mi comprensión de la arquitectura de la interfaz de usuario.Participé activamente en este proyecto como aprendiz y asistente de desarrollo.

Mi contribución incluyó la implementación de componentes de React, la configuración de Firebase, la realización de pruebas y la solución de desafíos técnicos bajo la guía del desarrollador principal.

Imágenes del formulario de múltiples pasos

Web stack y su explicación

Vite: Entorno de desarrollo rápido para aplicaciones web.

React: Biblioteca de JavaScript para construir interfaces de usuario.

Firebase Authentication: Ofrece autenticación segura y gestión de usuarios.

Firebase Realtime Database: Almacena datos en tiempo real para el formulario.

Firebase Storage: Permite la carga y descarga de archivos relacionados con ofertas.

React-feather: Una librería que proporciona una colección de iconos SVG. Esta librería se utiliza para mejorar la estética de la aplicación y facilitar la inclusión de iconos en diferentes partes de la interfaz de usuario.

Git y GitHub: Uso continuo de git con varias ramas main/desarrollo y con pull request via GitHub.

Netlify: Conexión y deploy vía GitHub.

Imágenes del formulario de múltiples pasos