#Encriptador de Textos
Este es un encriptador de textos simple construido con HTML, CSS y JavaScript. Permite al usuario encriptar y desencriptar textos utilizando botones y mostrar el resultado en un campo de texto separado.
Encripta y desencripta textos utilizando algoritmos simples. Muestra el texto encriptado o desencriptado en un campo de texto separado. Permite copiar el texto resultante al portapapeles. Utiliza SweetAlert2 para mostrar mensajes emergentes. Utiliza Ionicons para mostrar iconos. Utiliza una hoja de estilos personalizada para el diseño.
#Construcción Este proyecto se construyó utilizando las siguientes tecnologías:
#HTML5 #CSS3 #JavaScript #SweetAlert2 #Ionicons Se utilizó una estructura de archivos simple con los siguientes archivos:
index.html: El archivo HTML principal que contiene la estructura y el contenido de la página. styles.css: La hoja de estilos personalizada que define el diseño y la apariencia de la página. script.js: El archivo JavaScript que contiene la lógica y la funcionalidad de la página. folder_locked_fill.svg: El icono de candado utilizado en el encabezado. Logo.png: El logotipo utilizado en el encabezado. Muneco.png: El icono utilizado en el campo de texto vacío. Se utilizaron las siguientes herramientas y servicios en línea:
Devicon para los iconos de habilidades. CDNJS para los archivos CSS y JavaScript externos. GitHub para alojar el repositorio del proyecto
#Uso Para usar el encriptador de textos, simplemente ingrese el texto que desee encriptar o desencriptar en el campo de texto de entrada y haga clic en el botón correspondiente. El texto resultante se mostrará en el campo de texto de salida.
El texto resultante se puede copiar al portapapeles haciendo clic en el botón "Copiar mensaje".
Desarrollo Para desarrollar este proyecto, se siguieron los siguientes pasos:
Se creó la estructura básica del archivo HTML utilizando etiquetas semánticas y se definieron las secciones principales de la página: encabezado, caja de entrada, caja de salida y pie de página. Se agregaron los campos de texto y los botones utilizando etiquetas <textarea> y , respectivamente. Se agregaron los iconos utilizando la librería Ionicons y se definieron las clases CSS correspondientes. Se creó la hoja de estilos personalizada utilizando CSS y se definieron las reglas y propiedades necesarias para el diseño y la apariencia de la página. Se creó el archivo JavaScript utilizando JavaScript vanilla y se definieron las funciones y la lógica necesarias para la encriptación y desencriptación de textos. Se probaron y depuraron las funcionalidades utilizando el navegador web y las herramientas de desarrollador. Se agregaron los archivos CSS y JavaScript externos utilizando CDNJS. Se agregaron los iconos de habilidades utilizando Devicon y se definieron las clases CSS correspondientes.9. Se creó el archivo README utilizando Markdown y se definió la descripción, las características, la construcción, el uso y el desarrollo del proyecto.
Conclusiones Este proyecto fue una oportunidad para practicar y aplicar los conocimientos adquiridos en HTML, CSS y JavaScript. Aprendí a utilizar herramientas y servicios en línea como Devicon, CDNJS y GitHub para mejorar la funcionalidad y la apariencia de la página. También aprendí a probar y depurar las funcionalidades utilizando las herramientas de desarrollador del navegador web.
En general, estoy satisfecho con el resultado final y espero seguir mejorando mis habilidades en el desarrollo web.