Notas
No sé qué me pasa pero últimamente he cogido la manía de poner la negación fuera del paréntesis en plan:
if !(condicion)
Obviamente esto no se ejecuta bien.
Será que me parece así más lógico o algo.
¿Os acordáis de la época en la que no hacía falta aceptar o rechazar lo de las cookies en todas las webs?
¿Os acordáis de cuando las webs eran simplemente contenido HTML y no tenías que esperar a que cargara o que los elementos se volvieran interactivos por culpa del SSR?
Me parece increíble que los de @figmadesign hayan implementado una cosa que se llama auto layout que básicamente funciona como display:flex y que sólo tenga la opción de space-between, falta center, flex-end, space around y space evenly.
Lo de a quien madruga Dios le ayuda es mentira, todas las mañanas me como un atasco brutal.
🎉 ¡Ya somos más de 500 alquimistas! Muchas gracias a todos los que leéis los correos de #Alquimias.
Te dejo el link de la newsletter por si te quieres unir y recibir todas las semanas recursos, artículos y librerías sobre desarrollo web y programación.
https://codingpotions.com/alquimias
Y no, no comparto absolutamente nada de autospam, todo es contenido que a mi mismo me parece interesante.
Odio esas newsletters en las que pone: "apúntate para estar al tanto de las novedades del desarrollo web" y luego resulta que todo es autopublicidad de cosas suyas.
¿Por qué es tan complicado de hacer un simple tooltip?
En cuanto necestias meter HTML dentro del tooltip tienes que andar creandolo con position:fixed porque con absolute lo recorta el overflow.
Y encima con fixed es afectado por transforms y otros fixed por encima del tolltip.
Deberían sacar una forma de poder dar estilos a los tooltips por defecto del navegador y que puedas meter algo más que texto simple.
Como de forma nativa no da pa más cada uno se tiene que implementar el suyo y encima hay que encargarse de la accesibilidad y el responsive.
Sigo desde hace tiempo a @talkingbit1 porque me gusta mucho el contenido y reflexiones sobre clean conde y DDD, y me acabo de enterar que además tiene canal de Youtube.
Me encanta su serie de vídeos sobre refactor aplicado a ejemplos de código:
¿Material design tiene tanto tirón a día de hoy?
Sé que lo han renovado y tal pero material design me suena todavía a apps del año 2016 con navbars de colores y botones planos.
Me hacen gracia las empresas que te contactan con alguna oferta laboral y ponen que lo que ofrecen es contrato indefinido, horario flexible y salario competitivo, vamos lo que ofrece todo el mundo.
Ofrecemos:
- Te dejamos dormir
- Te pagamos más de un cuenco de arroz
- Puedes trabajar sentado
- No damos latigazos
Mañana en el email de #Alquimias voy a hablar sobre el autómata juego de la vida (the game of life).
Si lo quieres recibir te puedes apuntar en este link:
El otro día preguntaba aquí por un sistema de nomenclatura para clases CSS.
Los más típicos son ITCSS, BEM, OCSS, SMACSS, OOCSS que ya llevan varios años asentados.
También menciono uno bastante reciente llamado CubeCSS creado por @piccalilli_ y me apetece explicarlo bien.
Lo primero es decir que llevo usándolo cosa de unas semanas por lo que todavía no soy experto en el sistema.
Lo primero es decir que CubeCSS trata de utilizar la cascada de CSS y no de ir en contra de CSS como otras metodologías.
Cube son las siglas de Composition, Utility, Block y Exception.
La filosofía de Cube es el progressive enhancement esto quiere decir que lo que intenta es ir desde lo más general a lo más específico.
Esto permite tener que escribir menos estilos.
La primera parte de Cube es la de utilidad. La idea es aprovechar lo mejor de Tailwind para tener clases de utilidad para los design tokens.
Ojo con esto, no se trata de hacer que todo el CSS sean clases de utilidad, tan solo los design tokens como colores, tipografías, etc
Un ejemplo de estas clases sería:
.bg-primary { background: #ff00ff; }
También se permite clases de utilidad que tengan una sola misión aunque tenga varias propiedades, como esta:
.ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
Esto de las clases de utilidad permite quitarte de muchos estilos en el CSS ya que tan solo tienes que poner el nombre de la clase en el HTML
Siguiente concepto el de composición. Pongamos que tienes una lista de items, la idea es que dentro de cada item pueda ir casi cualquier cosa, para ello es conveniente usar este tipo de clases:
.flow > * + * { margin-top: var(--flow-space, 1em); }
Si un día decides cambiar un elemento interno de la lista sabes que se va a aplicar también su margen sin tener que cambiar o añadir clases.
Al usar dentro de esta clase una variable CSS puedes personalizar para cada contexto el valor:
.card__content { --flow-space: 1.4rem; }
Cube también tiene elementos llamados bloques que son partes reutilizables con estilos para complementar a los que ya has añadido antes con las clases de utilidad y composición.
Un ejemplo de esto es una card de una lista de artículos o un botón.
Por último quedan las excepciones. Imagina que tienes el bloque de card que dentro tiene una foto y un heading, y necesitas en un sitio que se vea al revés, el heading arriba, esto es una excepción o estado.
Para este caso Cube recomienda aplicar un data-attribute al HTML.
El ejemplo anterior sería tal que así:
<article class="card" data-state="reversed"></article>
Ahora simplemente tienes que seleccionar con CSS el data-attribute y poner el estilo que necesites.
Al ser data-attributes y no clases los puedes pillar mejor con JS.
Y eso es un poco lo que ofrece Cube, como digo yo ya lo he probado y me ha gustado porque tiene lo mejor de cada metodología, sin caer en todo utilidad o todo BEM sin tener nada de utilidad.
Lo único malo que le veo es crearse todas esas clases de utilidad. Cube recomienda la librería de Gorko para crear las clases a partir de unos tokens pero al final es un paso extra a la config del proyecto.
De momento yo lo que hago es crearlas a mano.
https://github.com/andy-piccalilli/g orko
Por cierto y ya para cerrar (siento la chapa), una curiosidad de Cube es que las clases se escriben entre corchetes, esto se hace para separar los tipos de clase:
class="[ summary ] [ flow radius ] [ bg-primary color-light ]"
Seguro que me dejo algo, si te interesa la metodología echa un vistazo a su página oficial, sobre todo a los ejemplos:
https://cube.fyi/examples.html#talks -videos-and-interviews
En un futuro tengo pensando sacar un artículo práctico explicando un poco más CubeCSS.
Gracias por leer y compartir el hilo!
Justo el otro día preguntaba por aquí sobre closures de Javascript, que yo lo confundía con currying.
Miraos este vídeo porque está muy bien explicado lo de los closures, que yo lo utilizaba sin saberlo.
En respuesta a:
Object.assign() debería tener un modo deep que te haga lo mismo pero para objetos complejos y anidados.
Me cabrea mucho andar con funciones auxiliares siempre que necesito eso.
Esta semana tampoco tengo contenido vuestro que poner en el email de #Alqumias.
Me puedes mandar por privado el enlace a un artículo, librería, o proyecto open source sobre programación para incluirlo en el email.
Muchas gracias!
Qué sepáis que no he parado de escribir el ebook. Me quedan 4 capítulos de escribir y luego revisarlo todo y añadir lo que falte.
Muchísimas gracias por cierto a todos los que os habéis apuntado ya.
En respuesta a:
https://twitter.com/CodingPotions/st atus/1432396698668593153
¿Una pregunta, habéis usando recientemete las closures de Javascript?
Cuando miro cómo funcionan siempre me pregunto para qué me sirven si tengo las clases de ES6.
Gracias a los que me habéis contestado, me he dado cuenta de que no tengo ni idea de como funciona porque yo me refiería a currying 😂
Lo bueno es que ahora he aprendido lo que es currying y lo que es closures, y que necesito repasar de forma urgente conceptos.
Muchas gracias!
Ojito a esto si eres fan de Harry Potter ⚡
Resulta que han modelado una parte del castillo de Hogwarts en 3D y lo han metido dentro de Unity.
Puedes explorar el castillo en primera persona desde el propio navegador:
https://yelidmod.com/unity/hogwarts/
Repo:
https://github.com/tetreum/ghosts-of
-hogwarts 
Osea imaginad lo que molaría un videojuego de Harry Potter en el que poder explorarlo todo en primera persona.
Porque loe juegos que hicieron de cada película son bastante flojillos.
Y veremos que tal el nuevo de Hogwarts Legacy, espero que al final no sea otro chasco.
(=<$9]7<5YXz7wT.3,+O/o'K%$H"
;'~D|#z@}b={^Lx8%$Xmrkpohm-kNi;gsedcba`_^][ZYXW
VUTSRQPONMLKJIHGFEDCBA@?>=<;:9876543s+O<oLm
Mañana la newsletter que envio de #Alquimias es un poco diferente, voy a hablar de lenguajes raros de programación.
Si los quieres descubrir te puedes apuntar aquí:
Muchos ya conocéis la famosa librería CSS de utilidades llamada Tailwind, pero, ¿sabías que existen más alternativas? 
Windy CSS.
Esta librería es completamente compatible con Tailwind (puedes migrar desde Tailwind sin cambiar mucho código).
Además añade cosas interesantes como poder agrupar varias clases o poder crear tus propias clases desde el HTML al vuelo.
Tachyons.
Esta librería es más antigua que Tailwind, pero con sus mismos principios, todo son utilidades.
Es más selectiva en los estilos que trae por lo que tendrás menos utilidades a tu disposición, aún así sigue siendo una alternativa muy interesante
Chakra UI.
Como tailwind pero orientado a componentes de React y de Vue.
En lugar de poner clases la idea es usar props que permiten que los componentes sean muy flexibles y personalizables.
Con diferencia, lo que más odio de Twitter es que si respondes a un tweet tuyo en una respuesta a alguien, sale en el TL de tus seguidores.
Osea entiendo ese funcionamiento para los hilos, pero en una respuesta a alguien te limita que no puedes añadir más tweets para explicarte.
Por ejemplo este tweet me parece ok que salga en el TL porque es una respuesta a un tweet para hacer un hilo.
Twitter debería detectar que estás añadiendo un tweet pero a una respuesta a alguien para no sacarlo.
Como el front va por rachas, creo que el futuro será volver a las páginas webs generadas directamente desde backend.
Generas las vistas directamente desde base de datos sin tener que crear APIs y te ahorras las llamadas a back y tener que andar con server-side o cosas raras.
Ojo a estos dark patterns.
En respuesta a:
Por qué hoy si es el día del programador no tenemos fiesta?
Es en plan "eeey feliz día del programador, ale a seguir trabajando".
¿Que sistema de naming usáis para las clases en el HTML? ¿BEM? ¿Utility como Tailwind?
A mi BEM no me gusta si es para páginas creadas con componentes con estilos aislados.
¿Hay alguno que aproveche mejor la cascada de CSS?
También conozco está metodología llamada CubeCSS pero tengo dudas de que tal funcionará, alguno la ha probado?
Luego también están las míticas metodologías como ITCSS, OOCSS, SMACSS que ya tienen unos años de antigüedad.
De la tabla de contenidos del ebook, ¿añadirías algún concepto que falte? Por incluirlo también antes de sacarlo.
En respuesta a:
https://twitter.com/CodingPotions/st atus/1432396698668593153
Alquimias enviado! Espero que os guste.
Por cierto, no suelo decirlo, pero muchas gracias a los que compartís los correos y a los que apoyáis la newsletter en general, eso me motiva mucho.
📭 Mañana en la edición número 34 de la newsletter de #Alquimias voy a hablar de la motivación.
Si quieres leerlo te puedes apuntar aquí:
¿?
Quiero meter esquemas en los artículos del blog, pero no quiero usar http://draw.io porque no quiero cajas rectas.
¿Existe alguna web/herramienta para dibujar con el ratón y que te suavice el trazo y quede chulo?
Gracias de antebrazo.
Ya que tengo iPad también había pensando en pillar el Apple pencil y usar una de estas apps de tomar apuntes.
Llevo unas semanas trabajando con la librería de AJV para node y funciona de locos.
Permite validar JSON con unos esquemas que permiten validar de todo, incluso objetos complejos o arrays de objetos.
¿En serio no hay una manera cómoda de usar max-width en un <text> de SVG para que ocupe varias líneas?
Estoy haciendo una gráfica con D3 y he visto que hay gente que los cambia por <p> de HTML pero me parece muy turbio.
También se puede hacer diviendo el texto en varios <tspan>
¿A qué videojuego le has dedicado más horas?
Yo al counter strike global offensive con más de 1000 horas. El segundo probablemente sea el Call of Duty: Modern Warfare 2 de PS3
Que os parece entonces HSL? Lo vais a aplicar en CSS?
¿Conoces HSL? Es una forma alternativa a RGB para crear colores.
¿Sabes que puedes usar HSL en CSS y que además aporta muchas ventajas respecto a usar RGB y Hexadecimal?
Te lo cuento mañana en la newsletter de #Alquimias, apúntate aquí:
Con esta extensión para el vscode puedes tener en la barrita de abajo información del sistema como carga de la CPU, de los discos, velocidad de la conexión, etc.
https://marketplace.visualstudio.com
/items?itemName=njzy.stats-bar 
Si habéis publicado recientemente un artículo, vídeo o proyecto open source, es el momento de que me mandéis por privado un link para que lo meta en la newsletter de mañana.
Send links!
Nueva update del vscode.
Bracket Pair Colorized soportado de forma nativa (ya no necesitas la extensión)
Detección automática de código al pegarlo en el editor.
Mostrado de los nombres de los parámetros de las funciones a lo Webstorm.
Y más cosas.
https://code.visualstudio.com/update s/v1_60#_inlay-hints-for-javascript-and-typescript
Por cierto, no me mola la idea de pasar extensiones del vscode a código nativo.
Más que nada porque al ser extensión puedes decidir si descargarla o usar otra, pero si viene ya con el editor te tienes que comer que pese más aunque luego no uses esa feature.
Y no lo digo por esta extensión en concreto, más que nada es por si en un futuro deciden migrar otras extensiones a código nativo del editor.
Con este vídeo, en 1 minuto vas a saber qué cosas han metido nuevas en Typescript sin tener que ir a mirar las notas de changelog.
Septiembre se siente más como inicio de "nueva temporada en la vida" que fin de año.
Es cuando más gente aprovecha para cambiar de empleo y cuando se vienen con las energías renovadas de las vacaciones.
Habría que meter en la cárcel a los creadores de esas webs que únicamente se dedican a copiar issues y respuestas de Stack Overflow para traducirlas a otros idiomas.
Una pregunta, ¿creéis que se viene uns crisis brutal en España?
Cada vez todo es más caro: la lista de la compra, la luz, los coches, alquileres, preco de las casas, etc.
Aunque todo cuesta más los sueldos no suben y encima en muchos sectores cada vez se trabaja más.
40% de paro juvenil y encima con población cada vez más envejecida porque los jóvenes no tienen perspectvias de formar una familia.
Fabricas y producción incluso de alimentos llevadas a países más baratos, nos salva el sector servicios y el turismo.
Cuando juego a videojuegos siempre me fijo en que las interfaces tienen soniditos al moverse por menús y cosas de esas pero en cambio las páginas webs no lo tienen.
En páginas web es complicado porque no esperas que suene nada al navegar, solo en contenido multimedia.
Humble bundle de Python.
Incluye muchos cursos y ebooks, además de una licencia de Pycharm Pro (recuerda activarla en una cuenta que no haya usado nunca Pycharm Pro)
(Enlace sin referido)
📗 Estoy escribiendo un ebook de #Vue con conceptos avanzados y alguna técnicas interesantes que yo mismo aplico.
😞 El problema es que me falta motivación.
Os pido que si os interesa os apuntéis para que os avise cuando lo saque
Geacias por compartir!
Feedback de la newsletter de #Alquimias porfa.
¿Os gusta? ¿Os aporta algo? ¿Algo que mejorar?
Como no es algo con lo que se pueda ver la reacción de la gente en directo a veces me quedo pensando si lo que hago no interesa a nadie.
Esto es felicidad.
A vuestra salud my friends! 
📯 En el #Alquimias de mañana hablamos de la regla del 80/20 ¿sabes cuál es?
Para recibir el email te puedes apuntar aquí, que es gratis, y lo mejor es que me haces muuuy feliz.
Pregunta sobre testing unitario.
Cuando estáis testeando un método o función que devuelve un booleano, creáis un test con dos aserciones o directamente creáis dos tests separados?
WTF me acabo de dar cuenta de que en el canal de Youtube oficial de del vscode @code están publicanco una serie de shorts (vídeos muy cortitos) explicando cosas muy interesantes, echadle un ojo:
Me flipa que en los Sims 1 se usara la fuente de Comic Sans.
Lo he rejugado alguna vez pero no me di cuenta hasta hace poco que usaba esta fuente.
¿Hay algún ejemplo más de producto o juego muy famoso con esta fuente? 
En el Fornite unos jugadores profesionales descubrieron un bug por el que se podían subir a un misil en el juego.
Como al final lo usaba tanta gente y era divertido los de Fornite dijeron que ahora ese bug era una feature, literalmente.
https://cogconnected.com/2018/09/for tnite-creators-originally-thought-rocket-riding-was-a-bug/
Junior Developer ok Senior Developer ok
Pero Medior Developer? Suena horrible, prefiero Mid Developer. O ni lo uno ni lo otro Developer.
¿Que fue de Yeoman?
Para el que no lo sepa lo que permite es poder crear estructuras de carpetas y ficheros iniciales de muchos proyectos web.
Hoy en día creo que se usa menos porque cada librería viene con su propio CLI para scaffolding.
Es increíble como cada vez saltán más y más anuncios tanto en Youtube como en Twitch. Todo para que pases por caja.
Que sí, que de algo tienen que vivir, pero, hace falta ganar tanto tanto dinero? Se vuelve insufrible muchas veces.
Como las webs con tantos popups.
Alquimias enviado! Lo de siempre, comprueben su carpeta de spam por si el correo ha llegado ahí.
Espero que os guste!
📨 El email de mañana de #Alquimias tiene como título "Nuca es tarde".
Si lo quieres recibir apúntate aquí, que es gratis (free).
A los que tenéis ratones tipo Mx Master o verticales, ¿no se os cansa la mano?
Vale que se supone que la posición es más ergonómica, pero pesan un montón.
No sé donde leí que más de 100 gramos hace que a la larga te canses de moverlo.
Yo tengo uno normal de 70g y muy contento.
Osea usad es el que más cómodo os sea, da igual el peso.
Es simple curiosidad ya que no he tenido nunca uno de esos.
Me hace mucha gracia que entre las ventajas de ciertas apps se ponga que está hecha en Rust.
En plan ojito cuidado que esto está hecho en Rust eh, máxima velocidad y eficiencia (como si no hubiera código mal hecho en cualquier lenguaje)
Repito la encuesta para ver si la cosa ha mejorado.
¿Estas vacunado?
Link a la encuesta anterior:
En respuesta a:
https://twitter.com/CodingPotions/st atus/1413408118864809985?s=19
Tocamos madera porque por el momento que yo sepa no meten publicidad en los IDE y editores de texto .
¿Te imaginas que por usar un editor gratuito te colaran anuncios? En plan como cualquier app Android gratuita.
Mejor no doy ideas.
Algunos me estáis diciendo que por ejemplo el vscode ya tiene telemetría para compensar que es gratis y es cierto.
Os dejo por aquí el vscodium que son unos binarios que sacados del vscode pero quitando toda la parte de telemetría.
Qué sepáis que estoy cambiando el blog por completo aunque me va a llevar mucho trabajo.
Me he vuelto loco y estoy hasta reescribiendo gran parte de los artículos.
Me he metido en un jardín increíble, espero que haya tomado una buena decisión.
Una estadística que me acabo de inventar dice que el 90% del tiempo un curso de Udemy va a estar un 90% rebajado.
¿Habéis visto que páginas y portfolios tan bien creados salen en este vídeo?
Vídeo de @FaztTech
¿Por qué tiene que haber países que con el símbolo de la divisa delante del número y otros con la divisa detrás?
Esa tontería hace que haya que añadir mucha lógica solo para eso en componentes con divisas o inputs para meter divisas.
Y mejor no hablamos de las fechas y de los sistemas de medida (ejem USA)
Fijaos si soy pesimista que veo la batería del móvil al 60% y ya pienso que tengo poca.
Es algo que quiero cambiar, pero me cuesta mucho, siempre pienso en lo malo de todo.
Alquimias enviado. Espero que os guste! Si no veis el correo mirad en la carpeta de spam.
📮 Mañana, nueva edición de la newsletter de #Alquimias y voy a hablar de consejos para terminar de una vez todos esos proyectos personales que nunca acabas.
¿Te interesa? Apúntate aquí, que es gratis, no tienes excusa:
En el trabajo han petado los jobs de CI/CD porque no sé en qué versión de Nuxt el comando de build antes de hacer nada te pregunta si quieres enviar estadísticas anónimas y hasta que no respondes no hace build.
Se puede desactivar, por cierto, pero menuda mierda.
CALOR
¡Nuevo artículo del blog!
📊 Por fin los resultados de la encuesta sobre salarios en el sector de la programación.
No os lo suelo pedir, pero porfa compartid la encuesta para que todos tengamos más datos para negociar mejor los salarios.
https://codingpotions.com/salarios-p rogramadores-2021
Muchísimas gracias a @guillermo_adan que ha sido el encargado de analizar y crear las gráficas que aparece en el artículo.
También ha creado esta increíble infografía mucho más bonita que el artículo, recomiendo que os la descarguéis.
https://codingpotions.com/descargas/ informe-salarios-2021.pdf
Por cierto, lo digo también en el artículo pero siento mucho que los de latioamérica se hayan quedado fuera del análisis.
No especifiqué divisa en la encuesta y es un lío saber qué divisa es cada dato, para el año que viene me lo apunto para que todos respondan en la misma.
Por último pedir disculpas también por no haber intentado hacer que haya el mismo número de respuestas entre mujeres y hombres. Simplemente publiqué la encuesta en redes sociales.
Eso es todo, gracias a los encuestados. El año que viene me apunto estos fallos para hacerla mejor.
Lo nuevo de github ya se podía hacer antes no? cambiando la url por github1s. Lo que pasa es que a Microsoft le gusta mucho lo de comprar y copiar cosas en lugar de ayudar a mejorarlo.
Microsoft es dueña de el editor de código más usadoi (vscode), del alojamiento de código más usado (github), del gestor de dependencias en front más usado (npm) y de uno de los lenguajes más usados para front (typescript)
Qué si, que por el momento gracias a Microsoft esos proyectos siguen adelante, pero no olvidemos que al final es una multinacional con intereses económicos que controla gran parte de las herramientas que usamos todos los días como desarrolladores.
¿Qué os parece esta comparativa sobre web frameworks de nodejs?
La he econtrado porque tengo un proyecto creado en express que en un futuro seguramente recibirá muchas peticiones por segundo.
He echado un ojo a nanoexpress y tiene buena pinta.
https://web-frameworks-benchmark.net lify.app/result?asc=0&l=javascript&order_by=level512
Esta semana todavía no he recibido enlaces a contenido vuestro (artículos, vídeos, librerías...) para meterlos en la próxima edición de #Alquimias
Send links! 
Si todo va bien posiblemente mañana nuevo artículo en el blog!
Stay tuned!
Casi todos los desarrolladores web conocen Typescript, pero, ¿os suena Dart?
Ahora se usa para desarrollo móvil en Flutter pero hace tiempo era una especie de Typescript de Google.
Su sintaxis era parecida a Java, con tipado, pero casi nadie lo usaba.
http://web.archive.org/web/201503310 23556/https://www.dartlang.org/
Me da rabia cuando veo que la gente tiene en sus páginas webs formularios para suscripción a newsletter en los que te apuntas pero no te llega nunca nada.
Tienes a un montón de gente creyendo que van a recibir emails sobre un tema y al final solo llega publi cada mucho tiempo.
Y no va por nadie en particular eh.
Seguramente cuando empezaron la newsletter si que mandaban correos pero como todo, al final se acaba, en ese caso prefiero que se quite el formulario y listo.
Pero es lo que digo, mucha gente lo sigue teniendo puesto en la web porque es muy goloso ir pillando emails de la gente.