Aller au contenu principal

📨 #123: TanStack Router, Gatsby, Remix, Next.js, React-Three-Fiber, Astro, Expo, Open Native, Rome...

· 11 minutes de lecture
Sébastien Lorber
Sébastien Lorber
Editeur - Mainteneur de Docusaurus

Salut à tous !

C'était la Jamstack Conf cette semaine, et on a eu quelques annonces sympa pour l'occasion, comme Tanstack Router, Gatsby 5 ou les résultats de leur sondage annuel.

Expo sort son superbe SDK 47. La 1ère release-candidate React-Native 0.71 conduit à quelques soucis de build Android sur des versions précédentes 😅.

Next.js et React-Native utilisent maintenant TypeScript par défaut sur les nouvelles apps.

Dernière chance pour acheter le cours Three.js Journey avec le code promo TWIR (-30%, expire demain). Il vient d'être upgradé avec 24h de modules pour faire de la 3D avec React-Three-Fiber. J'en profite pour mettre en avant le blog de Maxime Heckel qui a suivi le cours l'année dernière et est maintenant capable de faire de la 3D assez cool! Il vient justement de sortir un article sur les particules.

💡 Consulter cette newsletter sur Twitter - format visuel 🎨

Pour me soutenir:

Ne manque pas le prochain email !

    💸 Sponsor​

    Sizzy - le navigateur pour les développeurs

    Les professionnels de tous les autres secteurs d'activité disposent d'outils spécialisés, mais les développeurs Web sont toujours obligés d'utiliser le navigateur que leur grand-mère utilise pour faire ses courses sur Amazon ?

    Si vous ouvrez localhost:3000 dans un autre navigateur que Sizzy, vous perdez des heures de votre temps précieux.

    Avant Sizzy: le développement web vous stresse, le responsive design est difficile, vous avez une quantité écrasante d'onglets et d'applications ouverts.

    Après Sizzy: tous les outils dont vous avez besoin sont au même endroit, le responsive design est un jeu d'enfant, plus de changement de contexte.

    Vous pouvez le télécharger ici et l'essayer gratuitement pendant 14 jours !

    ⚛️ React​

    TanStack Router

    TanStack Router

    Tanner dévoile son nouveau projet: un routeur 100% typesafe, et framework-agnostic. Une liste de features impressionnantes, dont:

    • URL State Management
    • Built-in Caching
    • Search Param Schema/Validation
    • Auto Prefetching
    • Loaders/Actions
    • Async Elements + Code-Splitting

    A première vue, on dirait qu'il y a pas mal d'inspirations venant de Remix ou React-Router, mais l'API est assez différente et ne repose pas sur du JSX, ce qui doit aider pour rendre la solution agnostique et typesafe. Pour l'instant il y a seulement l'adapter React, et la doc est incomplète, mais cela semble assez prometteur!

    🔗 Liens utiles:

    • 🐦 Tanner Linsley lance son projet sur Twitter avec un super trailer!
    • 🐦 Ryan Florence pourrait s'inspirer de son travail pour rendre Remix plus typesafe

    Gatsby 5: The Fastest Gatsby Yet

    Gatsby 5: The Fastest Gatsby Yet

    Gatsby 5.0 vient officiellement de sortir de beta. On y retrouve la Gatsby Slice API qui permet d'améliorer les temps de build lors d'une modification d'un élément de layout (header, footer...), et le support en beta des Server Components qui permettent de supporter l'hydratation partielle. Il y a aussi de nouveaux composants Head/Script, GraphiQL v2.

    Gatsby a aussi présenté Valhalla, un nouveau service sur leur cloud qui propose d'utiliser les plugins source de Gatsby pour créer un content hub et une API unifiée GraphQL découplée de Gatsby. Il est donc possible d'utiliser Valhalla avec Next.js.

    Les générateurs de site statiques n'ont pas trop la côte en ce moment. Pour autant un site statique convient toujours pour plein de sites, je trouve ça bien qu'au moins un gros acteur continue d'innover dans le domaine. L'API Slice est une bonne idée. J'aurais aimé que Valhalla puisse tourner localement, mais je crois que c'est un service cloud uniquement.

    🔗 Liens utiles:

    React Router-ing Remix

    React Router-ing Remix

    De nombreuses data APIs de Remix ont été ajoutées dans React-Router 6.4, et bien plus encore. Maintenant c'est au tour de Remix de reposer officiellement sur ces nouvelles APIs de React-Router. L'upgrade se fera en 4 étapes incrémentales et rétrocompatibles livrées dans Remix v1.x avec des feature flags. La vision est de faire en sorte que Remix v2 soit un compiler pour React-Router 6.4.

    🔗 Liens utiles:

    Ne manque pas le prochain email !

      💸 Sponsor​

      Premier octet - Agence de développement React

      Premier Octet - Agence de développement React

      Premier Octet est une agence de développement d'applications web et mobile. Depuis 2008, nous accompagnons de nombreux clients grâce à notre expertise en React et React Native.

      Plus concrètement, nous intervenons en développement, conseil, audit ou formation, sur des thématiques JavaScript serveur et front. Nos projets embarquent des technologies open source telles que :

      • Next.js
      • Nest.js
      • ChakraUI
      • NativeBase
      • Strapi

      N'hésitez pas à aller voir notre site premieroctet.com pour plus d'informations !

      📱 React-Native​

      Expo SDK 47

      Expo SDK 47

      Le nouveau SDK 47 vient de sortir officiellement, avec un article plus détaillé sur les nouveautés.

      • React Native 0.70.5 et React 18.1.0
      • Expo Modules API 1.0 permet de créer très facilement des modules natifs Fabric en Swift/Kotlin
      • Hermes disponible sur Expo Go iOS, experience de debugging simplifiée. Hermes sera le moteur par défaut dans le prochain SDK
      • Support de Fabric dans plusieurs modules Expo
      • Expo Router en beta: le file-system routing pour React-Navigation
      • Diverses améliorations EAS: sécurité end-to-end, M1 workers...

      Bref, une très belle release! Avec Expo Modules, cela semble plus simple d'adopter la nouvelle architecture par rapport aux outils officiels comme react-native-codegen qui ne supporte pas encore Swift.

      🧑‍💻Jobs​

      🧑‍💼 Matters - Senior Software Engineer (React/Node)

      Envie de challenges et de contribuer à des réussites entrepreneuriales ? Rejoins notre startup studio pour construire des produits variés et complexes dans une culture devOps, une stack JS, des code reviews, tests et déploiements automatisés. Paris, remote flexible, 50K€-65K€.

      🧑‍💼 Linxea - Lead Dev React.js - 60-75k€

      Plateforme leader de l’épargne en ligne. Stack tech : ReactJS, Redux, Saga, Formik, Storybook, Webpack, Typescript. Skills : architecture, développement, pratiques craft (clean architecture, clean code ,TDD), mentoring et formation des équipes. Paris 75008 - 2j de TT/sem.

      🧑‍💼 Masteos - Lead ReactJS - Hybride ou Remote - 75-90k€

      Masteos réinvente l’expérience de l’investissement locatif, en proposant un parcours entièrement dématérialisé et un accompagnement de haut niveau aux particuliers qui souhaitent acheter un bien pour le louer.

      💡 Comment publier une offre d'emploi ?

      🇫🇷 En français​

      💡Tu peux m'envoyer ton contenu: sebastien@thisweekinreact.com !

      🔀 Autre​

      🤭 Fun​

      Last weekend be like - small React-Native 0.71 domino falls larger React-Native dominos of previopus releases

      Pour encore plus de fun, ce nouveau thread Twitter répertorie toutes mes trouvailles. Beaucoup n'ont jamais été publiées dans la newsletter.

      This Week In React - Fun Thread


      Ne manque pas le prochain email !