React Hebdo 17# - React, ReactNative, Gatsby, Flip, TypeScript, dark mode...

Sébastien Lorber

Jun 20, 2020

React

Josh Comeau explique comment rajouter des fonctions serverless à son site Gatsby, intégré au workflow CI Netlify (git push -> deploy).

Web Animations API (WAAPI), FLIP, React... L'auteur nous présente aussi sa lib React-easy-flip.

Ca ne fait pas de mal de le rappeler, tellement ces erreurs sont courantes:

Post intéressant de Jared Palmer qui explique pourquoi il préfère NextJS à Gatsby, avec des arguments plutôt solides.

Une issue CRA donne les raisons d'éviter l'usage de l'interface React.FC

ReactNative

Nouveau projet de galerie photo ReactNative en Reanimated 2, par un des contributeurs de la nouvelle implémentation.

Avec pager, pinch zoom...

Liste d'apps ReactNative open-source

Post bien expliqué sur la nouvelle archi React-Native

Exemple de mise en place d'une transition light<->dark mode animée en React Native avec Reanimated transitions

Shared element transitions dans react-native-navigation (Android, Kotlin au programme).

Divers

Les devices ont des spécificitées de plus en plus variées. Le design mobile-first marche dans la majorité des cas, mais c'est de moins en moins le cas. Canva raisonne en "capacity-first".

Axel Rauschmayer rend disponible gratuitement son livre au format HTML.

ECMAScript 4 (prévu pour 2008) n'a jamais été releasé. On est passé directement de ES3 a ES5. Analyse des features qu'on aurait pu avoir...

Certains disaient qu'il n'y avait pas encore grand chose de prévu pour TS4. Cette nouvelle feature change la donne. Devrait aider a typer certains usecases un peu avancés (méthode FP curry par ex).

Exemple d'utilisation de ce nouveau comment (TS 3.9) sur les tests, quand on veut vérifier que l'utilisateur utilise bien une API avec les types attendus (particulièrement les utilisateurs JS qui n'auront pas d'erreur à la compilation)

Il vaut mieux ne pas le modéliser le "color scheme" avec booléen, car d'autres valeurs sont à prévoir.

No(t) Rollup -> Nollup
Encore un nouvel outil qui propose d'améliorer l'expérience en dev.

Comments

Top New Community

No posts

#nojs-banner { position: fixed; bottom: 0; left: 0; padding: 16px 16px 16px 32px; width: 100%; box-sizing: border-box; background: red; color: white; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 13px; line-height: 13px; } #nojs-banner a { color: inherit; text-decoration: underline; } This site requires JavaScript to run correctly. Please turn on JavaScript or unblock scripts