React Hebdo #89: Remix, Remotion, Preact, Nextra, Relay, JSI, Skia, SwiftUI, TypeScript, web3...
React
Some Thoughts on Server State in Remix
Une réflexion intéressante sur la gestion du state et des appels serveurs dans Remix, qui est designé pour fonctioner aussi bien avec que sans JavaScript coté client.
Run Next and Remix on the same server
Un setup intéressant, qui montre qu'on peut mélanger Remix et Next.js dans un même serveur Node.js, ce qui peut faciliter une migration incrémentale de l'un vers l'autre
Remix, SQLite, and Prisma, Oh my!
Encore une belle démonstration des features de Remix. Le fait de pouvoir appeler Prisma depuis les loader functions est assez puissant. Cela rappelle d'autres solutions comme Next.js et les serveur components, mais de manière plus co-localisée.
Dernière release de la lib de production vidéo en React. Le player Remotion est maintenant stable. Un nouvel Error Overlay et un template Audiogram. La prochaine release sera surement la 3.0 avec le support du rendering serverless et la possibilité d'encoder hyper rapidement ses vidéos!
Extras:
Avoid waterfalls of queries in Remix loaders: même si Remix arrive à paralléliser les requêtes, il faut quand même utiliser
Promise.all()
à l'intérieur d'une fonction loaderRemix recrute: remote-first, 4h d'overlap USA: ça peut passer si vous aimez travailler le soir 😉
Preact now has a Tutorial: un tutoriel officiel de 10 minutes
Relay 13.0: avec le nouveau compiler en Rust
Nextra 2.0 work-in-progress: une belle stack prévue pour cet outil de doc pour Next.js, de quoi concurrencer Docusaurus 😯
Three ways to create 3D particle effects: pour ceux qui comme moi se lancent dans Three.js 😏
React-Native
A React Native Engineer Builds A SwiftUI App
Un dev React-Native qui essaie SwiftUI. La connaissance de React et du modèle déclaratif est un plus. Retours positifs sur les animations, la navigation et le "hot reload" SwiftUI. Retours plus mitigés sur les messages d'erreur, la syntaxe imbriquée et quelques autres détails.
Extras:
react-native-reanimated-carousel: nouvelle lib basée sur Reanimated 2
Marc Rousavy nous upgrade vers JSI: react-native-jsi-image & "react-native-camera has now been deprecated in favor of react-native-vision-camera"
La conf app.js reviens en Juin, le CFP ouvre demain.
docusaurus-react-native-plugin: support React-Native-Web 😍
🎥 The Matrix Reacts: 1er tutoriel React-Native-Skia de William Candillon, avec une belle intro Remotion 😉
💸 Jobs
Sponsorise React Hebdo pour publier ton offre d'emploi
Nabla: Front-end engineer React senior - Paris - 55k-90k
Nabla construit une plateforme de médecine asynchrone (chat sans rendez-vous + appel vidéo si besoin), en automatisant un maximum de tâches répétitives pour que les médecins se concentrent sur le soin et que le service reste accessible à tous.
Ils ont levé 17M€, remporté un award Google Play Best Apps of 2021 et viennent de lancer la première offre payante dédiée à la santé des femmes.
Les fans de hooks React et de Typescript se sentiront à la maison, ainsi que les amateurs de GraphQL, Tailwind, Vite ou Next.js. Pas mal de technos sympa à découvrir (WebRTC et codegen notamment)
Paris 3ème, remote possible, 55k-90k en fonction de l'expérience, + BSPCE.
Cajoo: Dev & Architecte Fullstack - Remote - 40-90k€ (+BSPCE)
Cajoo veut créer le supermarché de demain 🛒 Nous sommes présents dans 10 villes en France et suite à un investissement de 40M$ de Carrefour nous étoffons l'équipe tech pour créer la stack tech du futur du retail. Les squads s'insèrent dans les 3 streams:
🛍️ Consumer: App B2C en React Native, back-office React, backend Hasura & lambdas Node/Typescript
🏭 Warehouse: PWA React avec XState pour les opérateur en entrepôt, back-office React, backend Hasura & NestJS
🚴 Delivery: App coursiers en React Native sur Expo, back-office React, backend Hasura & lambdas Node/Typescript via Serverless
Notre code est typé de bout en bout avec Hasura en backend qui génère des endpoints GraphQL que nous consommons en frontend avec Apollo et un typing fort via Typescript.
🌴 Remote pour les équipes Tech, Produit et Data (avec possibilité de venir dans nos locaux dans le 8ème à Paris)
🏄♂️🏔️ Offsite chaque trimestre dans un endroit sympa en France (Hossegor, Chamonix)
Divers
Super article de Stefan Baumgartner, plein de bons conseils avec lesquels je suis bien d'accord. Cela devrait faciliter la prise en main de TypeScript et une montée en compétence progresssive. Je découvre le flag noEmitOnError
.
A New Container Query Polyfill That Just Works
Analyse de Chris Coyier sur un nouveau polyfill pour les container queries: une nouvelle feature très attendue pour l'encapsulation du responsive design (media queries) dans les frameworks basés sur les composants. Ce polyfill à l'air fonctionnel pour un usage dès aujourd'hui, mais il faudra attendre un peu pour l'utiliser avec du Server-Side-Rendering sans FOUC.
Lecture très intéressante sur le “web 3” par le créateur de Signal qui montre que ça n'est pas encore au point. Pas mal de réponses intéressantes des leaders Web 3 (Vitalik). Lire aussi The Myth of Decentralization and Lies about Web 2.0. Ca m'a inspiré unpost LinkedIn.
Lib qui permet à Node.js d'intéragir de manière efficace avec du code Rust, de plus en plus utilisée dans notre tooling frontend. La v2 est un rewrite rétro-compatible qui résoud certaines limitations existantes. Le but semble à terme de supporter aussi WASM pour partager le code Rust avec le browser sans effort additionel.
Extras:
Browser-Vite: une solution pour faire tourner Vite dans le browser. Comparaison intéressante avec les WebContainers de StackBlitz à la fin.
Partytown en beta: lib pour améliorer les perfs de vos pages en offloadant les scripts third-party dans un service-worker
AWS Lambda supporte maintenant ES modules et top-level await!
Un maintainer open-source sabote volontairement ses propres libs colors & faker.js: met en avant le problème de financement open-source
Prettier begins paying maintainers: mais… même pas assez pour payer qu'un à plein temps 😅
On se demande qui va recruter Jamie Kyle… 😏
Svelte Core Team Mulls Rust Compiler to Further Speed Web Apps
Solid 1.3: des améliorations sur le server rendering qui supporte le streaming, les error boundaries et l'hydratation “Islands architecture” inspirée d'Astro
Tina: New Year, New CMS? Il faut vraiment que je teste, le support natif de MDX semble intéressant!
fast-json-stringify 3.0: reporté comme 2x plus rapide que JSON.stringify
Introducing fuite: a tool for finding memory leaks in web apps