Introducing Relay Hooks

Plus how does Svelte stack up against React? |

#230 — March 17, 2021 Read on the Web React Status Your weekly React news digest, every Wednesday Introducing Relay Hooks with Relay 11.0 — Use hooks to fetch and manage GraphQL data with the most developer-friendly version of Relay yet. Relay is a framework from Facebook for building data-driven React applications in a particularly declarative way. Robert Balicki and Juan Tejada Comparing Svelte and React — After spending an extended period of time working with both, the author identifies his preference based on first hand observations supported with real-world examples. Jack Franklin React Native: How To Build Bidirectional Infinite Scroll — Learn how to implement a smooth bidirectional infinite scroll in React Native. Stream sponsor Add Voice Recognition to React Native without Adding the Cloud — Quick and easy voice recognition often depends on a cloud service for implementation. However there a lots of good reasons—security, for example—why you don't want to do it that way. Ian Lavery Integrating Google Maps in React — A thorough review of just about everything you need to know to incorporate a feature-rich mapping experience which many users simply expect these days. Pavlo Chabanenko React Clean Code Recommendations — Eight well thought out recommendations complete with code examples first showing how not to do it, followed by a new and improved version. Tyler Hawkins 💻 Jobs React Native Engineer (Remote) — Looking for devs with a passion for building mobile apps. No sprinting, no scrumming, work normal hours. CompanyCam Find Your Next Job Through Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired 📘 Tutorials and Stories ▶  How to Make It 'Rain' with CSS Animation, React, & Styled Components — Although it's not everyone's cup of tea, if you want to implement the trendy 'rain' effect for your website, this PG-13 video goes through the steps in an entertaining and logical way. Our favorite React YouTuber right now. Chris Power Creating an Outside Focus and Click Handler React Component — This tutorial recreates the react-foco component as the means of teaching these important UI concepts. Arihant Verma How I Improved My React Native App by Making It 50x Faster — Five specific recommendations for improvements that when taken together, add up to a dramatic improvement in app performance. Takuya Matsuyama An Engineering Leader's Guide to OpenTelemetry Lightstep sponsor Lazy Loading React Native Components from a Server — This is an innovative way of updating the content of your app without going through a dreaded app store update. Sarath Kumar CM The Complete Guide to useRef() and Refs in React — If you've found the official documentation for the useRef Hook a little terse, here is the missing manual for which you've been waiting. Dmitri Pavlutin 🛠 Code and Tools react-ssr-prepass: A Partial Server-Side React Renderer — By using a prepass and pausing until thrown promises are resolved, this library offers a practical way to use Suspense when implementing complex fetching logic. Formidable react-avatar 1.0: A Load, Crop and Preview Component — Here's another detail which tends to get skipped once a deadline crunch looms. Let this fully-featured component take care of it for you. Kirill Novikov A Better Way to Build Internal Tools — Build internal apps without the mundane, boring bits (wrestling with UI libraries or hacking together data sources & APIs). Retool sponsor next-sitemap: Simple Sitemap Generation for Next.js — Sitemaps quite often get skipped because they can be labour intensive to implement and maintain. Now you can automate the process. Vishnu Sankar Embla Carousel: Fluid Motion and Swipe Precision — Comes complete with the most comprehensive set of examples I've seen in a while. David Cetinkaya react-three-a11y: Accessibility for WebGL — A set of react-three-fiber components to address the requirements of an accessible user experience. Poimandres ⚡️ Quick Bits: Interesting projects which you may have missed: next-dark-mode — Drop in dark mode for Next.js. react-daterange-picker — Simple and lightweight date ranges. react-glider — Wraps the popular glider.js carousel library. react-native-input-spinner — A highly configurable component for this popular UI element. react-native-confetti-cannon — Need we say more? There's an animated GIF showing off the effect ;-)

This issue was curated by Terence C. Gannon and edited by the Cooperpress team. A Cooperpress publication. Change your email address or Stop getting this newsletter © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom