--- title: "Better toast for React" publication: "React Status" issue: 250 published_at: "2021-08-04" canonical_url: "https://react.statuscode.com/issues/250" --- Plus a new Recoil release, looking out to space, and a way to do 3D visualizations of large geospatial data sets. | #​250 — August 4, 2021 [Read on the Web](https://react.statuscode.com/issues/250) React Status ⚛️ _Your weekly React news digest, every Wednesday_ [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/rkshnnudcytubcp6t6za.jpg)](https://react-hot-toast.com/docs/version-2) [What’s New in React-Hot-Toast 2.0](https://react-hot-toast.com/docs/version-2) — [React Hot Toast](https://react-hot-toast.com/) is a popular React on-page notifications system. Although the opportunity to customize the notifications in the new release chips away at the original ‘toast’ metaphor, there’s a lot of configurability in the new version that will prove valuable for many. It also has better accessability and a custom renderer. [GitHub repo](https://github.com/timolins/react-hot-toast). Timo Lins [Gatsby Serverless Functions and the International Space Station](https://www.smashingmagazine.com/2021/07/gatsby-serverless-functions-international-space-station/) — Many eyes have been on reaching space lately, but Paul Scanlon is busy looking at the ISS and how to put together an app for tracking its position on a 3D globe using React, Three.js, and a serverless platform called [Gatsby Functions](https://www.gatsbyjs.com/docs/reference/functions/). Paul Scanlon [![\](https://copm.s3.amazonaws.com/ca9281ca.png)](https://cloud.hasura.io/?utm_campaign%3Dreact-weekly%26utm_medium%3Demail%26utm_source%3Dnewsletter&sa=D&source=editors&ust=1627914400626000&usg=AOvVaw0d6TaV47cAN9BC8QXOv67w) [Get a GraphQL Backend Without Building One - Instant GraphQL API in 30 Seconds](https://cloud.hasura.io/?utm_campaign%3Dreact-weekly%26utm_medium%3Demail%26utm_source%3Dnewsletter&sa=D&source=editors&ust=1627914400626000&usg=AOvVaw0d6TaV47cAN9BC8QXOv67w) — Point Hasura at your databases & get realtime GraphQL APIs with authz instantly. No need to build, operate & scale a GraphQL server. Loved by devs and downloaded over 250M times — making it the fastest growing open source GraphQL service. [Get Started in 30s](https://cloud.hasura.io/?utm_campaign%3Dreact-weekly%26utm_medium%3Demail%26utm_source%3Dnewsletter&sa=D&source=editors&ust=1627914400626000&usg=AOvVaw0d6TaV47cAN9BC8QXOv67w). Hasura sponsor [Recoil 0.4.0 Released](https://github.com/facebookexperimental/Recoil) — Another couple of months in the inexorable march to its first official release, there is a new preliminary release of Recoil, an experimental state management library for React apps being built by a team at Facebook (not the React team itself, notably). There’s a couple of new features and a number of [bug fixes and optimizations](https://github.com/facebookexperimental/Recoil/releases/tag/0.4.0). Facebook Experimental [How We Reduced Next.js Page Size by 3.5x and Achieved a 98 Lighthouse Score](https://papyrus.dev/@PapyrusBlog/how-we-reduced-next.js-page-size-by-3.5x-and-achieved-a-98-lighthouse-score) Colin Armstrong [Build a React App with Authorization and Authentication (with AWS Amplify)](https://welearncode.com/auth-react/) — Another of Ali’s signature, well-thought-out tutorials. We have parenthetically added that it makes use of [Amplify](https://aws.amazon.com/amplify/), AWS’s scalable mobile app development platform. Ali Spittel Jobs [Senior Software Consultant - React.js (100% Remote US & Canada)](https://testdouble.recruiterbox.com/jobs/fk0uj24/) — We're a growing employee-owned engineering consultancy on a mission to improve the way the world builds software. We focus on reducing technical debt, writing maintainable code, and mentoring some of the best teams in tech. TestDouble [React Developer at X-Team (Remote)](https://x-team.com/remote-react-developer-jobs/?utm_source=cooperpress&utm_medium=email-ad&utm_campaign=cooperpress-react&utm_content=react) — Join the most energizing community for developers and work on long-term projects for Riot Games, FOX, Sony, Coinbase, and more. X-Team [Find React Jobs with Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-reactstatus%29&utm_content=find-your-next-job) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired [Building a React State Validation Hook using Yup](https://www.sandipmane.dev/react-state-validation-hook-using-yup) — 'Yup' is a JavaScript schema builder for value parsing and validation. Define a schema, transform a value to match, validate the shape of an existing value, or both Sandip Mane [Testing React Native Apps](https://semaphoreci.com/blog/testing-react-native-apps) — Some quick practical examples of bringing automated tests to an app. Zain Sajjad [Running a Next.js Site on Cloudflare Pages](https://opstrace.com/blog/nextjs-on-cloudflare) Patrick Heneise [How to Make Your React App a Progressive Web App (PWA)](https://arndom.hashnode.dev/how-to-make-your-react-app-a-progressive-web-app-pwa) Nabil Alamin [Creating a Custom Context Menu Component Using React Hooks](https://t.co/cVex02PIsY?amp=1) Anand Simmy [React Native Responsive Scaling on the Web](https://mmazzarolo.com/blog/2021-07-31-react-native-responsive-scaling-on-the-web/) Matteo Mazzarolo [Create a Simple Lightbox in React](https://t.co/FraPZTnXRw?amp=1) Kevin Van Ryckegem 🛠 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/sgnz43bbxztw2t5nerx8.jpg)](https://github.com/developit/htm) [HTM 3.1.0: A JSX Alternative using Standard Tagged Templates](https://github.com/developit/htm) — This clever library has been around a few years but continues to see updates. Think JSX-style syntax but in plain JavaScript (using tagged templates) that requires _no transpilation_ but still supports things like rest spread and referencing components. Jason Miller [react-tracking 9.0: Declarative Tracking for React Apps](https://github.com/nytimes/react-tracking) — I’m a big fan of their crosswords, but the NY Times puts out a lot of code too. The New York Times [Beyond `onClick`: Handling Events in React](https://go.lightstep.com/register-beyond-onclick-guide-co21?utm_campaign=react&utm_source=cooper&utm_medium=Email) Lightstep sponsor [deck.gl: Simplify Visualization of Large Geospatial Data Sets](https://github.com/visgl/deck.gl) — A complete set of facilities for rendering, picking and highlighting geospatial data which also has ready-to-go integrations for major basemap providers. Also has a [React-specific tutorial](https://github.com/visgl/deck.gl/blob/master/docs/get-started/using-with-react.md). Vis.gl [Evergreen: Mature UI Framework Implementing Segment's Design System](https://github.com/segmentio/evergreen) — We first covered Evergreen v4 [back in 2018](https://react.statuscode.com/issues/119) when we reported it was a “_suite of polished React components_”. V6 is just out, and major improvements necessitated some breaking changes. Also this recently released, [succinct tutorial](https://t.co/iUXbYLvHbZ?amp=1) will help get you started. Segment [CKEditor WYSIWYG Editor for React](https://github.com/ckeditor/ckeditor4-react) — A popular robust WYSIWYG editor (which is both GPL and commercially licensed) ready to integrate with your application, as illustrated with the [demo](https://ckeditor.com/docs/ckeditor4/latest/examples/react.html#/). CKEditor [Windy: A React UI Kit Based on Tailwind](https://github.com/webeetle/windy) — Fans of [Tailwind](https://tailwindcss.com) now have an entire UI kit based on it at their disposal. weBeetle ## ⚡️ Quick Bits: - [Filemanager](https://github.com/OpusCapita/filemanager) — Minimize the learning curve by implementing a file browsing experience based on the one the user already knows. - [react-country-region-selector](https://www.npmjs.com/package/react-country-region-selector) — Outsource the whole problem of knowing which regions relate to which countries. - [rc-queue-anim](https://github.com/react-component/queue-anim) — Animate React components in a queue. This issue was curated by Terence C. Gannon and edited by the Cooperpress team. A **[Cooperpress](https://cooperpress.com/)** publication. [Change your email address](https://react.statuscode.com/edit_subscription/*|UID|*) or[Stop getting this newsletter](https://react.statuscode.com/leave/*|UID|*) © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom