An open API service indexing awesome lists of open source software.

https://github.com/miguelsjimenezv/registerformproject

El RegisterForm Project es una página web diseñada para ofrecer un formulario de registro interactivo, con varias validaciones en tiempo real, efectos visuales y una interfaz moderna. El proyecto utiliza tecnologías web actuales como HTML5, CSS3, Bootstrap, JavaScript y JQuery para proporcionar una experiencia de usuario fluida y atractiva.
https://github.com/miguelsjimenezv/registerformproject

bootstrap css3 frontend html5 javascript modern-ui open-source register register-form responsive-design web-design

Last synced: 3 months ago
JSON representation

El RegisterForm Project es una página web diseñada para ofrecer un formulario de registro interactivo, con varias validaciones en tiempo real, efectos visuales y una interfaz moderna. El proyecto utiliza tecnologías web actuales como HTML5, CSS3, Bootstrap, JavaScript y JQuery para proporcionar una experiencia de usuario fluida y atractiva.

Awesome Lists containing this project

README

          

# RegisterForm Project

## Descripción

El **RegisterForm Project** es una página web diseñada para ofrecer un formulario de registro interactivo, con varias validaciones en tiempo real, efectos visuales y una interfaz moderna. El proyecto utiliza tecnologías web actuales como **HTML5**, **CSS3**, **Bootstrap**, **JavaScript** y **JQuery** para proporcionar una experiencia de usuario fluida y atractiva.

Este formulario de contacto es ideal para ser integrado en proyectos donde se requiera una forma eficiente de capturar datos de los usuarios, como registros, suscripciones o cualquier otro tipo de interacción.

### Características:

- **Formulario de contacto completo**: Incluye los campos esenciales como correo electrónico, contraseña, nombre, apellido, DNI, fecha de nacimiento y sexo.
- **Validaciones en tiempo real**: Asegura que los usuarios ingresen la información correctamente antes de enviar el formulario, minimizando errores y mejorando la calidad de los datos.
- **Interactividad y efectos visuales**: El fondo de la página es dinámico, gracias a **Particles.js**, y las interacciones de usuario se mejoran con alertas visuales mediante **SweetAlert2**.
- **Interfaz responsive**: La página se adapta perfectamente a cualquier tamaño de pantalla, ofreciendo una experiencia consistente en dispositivos móviles, tabletas y escritorios.

## Tecnologías utilizadas

- **HTML5**: Se utiliza para estructurar el contenido de la página y los elementos del formulario.
- **CSS3**: Estilos visuales que aseguran una presentación moderna y adaptativa.
- **Bootstrap**: Framework que facilita la creación de una interfaz responsive y profesional, optimizando el diseño en diferentes dispositivos.
- **JavaScript**: Para las validaciones y funciones interactivas del formulario, mejorando la experiencia del usuario.
- **JQuery**: Simplifica la manipulación del DOM y la gestión de eventos en el formulario.
- **FontAwesome**: Librería de iconos que mejora la estética y funcionalidad del formulario y la página en general.
- **Particles.js**: Efectos visuales en el fondo con partículas animadas, agregando dinamismo a la página.
- **SweetAlert2**: Notificaciones emergentes para proporcionar mensajes visuales claros y atractivos, como confirmaciones o alertas de error.

## Instalación

### Paso 1: Clonar el repositorio

Si deseas trabajar localmente con este proyecto, primero clona el repositorio usando Git:

```bash
git clone https://github.com/MiguelSJimenezV/ContactFormProject.git
```

### Paso 2: Acceder al directorio del proyecto

Una vez que el repositorio se haya clonado en tu máquina local, ingresa al directorio del proyecto:

```bash
cd ContactForm-Project
```

### Paso 3: Abre el archivo en tu navegador

Para ver el formulario de contacto en acción, simplemente abre el archivo index.html en tu navegador web favorito.

```bash

# En la terminal puedes usar un servidor local, como Live Server en VSCode, o abrir el archivo directamente:
open index.html
```

### Estructura de Archivos

La estructura de archivos del proyecto es la siguiente:

```bash

ContactForm-Project/

├── index.html
├── assets/
│ ├── css/
│ │ └── form.css
│ ├── js/
│ │ ├── fondo.js
│ │ ├── formValid.js
│ │ └── jquery.min.js
├── README.md
└── LICENSE
```

## Contribución

Si deseas contribuir al proyecto:

1. Realiza un fork del repositorio.
2. Crea una rama nueva para tu funcionalidad o corrección de errores:
```bash
git checkout -b mi-nueva-funcionalidad
```
3. Realiza tus cambios y haz commit de ellos:
```bash
git commit -m "Agrega nueva funcionalidad"
```
4. Envía tus cambios mediante un pull request.

## Autor

**Miguel Jimenez**\
DWN2AP | Turno Noche | Año 2023