Cuando eres nuevo en la programación, te enfocas en hacer que tu código funcione, no en hacer que se vea bonito. Si presta mucha atención al código de otras personas, como proyectos de código abierto y fragmentos de ejemplo en libros o blogs, notará algunas cosas:  las líneas están sangradas  los espacios y las nuevas líneas se utilizan de manera consistente  las líneas se ajustan si superan algún umbral  Muchos proyectos tienen incluso guías de estilo formales, que explican cómo se deben hacer esas cosas en el proyecto.  ¡Veamos cómo hacer que su código esté a la altura de los estándares de belleza en línea!  ¿No es un poco mezquino?  ¡Gran pregunta! ¿No estamos escribiendo código para máquinas y no les importa la apariencia? Sí, a las máquinas no les importa, pero los humanos también consumen mucho código, y para ellos, esos pequeños detalles pueden marcar una gran diferencia.  La consistencia importa  Si pasa 5 horas al día leyendo código, quiere que la experiencia sea lo más fluida posible. Las elecciones de estilo inesperadas llaman la atención sobre cosas que no importan, molestando al lector sin motivo alguno. Algunos lenguajes de programación, como Python, hicieron de la sangría una parte importante de la sintaxis del lenguaje para imponer una sangría razonable. Un enfoque similar se introdujo en el mundo de JS con CoffeeScript; en un punto, un lenguaje bastante popular compilado en JS.  diferencias significativas  Es tan doloroso revisar ramas que combinan:  cambios de código significativos y  cambios de estilo sin sentido  Solo eche un vistazo a la captura de pantalla de GitHub Pull Requests:   contra   En ambos casos, la parte significativa del cambio es la misma:   . sourceMap: true  Encontrar qué cambió puede ser difícil en una diferencia ruidosa, y mucho menos evaluar su impacto. Imagine revisar tal cambio en un archivo que tiene 1000 líneas en lugar de 10.  Instrumentos  Por suerte, ya no tenemos que estudiar las guías de estilo; tenemos herramientas que las aplican automáticamente a nuestro código base. Muchas de esas herramientas son   : dejan opciones de configuración muy limitadas, por lo que debe aceptar las opiniones de sus autores. obstinadas  Frontend: más bonito  Prettier es un formateador de código orientado a la interfaz. Es compatible con:  código: JS, TS, JSX;  estilos: CSS, Menos, SCSS;  vistas: plantillas HTML, Vue, Ember y Angular, Markdown  archivos de configuración: JSON, YAML  Y algunos más con complementos.  Prettier se compromete a poner fin a los debates sobre la guía de estilo. Por lo tanto, las opciones de configuración son limitadas: hay algunas cosas que puede modificar, pero al usar Prettier, en su mayoría subcontrata las decisiones de la guía de estilo a su autor. Prettier está muy extendido en la comunidad de JS: lo utilizan los equipos centrales de React, Vue y Angular. Diseñar su proyecto con él hará que su código se vea como el de todos los demás, lo cual es bueno, ya que mantiene la coherencia en muchos proyectos en los que trabaja la gente.  pitón: negro  Algo similar para el código de Python. Lo usé algunas veces mientras ayudaba con un proyecto de Python. Me complació tener una herramienta que mantiene el formato por mí; no tenía interés en aprender mucho sobre Python, pero me preocupo lo suficiente por la consistencia para asegurarme de que mis cambios estén en línea con la guía de estilo de código que usa el proyecto. Gracias a Black, mantuve mi código ordenado, sin pensar dos veces en cuáles son las convenciones en la comunidad de Python.  Otros idiomas  No conozco herramientas similares en otros idiomas, pero seguiría esas pautas si estuviera buscando alguna herramienta:  Independientemente del editor de texto, generalmente un entorno de desarrollo integrado (IDE) puede diseñar su código, pero no muchos desarrolladores aceptarían cambiar su favorito para usar la misma herramienta de diseño. Sin que todos usen la misma herramienta, habrá ruido de estilo en los cambios de código, algo que queremos evitar.  Interfaz de línea de comandos (CLI), para que pueda integrarla fácilmente con:  su editor de texto preferido,  git commit ganchos, o  integración continua (CI)  Opinión: hay muchas cosas mejores que hacer que debatir el estilo del código. La mayoría de los desarrolladores son lo suficientemente perezosos como para renunciar a su preferencia de estilo a cambio de un estilo automatizado.  ¿Cómo diseñas tu código?  ¿Qué herramientas utiliza para dar formato a su código, en JavaScript u otros lenguajes?  También publicado   . aquí

2022 - HackerNoon Contributor of the Year - Beginners Guide

2022 - HackerNoon Contributor of the Year - Code Quality

2022 - HackerNoon Contributor of the Year - Learning

2022 - the Greatest Storyteller

Newsletter

Senior JS developer

Este audio es producido en el idioma original de la historia!

Hacer que su código se vea bonito

About Author

COMENTARIOS

ETIQUETAS

ESTE ARTÍCULO FUE PRESENTADO EN

Related Stories

Crecimiento de las criptomonedas: creación de perfiles de usuarios eficaces

Creación de productos criptográficos centrados en el usuario: la importancia de los comentarios de los clientes

Navegando por las aguas: desarrollo de aplicaciones RAG de nivel de producción con lagos de datos

¿Quieres ganar un concurso de redacción de HackerNoon? Esto es lo que recomiendan los ganadores del concurso #crypto-api

Crecimiento de las criptomonedas: creación de perfiles de usuarios eficaces

Creación de productos criptográficos centrados en el usuario: la importancia de los comentarios de los clientes

Navegando por las aguas: desarrollo de aplicaciones RAG de nivel de producción con lagos de datos

¿Quieres ganar un concurso de redacción de HackerNoon? Esto es lo que recomiendan los ganadores del concurso #crypto-api

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps