React Hebdo #53: Gatsby 3, Reanimated 2, Flutter 2, TypeScript, MDX, React-Native...

React

Gatsby a annoncé plein de choses cette semaine: Gatsby v3, Gatsby Hosting (basé sur Fastly), Gatsby Functions, amélioration de Gatsby Image, build incrémental non expérimental et activé par défaut, amélioration des intégrations Shopify, WordPress, Contentful... Il y a également des changements coté pricing, et le nombre de builds (appelé avant "real-time- edits") n'est plus limité, ce qui rend la solution Gatsby Cloud beaucoup plus compétitive.

Titus (créateur de beaucoup d'outils Markdown comme Remark et MDX) nous présente une démo intéressante de l'usage des server components et de MDX, avec certains composants rendus coté serveur, et d'autres coté client. Tout ceci n'est pas production-ready, mais donne une idée de ce qui nous attend.

Kent C. Dodds présente un composant React non typé et le refactor progressivement en TypeScript. Explique pourquoi éviter React.FC, et l'usage d'inférence basé sur keyof/typeof pour réduire la duplication de littéraux.

Un tutoriel bien fait qui explique comment créer son propre hook useForm() et gérer la validation des formulaires. Peut aider à comprendre comment une librairie comme Formik est construite.

Shawn Wang explique en quelques lignes pourquoi React n'est volontairement pas réactif, avec un lien vers un ancien talk sur le sujet.

Jobs

Une offre ci-dessous vous intéresse? Répondez à cet email!

Lazy: dev React senior - CDI remote 55/65k

Ponicode: dev JS/React - CDI Paris 40-65k (confirmé ou senior)

StartupFlow: dev Fullstack NodeJS/React - CDI Paris 45-60k

Snapshift: dev React confirmé - CDI Paris 50/60k

Splio: dev Fullstack React/NodeJS senior - CDI Paris 60/70k

F4: dev NodeJS - CDI Paris 40/50k

ReactNative

Première version stable de Reanimated v2.0! Sera également intégré à Expo SDK 41 qui ne devrait plus trop tarder. On sent que l'écosystème exigeant des animations en React-Native arrive à maturité.

La release 0.64 tarde à sortir depuis un moment! Avec la dernière RC, on sent qu'on est plus très loin.

Chez Microsoft, ils sont déjà prêt à releaser React-Native-Windows 0.64 :)

Retour d'expérience complet, positif et assez nuancé sur l'usage de React-Native dans le temps chez NerdWallet, de 2016 à aujourd'hui.

Explique comment tester des composants qui utilisent le hook useNavigation() avec 3 stratégies différentes. Il y a quelques années, j'ai été confronté au même problème pour l'inclusion d'écrans couplés à React-Navigation dans Storybook et ouvert une RFC pour créer un <StaticNavigator>.

Article qui explique comment facilement créer un design system en React-Native et les avantages que cela apporte. Perso j'aime bien utiliser Storybook sur React-Native en complément.

Divers

Flutter 2 vient d'être annoncé à Flutter Engage, avec diverses améliorations et le passage en version stable de Flutter web et de plusieurs plateformes Desktop. Voir le post technique sur Flutter 2 et le post dédié à Flutter Web (un bon résumé ici).

J'ai expliqué sur Twitter pourquoi je ne suis pas encore très convaincu par le support web. Pour moi, il faut vraiment avoir un use-case adapté à Flutter, mais sur les webapps CRUD, de gestion et de contenu de la majorité des gens, l'expérience n'est pas top. Allez voir Flutter Folio, une app du showcase pour vous faire une idée.

La prochaine beta TypeScript 4.3 est prévue pour le 30 Mars, et on peut avoir une petite idée de ce qu'elle va contenir (j'ai pas encore trop regardé).

Stefan explique pourquoi le type des erreurs dans un catch ne peut être que unknown ou any, et pas Error ou CustomError.

Le "handbook" de TypeScript a été ré-écrit et devrait devenir une référence incontournable pour apprendre TypeScript rapidement. Ca m'a l'air beaucoup mieux qu'avant.

Josh Comeau explique pourquoi il est important d'apprendre correctement le CSS quand on est un développeur frontend JavaScript.

Depuis Chrome 85, les DevTools peuvent éditer le CSS-in-JS. Alex de Google DevTools explique en quoi le CSS-in-JS est différent du CSS normal et pourquoi il n'était pas éditable avant.