text-analyzer

Analizador de texto

Índice

1. Consideraciones generales

2. Preámbulo

Una lupa sobre texto de libro

Credito: Foto de ethan en Unsplash

Un analizador de texto es una aplicación para extraer información útil de un texto utilizando diversas técnicas, como el procesamiento del lenguaje natural (NLP), el aprendizaje automático (ML) y el análisis estadístico. Estas aplicaciones pueden proporcionar una variedad de métricas que brindan información básica sobre la longitud y la estructura del texto como por ejemplo, el conteo de palabras, el conteo de caracteres, el conteo de oraciones y el conteo de párrafos. Otras métricas incluyen el análisis de sentimientos, que utiliza técnicas de NLP para determinar el tono general positivo, negativo o neutral del texto, y el análisis de legibilidad, que utiliza algoritmos para evaluar la complejidad y la legibilidad del texto.

En general, las aplicaciones de análisis de texto brindan información valiosa y métricas sobre los textos que pueden ayudar a los usuarios a tomar decisiones informadas y sacar conclusiones significativas. Mediante el uso de estas herramientas de análisis, los usuarios pueden obtener una comprensión más profunda de los textos.

3. Funcionalidades

En este proyecto implementarás un analizador de texto web para calcular y mostrar métricas de un texto enviado por el usuario.

El listado de funcionalidades es el siguiente:

  1. La aplicación debe permitir al usuario ingresar un texto escribiéndolo en un cuadro de texto.

  2. La aplicación debe calcular las siguientes métricas y actualizar el resultado en tiempo real a medida que el usuario escribe su texto:

    • Recuento de palabras: la aplicación debe poder contar el número de palabras en el texto de entrada y mostrar este recuento al usuario
    • Recuento de caracteres: la aplicación debe poder contar el número de caracteres en el texto de entrada, incluidos espacios y signos de puntuación, y mostrar este recuento al usuario.
    • Recuento de caracteres excluyendo espacios y signos de puntuación: la aplicación debe poder contar el número de caracteres en el texto de entrada, excluyendo espacios y signos de puntuación, y mostrar este recuento al usuario.
    • Recuento de números: la aplicación debe contar cúantos números hay en el texto de entrada y mostrar este recuento al usuario.
    • Suma total de números: la aplicación debe sumar todos los números que hay en el texto de entrada y mostrar el resultado al usuario.
    • Longitud media de las palabras: la aplicación debe calcular la longitud media de las palabras en el texto de entrada y mostrársela al usuario.

  3. La aplicación debe permitir limpiar el contenido de la caja de texto haciendo clic en un botón.

Text analyzer demo

4. Boilerplate

La lógica del proyecto debe estar implementada completamente en JavaScript. En este proyecto NO está permitido usar librerías o frameworks, solo JavaScript puro también conocido como Vanilla JavaScript.

Para comenzar este proyecto tendrás que hacer un fork y clonar este repositorio que contiene un boilerplate con tests (pruebas). Un boilerplate es la estructura básica de un proyecto que sirve como un punto de partida con archivos y configuración inicial de dependencias y tests.

El boilerplate que les damos contiene esta estructura:

./
├── .babelrc
├── .editorconfig
├── .eslintrc
├── .gitignore
├── README.md
├── package.json
├── src
│   ├── analyzer.js
│   ├── index.html
│   ├── index.js
│   └── style.css
└── test
    ├── .eslintrc
    └── analyzer.spec.js

Descripción de scripts / archivos

Deploy

Hacer que los sitios estén publicados (o desplegados) para que usuarias de la web puedan acceder a él es algo común en proyectos de desarrollo de software.

En este proyecto, utilizaremos Github Pages para desplegar nuestro sitio web.

El comando npm run deploy puede ayudarte con esta tarea y también puedes consultar su documentación oficial.

5. Criterios de aceptación mínimos del proyecto

A continuación encontrarás los criterios de aceptación mínimos del proyecto relacionados con cada objetivo de aprendizaje.

HTML

CSS

Web APIs

JavaScript

Control de Versiones (Git y GitHub)

Centrado en el usuario

Diseño de producto

6. Pruebas

Este proyecto cuenta con 3 conjuntos de pruebas que te ayudarán a conocer si cumples los criterios mínimos de aceptación.

Pruebas unitarias

Una prueba unitaria es una técnica de prueba de software en la que se comprueba que cada componente individual de un programa o sistema funciona correctamente de manera aislada. En otras palabras, se prueba cada unidad de código por separado para asegurarse de que cumpla con los requisitos y especificaciones.

Las pruebas unitarias de este proyecto ejecutarán los métodos getWordCount, getCharacterCount, getCharacterCountExcludingSpaces, getNumbersCount, getNumbersSum y getAverageWordLength con diferentes argumentos y se confirmará que los valores retornados sean los esperados.

Puedes ejecutar estas pruebas con el comando npm run test como se muestra en la siguiente imagen:

npm run test

El boilerplate incluye tareas que ejecutan eslint y htmlhint para verificar el HTML y JavaScript con respecto a una guías de estilos. Ambas tareas se ejecutan automáticamente antes de ejecutar las pruebas unitarias cuando usamos el comando npm run test. En el caso de JavaScript estamos usando un archivo de configuración de eslint que se llama .eslintrc que contiene un mínimo de información sobre el parser que usar (qué version de JavaScript/ECMAScript), el entorno (browser en este caso) y las reglas recomendadas (eslint:recommended). En cuanto a reglas/guías de estilo en sí, usaremos las recomendaciones por defecto de tanto eslint como htmlhint.

Pruebas de criterios mínimos de aceptación

Estas pruebas analizarán tus archivos index.html, index.js, analyzer.js y style.css para verificar que cumples con los criterios minimos de aceptacion. Cada criterio esta relacionado con un objetivo de aprendizaje.

Puedes ejecutar todas estas pruebas con el comando npm run test:oas como se muestra en la siguiente imagen:

npm run test oas

Puedes ejecutar las pruebas de cada grupo de objetivos de aprendizaje de manera individual con los siguientes comandos:

Pruebas end-to-end

Una prueba end-to-end (E2E) es una técnica de prueba de software en la que se verifica el funcionamiento de todo el sistema desde el inicio hasta el final. En otras palabras, se prueba el flujo completo del software, simulando la interacción del usuario con la aplicación, para asegurarse de que todas las partes del sistema funcionan correctamente en conjunto.

Puedes ejecutar estas pruebas con el comando npm run test:e2e como se muestra en la siguiente imagen:

npm run test e2e

Github actions

Este repositorio usa una GitHub Action para ejecutar automáticamente las pruebas unitarias, pruebas de criterios mínimos de aceptación y y pruebas end-to-end cada vez que se hagas un push en la rama main de tu repositorio.

Puedes consultar el resultado de esta Github Action en la pestaña Actions de tu repositorio en Github como se muestra en la siguiente imagen:

Github Action

7. Pistas, tips y lecturas complementarias

Prepara tu PC para trabajar

Antes de comenzar instala lo siguiente:

  1. Node.js
  2. git Si estas en Linux es muy probable que ya este instalado 👀. Para conocer más de git visita este enlace
  3. Un editor de código, te sugerimos Code

Después en GitHub:

  1. Crear una cuenta. Conoce más de GitHub en este link
  2. Realiza un fork de este proyecto
  3. Configura tu SSH Key en GitHub. Puedes revisar este video o artículo

Luego en una shell ejecuta lo siguiente. Si estas en Windows puedes usar Git Bash:

  1. Clona el fork en tu PC
  2. Ubica la shell en el proyecto que clonaste
  3. Instala las dependencias del proyecto con npm install
  4. Instala playwright con npx playwright install chromium --with-deps
  5. Para arrancar el servidor web npm start y dirígete a http://localhost:3000 en tu navegador.
  6. A codear se ha dicho! :rocket:

Recursos y temas relacionados

Súmate al canal de Slack #project-text-analyzer

8. Consideraciones para pedir tu Project Feedback

Antes de agendar tu Project Feedback con un coach, asegúrate que tu proyecto:

Además recuerda que debes hacer: llenado de sprint check out de cierre de proyecto, una autoevaluación de objetivos de aprendizaje y autoevaluación de life skills desde tu dashboard de estudiante. Acá el link del flujo para que puedas ver el proceso.

Si no has completado todo lo anterior, no consideramos que estás lista para tu sesión de Project Feedback. (acá te dejamos el link de esta instancia).

9. Objetivos de aprendizaje

Reflexiona y luego marca los objetivos que has llegado a entender y aplicar en tu proyecto. Piensa en eso al decidir tu estrategia de trabajo.

HTML

</p></details>

CSS

</p></details>

</p></details>

Web APIs

</p></details>

</p></details>

</p></details>

JavaScript

</p></details>

</p></details>

</p></details>

</p></details>

</p></details>

</p></details>

</p></details>

</p></details>

Control de Versiones (Git y GitHub)

</p></details>

Centrado en el usuario

Diseño de producto

10. Funcionalidades opcionales

Si terminaste con todas las funcionalidades requeridas, intenta implementar las siguientes funcionalidades opcionales para profundizar en los objetivos de aprendizaje del proyecto:

Puedes habilitar las pruebas unitarias y en end to end de estos casos en los archivos test/analyzer.spec.js y read-only/test/e2e/app.spec.js.