4

Configuración de Entorno

Nathaly Stefani
Nasterb
32793

Tener una configuración de entorno adecuada y establecida permitirá la fluidez que un desarrollador o equipo de desarrollo de software requiere para llevar a cabo la implementación de un producto, aplicación, funcionalidad o corrección.

<h1>IDE</h1>

Como paso inicial, se debe instalar un editor de texto o IDE tal como Visual Studio Code, WebStorm, Sublime Text, Atom, etc, y se codifica teniendo en cuenta los siguientes estándares de codificación definidos por el equipo de desarrollo:

  • Indentación a dos (2) espacios.
  • Print Width (Ancho de impresión): 100 caracteres.
  • Tab Width (Ancho de tabulación): 2 espacios.
  • Tabs (Tabulación): false.
  • Single Quote (Comillas Sencillas): true.
  • Semi (Punto y Coma): true.
  • Bracket Spacing (Espaciado Corchetes): true.
<h1>PRETTIER</h1>

Con el fin de cumplir a cabalidad con los estándares planteados en el anterior ítem y a lo largo del presente documento, se recomienda utilizar Prettier, el cual es una herramienta de formateo de código.

Archivo de configuración de Prettier .prettierrc (ubicado en la raíz del proyecto):

{
  "printWidth": 100,
  "singleQuote": true,
  "useTabs": false,
  "tabWidth": 2,
  "semi": true,
  "bracketSpacing": true,
  "proseWrap": "preserve"
}
<h1>TSLINT</h1>

Adicionalmente, TSLint es un linter que permite llevar a cabo la escritura de código con buenas prácticas y en proyectos que sean desarrollados bajo TypeScript en tiempo real.

Para Angular, al generar un proyecto se crea automáticamente el archivo tslint.json con las reglas ceñidas a la guía de estilos planteada por Angular.

<h1>EXTENSIONES PARA VSCODE</h1>

Finalmente, las extensiones que podemos instalar y utilizar en Visual Studio Code:

  • Prettier - Code Formatter
  • TSLint
  • Auto Import
  • Bracket Pair Colorizer
  • SCSS Formatter
  • Angular 8 Snippets
  • Angular Language Service

La configuración aquí propuesta es la que uso a diario en los proyectos en los que participo. En los comentarios puedes mencionar configuraciones adicionales que utilizas en tus proyectos! 👍

Escribe tu comentario
+ 2
0
30795Puntos

Yo suelo utilizar esto pero no dentro del proyecto con un .prrittierrc, sino que esta configurado en el visual studio y se me aplica a todos los proyectos. ¿Cual seria la principal diferencia entre hacer esto a tu manera o a la mia?

0
4241Puntos
un año

Al tener esta configuración alojada en el proyecto el archivo .prettierrc hace que todo tu equipo de desarrollo tengan la misma configuración por lo tanto no tendrán complicaciones o constantes cambios en git debido solamente a cambios por formato.

Si no te encuentras en un equipo de desarrollo tener la configuración respaldada en el VSCODE está mas que bien.