Matías Profile picture
Frontend Engineer 🚀 Content creator 📝 Bilingual videos and articles. Building https://t.co/SHYD0duJp8 to make content creation easier. ES 🇨🇱 / EN 🇺🇸.
Apr 23, 2023 11 tweets 3 min read
Yesterday I tweeted about using ts-pattern to write a new "reducer" function, and it blew up :D

So, let me show you how I'm using ts-pattern and another TS shenanigans to get a terse and simple API to be used.

1st thing to notice in the previous tweet screenshot is that I'm passing an object to the `match` function `{state, ...action}`

That means that the "matcher" have access to the entire state and the action object `{type: '', payload}`

Then, I'm matching only in the type property
Jan 23, 2022 12 tweets 4 min read
Buenas noticias crytpo amigos!

El hard-fork de @ethereum acaba de entrar en la fase 0 de su transición a Proof of Stake, lo que significa que alrededor del tercer trimestre tendrá un futuro más verde un 99,9% menos de energía que la situación actual.

ethereum.org/en/eth2/ Pero ¿Qué es Proof of Stake?

Este es un mecanismo que permite que la red descentralizada llegue a un consenso o acuerdo sobre las transacciones, las direcciones y el estado general de la red.
Jan 23, 2022 13 tweets 4 min read
Good news crypto folks.

The Hard-fork of @ethereum just entered Phase 0 of its transition to Proof of Stake meaning that around Q3 it will be a greener future!!

It will consume 99.9% less energy than the current situation

Read more about it!🥸

ethereum.org/en/eth2/ But why all the fuzz? What is Proof of Stake?

This is a mechanism to allow the decentralized network to come to a consensus or agreement about the transactions, addresses, and overall status of the network.
Jan 19, 2022 5 tweets 2 min read
A quick update on the progress of my course: Getting started with Ethereum development.

Before recording it, I'm writing all the content in markdown files that are publicly available in this GitHub repository

github.com/matiasfha/cryp… So you can follow along the course directly there 💪.

Till now there are 3 fully written lessons, I invite you to check them out.

> Each lesson lives into its own branch
Jun 13, 2021 6 tweets 2 min read
Estoy 100% con tener un postnatal parental pero no como algunos están pidiendo que se legisle. Un postnatal parental no puede ir en desmedro de la mujer que materna y debe por sobre todo resguardar el bienestar del lactante no del padre que busca retener un privilegio Además este tipo de propuestas no pueden obviar la realidad de nuestra sociedad, una realidad en donde la mayoría de las mujeres que maternan lo hacen solas, con bajos recursos, donde muchas familias deben elijir quien trabaja, donde el postanal va en desmedro del salario total
Jun 10, 2021 13 tweets 3 min read
Sabes que actualmente puedes usar <Suspense> en React? bueno, no exactamente cómo se mostró en aquella épica presentación de Dan Abramov donde se mostró el poderío de "Concurrent Mode" pero ya tenemos avances de ello desde React 16. <Suspense> es utilizado para mostrar un indicador de carga en caso de que el componente (o árbol de componentes) hijo no esté listo para ser renderizado aún.

Es decir, permite "suspender" el renderizado a la espera de que el o los componentes terminen de realizar alguna tarea
May 20, 2021 7 tweets 2 min read
🎉 JOB ALERT
@Clevertech is looking for experienced React Devs

Come work with an awesome and kind team (And with me 😅)

Fully remote positions with a really remote 1sr company.

If you're looking for level up your career this might be the opportunity.

Check the links below! Do you know React and feel comfortable working with big codebases?
You enjoy working with JSX and composing hooks?
clevertech.biz/careers/senior… start date June 1st!
May 19, 2021 11 tweets 3 min read
He estado pensando mucho en la composición de componentes y cómo se pasa por alto esta "característica" en la mayoría de los proyectos. React es inherentemente "componible", se puede argumentar que la composición es el punto central de React y el modelo de componentes.

Entonces, ¿por qué no se usa con más frecuencia?
Una razón podría ser que: no es el modelo mental predeterminado.
May 19, 2021 10 tweets 3 min read
Been thinking a lot about component composition and how overlook this "feature" is in most codebases.

Reacr is ineheretrly composable one can argue that composition is the whole point of React and the component model.

So, why is not used more frequently? One reason could be that: is not the default mental model.

Is like the default way we structure components in our minds is just inheritance. Containers containing more containers.

This approach of will definitely ends up in a prop drilling issue at some point.
May 6, 2021 18 tweets 6 min read
State management in a web app can be a real PITA and confusing topic to tackle down.
The way that you handle the state is something you should take care of from the very beginning.

Starting for: what is state and what type of state do I have? The application state can be split into at least two types :

🕙 Server state: asynchronous and doesn't really belongs to the app, remotely persisted, potentially out-of-date.

📺 UI state: synchronous, easily accessible, derived from user interaction. Complete ownership
May 5, 2021 4 tweets 2 min read
Gracias a la lamentable pandemia la educación remota es pan de cada día tanto para nuestr@s niñ@s como también para adultos buscando mejorar sus conocimientos.
Hay muchos sitios y muchas formas de ofrecer y consumir contenido pero como hacer que sea educación efectiva? Es un mundo complejo y claramente diferente para cada uno pero creo podemos dividirlo en grupos eta ríos buscando que funciona mejor para
- preescolares (tengo mis opiniones aquí)
- adolescentes
- universidad
- Adultos buscando mejorar su carrera
Me enfocare en el último punto
May 4, 2021 7 tweets 2 min read
Just in case you are falling into a dark and deep TS rabbit hole with react-hooks-form.
If you want to have custom components that do something based on the `errors` that comes out of `useForm`.
That error object type is DeepMap<TFieldValue, FieldErrors>. For some reason that I'm not in the mood to discuss xD I wanted to pass that errors down to a "generic" Input and friends component to show some error state.
But TS didn't like it. It said that I wasn't able to access `errors?.[props.name]` 😅
May 4, 2021 7 tweets 3 min read
Do you know the state reducer pattern in React?

Is a design pattern that enable the user of a component to manipulate or manage the inner state of it by using a reducer pattern. When creating components for an UI library for your project you have to take some decisions and assumptions about the way it work or be used.
But adding so many opinions to it can decrease the generalization of your component and the usability of the same.
Apr 24, 2021 9 tweets 2 min read
When writing React.

How do you decide to use useReducer instead of useState?

In general you can always use reducers, technically useState is a simplified version of useReducer.

But then, Why use useReducer?

Although it looks more complex, using it gives you great advantages. The first advantage is encapsulation and abstraction.
useReducer uses a reducer function that lives outside of the component and is not affected by re-renders. It also simplifies your code by ISOLATING the state logic in a function.
Apr 24, 2021 12 tweets 4 min read
Al escribir componentes React.
¿Cuando decides usar useReducer en vez de useState?

En general puedes usar reducers siempre, técnicamente useState es una versión simplificada de useReducer.

¿Por que usar useReducer?
Si bien se ve más complejo usarlo te da grandes ventajas La primera ventaja es encapsulacion y abstracción.
useReducer utiliza una función reducer que vive fuera del componente no siendo afectada por los re-renders y además simplifica tu código por que AISLA la lógica de estado en una función.
Apr 22, 2021 6 tweets 4 min read
Becoming an @eggheadio instructor is for sure the biggest achievement in my career as dev.
I was just talking about this very same topic with @RealChrisSean and now I see that I been featured

egghead.io/blog/matias-he… Becoming an instructor gave so much confident and encouragement to move forward that I now have two podcasts @cafe_contech and @ControlRemoto7 had the honor of became and @Auth0Ambassador and @MediaDevs, write for @freeCodeCamp and @freecodecampES...
Apr 18, 2021 14 tweets 4 min read
Hablemos de "State management" y porqué es "complejo".

¿Que es el estado de una App?

En una versión muy simple estado son datos que cambian en el tiempo y que usamos para definir que se muestra o no al usuario.

Pero: ¿de donde vienen esos datos? Esta pregunta es quiza la "piedra angular" para un modelo mental sobre el manejo de estado.
No todo el estado es igual ni proviene de las mismas fuentes.
Podemos definir a lo menos 2 categorías de estado
- UI state
- Server State
(shouts @tannerlinsley for this idea)
Apr 18, 2021 19 tweets 8 min read
¿Por que el desarrollo web se ha vuelto tan complejo?
En mi opinión tiene que ver con principalmente dos razones:
1. Los requerimientos han crecido y las expectativas de los usuarios y clientes han aumentado respecto a que es y no posible "en la plataforma"
... 2. La web (como la ideó Sir @timberners_lee) no fue ni está "arquitecturada" (palabra inventada) para lo que la estamos usando hoy.

La web fue ideada e implementada como una plataforma para compartir documentos de hiper texto. "Documentos" (subrayo ésto) que se enlazan con otros
Feb 18, 2021 6 tweets 2 min read
Q me disculpe @Pa__tty pero usar la vulnerabilidad de NNA como argumento para la presencialidad en clases de colegio es incongruente.
1ero que edades? Acaso todos los estudiantes podrán llevar a cabo los protocolos de autocuidado?
2do hablan de la vulnerabilidad de estudiantes... Si hablamos de estudiantes vulnerables lo más seguramente también serán establecimientos de escasos recursos por lo que es muy difícil asegurar protocolos de seguridad (en cuanto a insumos).
Feb 17, 2021 6 tweets 1 min read
He leído varias veces este tipo de preguntas.
¿Se puede usar React con....? O ¿Cómo usar React con X...? Siendo X alguna tecnología para desarrollo de APIS como Rails, Django, PHP/Laravel,.Net y en general la respuesta es la misma.
2 opciones posibles (no sólo para React) 🧵 La primera opciones es simple. Crea una api Rest o un endpoint graphql y listo.
React (y otros frameworks) pueden funcionar "solos" (una SPA). Es decir se distribuye un grupo de archivos estáticos que son servidos en algún CDN y se comunican con el servidor mediante alguna API.
Feb 11, 2021 10 tweets 3 min read
¿Clases o funciones al escribir tus componentes en #React?
Esta es una pregunta bastante común entre quienes están comenzando o retomando el desarrollo web con React.
¿Cuál es el approach correcto o el mejor?

¿Que prefieres tu y por que?
Sigue un hilo 🧵 Hoy el uso de componentes funcionales es la forma "aconsejada" o preferida de escribir tus componentes, pero las clases aún siguen ahí y no se irán por un buen tiempo. Incluso hay muchas app en producción que aún usan componentes de clase ya q fueron escritas hace un tiempo...