React Hebdo #79: React Doc, useId, Sandpack, Gatsby, Next.js, MDX, Expo, Chicane, Node.js, Yarn...
React
Rachel Nabors a présenté la nouvelle doc React (beta), qui met en avant les hooks React, contient beaucoup d'illustrations, d'exemples interactifs (via CodeSandbox et Sandpack) et de mini-challenges, facilitant l'apprentissage de React.
C'est un site de documentation ambitieux, un projet démarré il y a plus d'un an avec toute une équipe derrière. On devrait en savoir plus prochainement, certains contributeurs ont prévu d'écrire des blog posts et collectent les questions de la communauté (Rachel Nabors, Jared Palmer).
Le site passe de Gatsby vers Next.js. Une question posée plusieurs fois: pourquoi ne pas avoir choisi Docusaurus? Docusaurus suit le principe de Pareto (20% de l'effort pour 80% du résultat). Si vous êtes prêt à investir beaucoup de temps et d'argent pour avoir un résultat optimal, ça n'est pas forcément le meilleur choix. Next.js permet aussi à l'équipe React de tester plus facilement les prochaines features de React 18. Ma réponse détaillée.
Lancement officiel pour Gatsby 4 avec ses nouvelles features principales:
Ces features le rapprochent un peu plus de Next.js, leader actuel des meta-frameworks. L'offre Gatsby Cloud semble tout de même en forte croissance. Il ne devrait pas y avoir trop de vendor lock-in: le Deferrerd Static Generation de Gatsby semble être une implémentation du Deferred Persistent Rendering de Netlify.
Pas mal d'améliorations importantes:
Extras:
Building an awesome image loading experience: Kent C. Dodds explique comment il gère les images sur son site, avec un placeholder inliné. Utiliser une image upscalée avec un filtre blur CSS me semble une bonne idée pour réduire la taille!
A technical breakdown of React-Three-Fiber: permet de comprendre comment créer un renderer React
React-Chicane: nouveau router React qui utilise TypeScript template literal strings pour type-checker la construction d'urls
React-Native
Sortie officielle du nouveau SDK qui était en beta la semaine dernière:
Extras:
react-native-native-runtime: permet un accès direct au runtime natif via JSI. Pas sur qu'Apple apprécie 😅
React-Native 0.67.0-RC2: j'ai comme l'impression que le cycle des releases React-Native s'accélère
rnx-kit: boite à outils pour React-Native de Microsoft
Even a company as successful as Shopify cannot make a great React Native App: critique de React-Native avec quelques discussions intéressantes. C'est vrai que niveau gestion du clavier, ça reste parfois compliqué 😅
💸 Jobs
Cajoo: Dev Fullstack - Remote - 40-75k€ (+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)
Une offre ci-dessous t'intéresse? Réponds à cet email!
Smallable: dev React senior - CDI Paris 50-60k (+ CTO)
Ask Mona: dev React confirmé - CDI Paris 45-50k (+ CTO)
Hublo: Node.js React senior - CDI Paris/remote 60-70k (+ EM)
Habx: React TS - CDI Paris - 38-50k
Ponicode: dev JS/React - CDI Paris 40-65k
Shift: dev React senior - CDI Paris/remote 50-60k
Choose: dev React-Native - CDI Paris 50-60k
Splio: dev fullstack React/NodeJS senior - CDI Paris 60-70k
F4: dev NodeJS - CDI Paris 40-50k
Aria: dev NodeJS - CDI Paris - 45-60k
HD Rain: dev backend Node.js React - CDI Toulouse 38-45k
Teester: dev frontend React - CDI Nantes 40-45k
Divers
A noter que Node.js 16 entre en active LTS aujourd'hui!
Extras:
Yarn 3.1: Corepack, ESM, pnpm, Optional Packages ...
Core Web Vitals Checker: affiche les CWV d'une url en fonction du dataset public Chrome User Experience Report
Lib Node.js compromise: ua-parser-js: un package très utilisé (transitivement) qui a pu être installé sur votre PC
vscode.dev: votre IDE préféré dans le browser
Les nouveaux DevTools de Chrome 95 (vient de sortir)
TC39: le 86eme meeting est en cours, les évolutions de proposal seront mentionnées ici