📨 #130: Next.js, callback ref, Zod, React-Hook-Form, Redux, mdxjs-rs, Tamagui, Skia, Shopify, Solid, Bun...
Salut à tous et bonne année 2023 🍾🥂🥳️
En cette période de fêtes, il y a tout de même eu pas mal d'activité avec une release Next.js et de supers articles React. Et l'écosystème React-Native a été particulièrement actif également, avec Tamagui, le support TypeScript et 2 articles Shopify.
Vous êtes maintenant plus de 15000 abonnés à me lire chaque semaine 😍
Merci pour votre fidélité et votre contribution à la croissance de ce projet. Je ferai bientôt une rétrospective 2022 pour tout vous dévoiler. En attendant, vous trouverez beaucoup d'infos sur ma page Indie Hackers.
La newsletter est revenue en avance: j'ai décalé ma semaine de ski, car il n'y a pas beaucoup de neige 😅 Prochaine édition le 17 Janvier.
Oh, et j'ai enfin réussi a créer un meme viral 🥲
💡 Consulter cette newsletter sur Twitter - format visuel 🎨
![](https://thisweekinreact.com/fr/emails/separators/christmas.png)
Pour me soutenir:
- 😘 Recommande la newsletter! Ça m'aide vraiment beaucoup!
- 💸 Sponsorise la newsletter ou sponsorise-moi
- 🧵 Retweet le dernier thread Twitter
- 📨 Réponds à cet email
- 💬 Rejoins le chat Discord
Ne manque pas le prochain email !
![](https://thisweekinreact.com/fr/emails/separators/christmas.png)
💸 Sponsor
React Bricks est un CMS visuel basé sur des composants React.
Flexible pour les développeurs: créez votre propre design system en utilisant des composants React, ajoutez l'édition visuelle dans votre JSX et ajoutez des contrôles dans la barre latérale pour modifier les props comme la couleur de fond. Choisissez Next.js, Gatsby ou Remix et le framework CSS de votre choix !
Facile pour les éditeurs: qui peuvent éditer directement de manière visuelle sans casser le design system: beaucoup plus facile que d'éditer des entités abstraites en utilisant des champs gris, comme dans un CMS headless classique. Vous gagnez du temps: les éditeurs de contenu sont autonomes !
Prêt pour l'entreprise avec la collaboration, le versioning, l'authentification unique, la conformité réglementation GDPR, le CDN global pour des images optimisées, l'intégration e-commerce électronique, la publication programmée et bien plus encore.
Commencez ici: ReactBricks.com
![](https://thisweekinreact.com/fr/emails/separators/christmas.png)
⚛️ React
Une version mineure avec pas mal d'améliorations:
- app directory
- TypeScript plugin
- Module transpilation
- Turbopack et benchmarks
- SWC plugin pour transformer les imports
- Edge runtime stable pour les API routes et middleware avancé
![](https://thisweekinreact.com/fr/emails/separators/christmas.png)
- 📖 Beta docs useEffectEvent: mise à jour suite au renommage du hook. Le nouveau site arrive en janvier!
- 📖 Redux docs: Side Effects Approaches: nouvelle page de doc avec des recommendations et comparaison entre thunks, sagas, observables, listeners, RTQ Query...
- 📜 React ref Callback Use–Cases: article très complet sur les callback refs qui permettent de déclencher des side-effects associés à un élément DOM. Jules présente de nombreux cas d'utilisation: portals, mesurer un élément DOM...
- 📜 The Ultimate Form Abstraction: utilise React-Hook-Form avec un résolver Zod. Utiliser la toute nouvelle feature Zod: type coercion pour les inputs number. Construit progressivement une abstraction de formulaire avec une bonne DX et typesafe.
- 📜 A React Developer’s First Take on Solid: une comparaison intéressante entre Solid et React, puis SolidStart et Next.js/Remix. Jake liste aussi les détails de Solid qu'il a moins aimé.
- 📜 A Review of UltraJS, Mixing React and Deno in a Single Framework: belle présentation d'Ultra, le framework React pour Deno qui pousse les dernières innovations en avant (ES sans bundling, ImportMaps...).
- 📜 Turbocharging Next.js: How Remote Caching decreased publish times by 80%: retour d'expérience de Vercel qui a utilisé Turborepo et Vercel Remote Caching pour réduire les temps de build de Next.js, en particulier du build natif de SWC.
- 📜 Hello React, Goodbye useEffect (I Hope): article bien documenté sur useEffect, sans doute trop utilisé dans nos codebases. C'est avant tout un outil de synchronisation. Quelques incohérences, mais mérite d'être lu.
- 📜 Simplifying React Three Fiber with Entity Component System
- 📜 Everything you need to know about Concurrent React (with a little bit of Suspense)
- 🤔 Bun + new JSX 2.0 Syntax: support de la syntaxe
<User {user} />)
. Une nouvelle qui ne plait pas à tout le monde car la spec de JSX 2.0 n'est pas finalisée. - 👀 Remix - CSS Modules support: PR mergée, cela devrait arriver prochainement
- 📦 mdxjs-rs: implémentation de MDX en Rust 👌
- 📦 react-wrap-balancer: un composant pour "équilibrer" le texte de vos titres sur plusieurs lignes (impossible en CSS). JavaScript inliné avec support SSR et sans layout shifts.
- 📦 react-resizable-panels (demo): une nouvelle lib de Brian Vaughn qui permet de resizer les elements d'un layout.
- 📦 gltfjsx v6: des optimisations sur le loader de modèles 3D GLTF.
- 📦 react-ts-form: lib de formulaires basée Zod et React-Hook-Form
- 📦 Gatsby 5.3
- 📊 Mobile Performance of Next.js Sites
- 🎥 3 React Mistakes, 1 App Killer
- 🎥 Learn with Jason - TanStack Query v4 with Dominik Dorfmeister
- 🎥 Learn How I Built a Twitter UI with TypeScript, Qwik, SolidJS, and React in Mitosis
- 🎥 Remotion - The Rust journey begins