Encriptador de texto - Alura-Oracle Next Education - Challenge 1 - Grupo 4

ESPAÑOL

Descripción

Este proyecto forma parte del programa ONE (Oracle Next Education) y consiste en un sitio web que sirve para encriptar y desencriptar texto. La consigna era crear un sitio web en base a un modelo que nos dieron en cuál el ususario ingresara un texto y pudiera enriptarlo o desencriptarlo ,obteniéndo así un nuevo texto.

Consignas

• Para realizar la encriptación se reemplazan las vocales del texto ingresado:

  • La vocal 'a' era reemplazada por la palabra "ai".
  • La vocal 'e' se reemplaza por la palabra "enter".
  • La vocal 'i' se reemplaza por la palabra "imes".
  • La vocal 'o' se reemplaza por la palabra "ober".
  • La vocal 'u' se reemplaza por la palabra "ufat".

• El texto solo debe contener letras minúsculas y sin tildes.

• Debe ser posible convertir una palabra para la versión encriptada también devolver una palabra encriptada para su versión original. Por ejemplo:

  • "gato" => "gaitober"
  • gaitober" => "gato"

• La página debe tener campos para inserción del texto que será encriptado o desencriptado, y el usuario debe poder escoger entre as dos opciones.

• El resultado debe ser mostrado en la pantalla.

• El diseño de la página web debe ser responsive para los tamaños de pantalla "Tablet" y "Celular" mostrados en el modelo de Figma.

Extra

• Un botón que copie el texto encriptado/desencriptado para la sección de transferencia, o sea que tenga la misma funcionalidad del ctrl+C o de la opción "copiar" del menú de las aplicaciones.

Además del botón de copiar, agregué una alerta , que le avise al usuario cuando ingrese un texto no válido para encriptar/desencriptar. También coloque un divque avisa al usuario cuando su texto fue copiado.

Imágenes del Proyecto.

Esta es la vista previa del proyecto para los distintos dispositivos solicitados:

Escritorio sin texto:

Escritorio con texto:

Tablet sin texto:

Tablet con texto:

Celular sin texto:

Celular con texto:

Desencriptando y copiando texto:

Aviso de texto no válido:

English

Description

This project is part of the ONE (Oracle Next Education) program and consists of a website that serves to encrypt and decrypt text. The goal was to create a website based on a model that we were given in which the user could enter a text and could encrypt or decrypt it, thus obtaining a new text.

Directives:

• To perform the encryption, the vowels in the entered text are replaced:

  • The vowel 'a' was replaced by the word "ai ".
  • The vowel 'e' is replaced by the word "enter ".
  • The vowel 'i' is replaced by the word "imes ".
  • The vowel 'o' is replaced by the word "ober ".
  • The vowel 'u' is replaced by the word "ufat ".

• The text must contain only lowercase letters and no accents.

• It must be possible to convert a word for the encrypted version also return an encrypted word for its original version. For example:

  • "orange" => "oberraingenter".
  • oberraingenter" => "orange".

• The page must have fields for inserting the text to be encrypted or decrypted, and the user must be able to choose between the two options.

• The result should be displayed on the screen.

• The design of the web page must be responsive for the "Tablet" and "Mobile" screen sizes shown in the Figma model.

Extra credit

• A button to copy the encrypted/decrypted text for the transfer section, in other words with the same functionality as ctrl+C or the copy option in the applications menu.

In addition to the copy button, I added an alert , which warns the user when entering an invalid text to encrypt/decrypt. I also placed a div that alerts the user when their text was copied.

Project Images.

This is the preview of the project for the different devices requested: ### Desktop without text:

Desktop with text:

Tablet without text:

Tablet with text:

SmartPhone without text:

SmartPhone with text:

Decrypting and copying text:

Invalid text warning: