This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Resumen | |
- React: (2/5 stars) | |
- Usa custom hooks para separar logica como useCountries | |
- Conoce existencia de hooks de optimización como useCallback y useMemo pero los aplica necesariamente bien, pero es un buen comienzo. | |
- Condiciona componentes y props que a veces pueden dificultar la lectura del código. | |
- Agrega complejidad innecesaria al código (podría ser que quiera impresionar y en realidad en la vida real no lo hace, pero de no ser así, es una mala practica) | |
- La aplicación genera re-renders innecesarios pero no estamos calificando el tema de performance exactamente, a pesar de que el candidato intenta usar hooks qué mejoran el performance, no esta logrando mejorar el performance de la app al final. | |
- Usa incorrectamente react router para ir al Home del app, podría utilizar un Link pero usa un div, semánticamente incorrecto | |
- En materia de react router no hay mucho que calificar, usa lo necesario para el project | |
- Podia aprovechar para optimizar el Search input para evita |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React, { useEffect, useState } from 'react'; | |
import { Loader } from '@crehana/ui'; | |
import { useStickyState } from '@crehana/react-hooks'; | |
import Loadable from 'Jsx/Shared/Loadable'; | |
const LANDING_USER_ARRIVALS_REQUIRED_TO_TRIGGER = 2; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<React.Fragment> | |
<p className="my-8 font-subtitle4">Tipo de documento</p> | |
<div className="flex flex-row items-start"> | |
<Controller | |
render={({ onChange, value, ref }) => ( | |
<> | |
<Radio | |
htmlProps={{ | |
htmlFor: 'NIT', |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const convertObj = (x, y, z) => { | |
const k = Object.keys(x); | |
return k.map((key) => { | |
return { | |
[y]: key, | |
[z]: x[key], | |
} | |
}); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// BAD | |
const newFruits = fruits.map( x => { | |
return doSomething(x); | |
}) | |
// GOOD | |
const newFruits = fruits.map( fruit => { | |
return doSomething(fruit); | |
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// BAD | |
userData(userId) | |
userDataFunc(userId) | |
totalOfItems(items) | |
// GOOD - Solo agregando el verbo ya nos damos cuenta que es mas legible | |
getUser(userId); | |
calculateTotal(items); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//BAD | |
const pugs = 3; | |
/* GOOD - usando un prefijo como hacemos mas claro que es un | |
valor numerico */ | |
const minFruits = 1; | |
const maxFruits = 5; | |
const totalFruits = 10; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Haciendo unos ajustes tendriamos esto: */ | |
const checkHasFruit = (user, fruitName) => user.fruits.includes(fruitName); | |
const hasFruit = checkhasFruit(user, 'apple'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const user = { | |
fruits: ['apple'] | |
} | |
const hasFruit = (user, fruitName) => user.fruits.includes(fruitName); | |
/*Si la funcion ya se llama "hasFruit" que nombre le pondriamos a "x"? */ | |
const x = hasFruit(user, 'apple'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* BAD - "open" podría ser una variable de estado o function, no lo | |
sabemos */ | |
const open = true; | |
const write = true; | |
const fruit = true; | |
/*GOOD - Ahora te preguntas, "esta abierto?", SI o NO?. Es inferible | |
y evidente que es una variable booleana | |
*/ | |
const isOpen = true; |
NewerOlder