Monday, April 6, 2020

Import line spacing - Angular / React

Una de las buenas prácticas que considero que hacen lucir un código limpio es el *import line spacing* o una línea de separación entre los tipos de imports que hacés al inicio de tu código.

Podemos dividir los imports en al menos dos categorías: third party imports y application imports (o sea, las libraries de terceros y los imports de nuestra propia aplicación)

De igual forma, mantener un orden alfabético por módulo así como también los destructured imported.

Pero, ¿por qué? Así separamos visualmente lo que tiene que ver con ellos (third-party) con lo nuestro.

Y el orden alfabético nos ayuda a tener una mejor legibilidad y localizar fácilmente los símbolos.

Por otra parte, también nos puede servir de una métrica para saber si estamos haciendo mucho código en un archivo. O sea, por ejemplo, si ves que tenés más de 5 imports en el primer grupo o en el segundo grupo, podés usarlo de parámetros para reconsiderar y tratar de refactorizar tu código.

This is an example of a angular file: 

Esto es lo que debes evitar:


Aquí estamos siguiendo la buena práctica:


Source 1https://v2.angular.io/docs/ts/latest/guide/style-guide.html#!#03-06 
Source 2: https://dev.to/jorgealvarez/react-imports-the-rule-of-5-ji3

Tuesday, February 18, 2020

ESLint + Mocha

Hi, you are working with Mocha and ESLint is telling you there is a problem and the problem looks like this:




  'describe' is not defined.eslint(no-undef)

 It easy to solve it. Go .eslintrc.json and add the following line ("mocha": true):

"env": {
    "browser"true,
    "es6"true,
    "node"true,
    "mocha"true
  },

Happy testing!

Wednesday, January 29, 2020

How to open VS Code user settings as JSON

When I was reading about Prettier and ESLint and how to set up in VS Code I realized I can open VS Code User's settings/preferences as both: UI and JSON. I really didn't know how to do it. I mean, I used to use as UI only. Today, if you are like me, I will teach you how to open as JSON and put your configuration required.

Open you VS Code
If you are using Windows...
Press CTRL + Shift + P
Search for "Settings"
Click con Workbench>Settings Editor
Choose json option in dropdownlist

Then, check "Controls whether to use the split JSON editor when editing settings a JSON"





And voilà!

Happy formatting :)

Thursday, October 17, 2019

Cómo insertar un ObjectId customizado en MongoDB

Como sabrás, cuando haces un insert, mongo genera el _id automáticamente, este _id viene a ser la "primary key" de tu documento. Sin embargo, si querés agregar un ObjectId personalizado, tenés que tener cuidado de seguir el length o tamaño requerido de un ObjectId que es de 24. Aquí te dejo un ejemplo.

Happy coding!

Friday, May 17, 2019

¿Qué es Git LFS y cómo implementarlo?

LFS significa Large File Storage o en español Almacenamiento de archivos grandes.

Pero, ¿qué es lo que hace realmente?

Resulta que cuando versionamos código, éstos suelen ser planos, simples archivos que si lo pesamos, no representan un peso significativo. Y cuando hacemos push al servidor remoto, git crea una copia con los cambios y hasta ahí todo perfecto. Pero ¿qué tal si queremos versionar archivos cuyo peso puede significar un problema para nuestro repositorio? Se imaginan versionar un .dll por ejemplo.

Aquí es donde entra "git lfs". Veamos la siguiente imagen:



Cuando usamos git lfs, los archivos grandes no se suben al respositorio remoto sino unicamente se crea un acceso directo cuyo peso comparado con el archivo real será de bastante consideración.

Cómo implementar git lfs

1. Descarga e Instala https://git-lfs.github.com/

2. Crea e incializa tu repositorio

3. Ejecuta git lfs install

4. Selecciona los typos de archivos que quisieras que Git LFS administre:

git lfs track "*.psd, *.dll" 

5. Un archivo de congifuración llamado .gitattributes será modificado donde estarán todos los tipos de archivos o extensiones que hayas configurado en el paso 4. Y como tal, deberás versionarlo

git add .gitattributes

Y eso es todo!

Happy coding! :)