--- title: "A journalist considers the rise of React" publication: "React Status" issue: 191 published_at: "2020-06-03" canonical_url: "https://react.statuscode.com/issues/191" --- ⚛️ This week's React news, links, and libraries #191 — June 3, 2020 [Read on the Web](https://react.statuscode.com/issues/191) 🖤 It's [time to speak up](https://auth0.com/blog/its-time-to-speak-up/), [donate](https://pitchfork.com/thepitch/resources-in-the-fight-against-police-brutality-and-systemic-racism/) or even just [stream a fundraising video](https://www.youtube.com/watch?v=bCgLa25fDHM), because Black Lives Matter. Our thoughts are with everyone fighting for these causes. We've also donated to the Stephen Lawrence Charitable Trust and the NAACP. React Status Your weekly React news digest, every Wednesday [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/kuat2uxtrhudrp7lqxnf.jpg)](https://twitter.com/dan_abramov/status/1267544361929256966) [The React Core Team Joins The Facebook Employee Walkout](https://twitter.com/dan_abramov/status/1267544361929256966) — _“Facebookʼs recent decision to not act on posts that incite violence ignores other options to keep our community safe.”_ The React team specifically suggests [the Equal Justice Initiative](https://support.eji.org/give/153413/#!/donation/checkout) as a target for your support. Dan Abramov on Twitter [Analyzing the Performance of Notion's Electron App](https://3perf.com/blog/notion/) — A fascinating deep dive into analyzing the performance of a desktop packaged React app for a popular note taking service and some basic optimizations that can be done. Ivan Akulov [![\](https://copm.s3.amazonaws.com/e30f7dd6.png)](https://buildkite.com/case-studies/shopify?pk_campaign=reactstatus-200603&pk_source=cp-reactstatus&pk_medium=newsletter) [Scale Your Software Projects Without Losing Speed](https://buildkite.com/case-studies/shopify?pk_campaign=reactstatus-200603&pk_source=cp-reactstatus&pk_medium=newsletter) — See how Shopify used Buildkite CI/CD to scale from 300 to 1800 engineers while keeping build times under 5 minutes. Buildkite sponsor [The Rise of React (And Its Growing Pervasiveness)](https://increment.com/frontend/the-rise-of-react/) — In the most recent issue of [Increment](https://increment.com), a noted journalist (_for WIRED and The Economist_) takes a wide-angle look at how React came to be one of the predominant frontend frameworks powering today’s web and the attendant implications ― both positive and negative ― for the future. Chris Stokel-Walker (Increment) [React Tutorials Now on The Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started) — While it may be the world does not need more generic React tutorials, when an industry heavyweight decides to jump in it’s still newsworthy. We’re impressed by what we see in MDN’s _Getting Started with React_ tutorial, for example. Mozilla Developer Network [Reparenting is Now Possible with React](https://t.co/MnRIELoPlj) — The popular and compelling UI artefact of dragging-and-dropping often requires reparenting which―according to renown React authority Dan Abramov― “[there are no plans](https://twitter.com/dan_abramov/status/1092073382470918144)”. But here’s a solution which will deliver most of what you need. Paolo Longo 💻 Jobs [Find A Job Through Vettery](https://www.vettery.com/tech?utm_source=newsletter&utm_medium=cooper-reactstatus&utm_term=tech&utm_content=grouped&utm_campaign=ad-77585) — Vettery specializes in tech roles and is completely free for job seekers. Create a profile to get started. Vettery [Senior Software Engineer — Save Lives & Make an Impact](https://apply.workable.com/crisistextline/j/12DB87896B/) — We use Node/TS/React & ML to provide crisis support via SMS. Help us scale globally with a focus on privacy and security. Crisis Text Line ℹ️ _Interested in running a job listing in React Status? There's [more info here.](https://booking.cooperpress.com/jobs)_ 📘 Tutorials and Stories [Building Reusable React Components Using Tailwind](https://www.smashingmagazine.com/2020/05/reusable-react-components-tailwind/) — Ways to build reusable React components using the popular utility-first CSS framework Tailwind. Tilo Mitra [How to Deploy a React App on AWS Using the AWS CDK](https://medium.com/dailyjs/how-to-deploy-a-react-app-on-aws-using-the-aws-cdk-d7970033950f?source=friends_link&sk=3163ac4d874e029f5491fc4be4cac698) — The AWS [Cloud Development Kit](https://aws.amazon.com/cdk/) enables Amazon’s cloud infrastructure to be provisioned with programming languages you likely already know. Here’s an end-to-end, real-world, well-illustrated walkthrough which uses the CDK to deploy a sample React app on the popular cloud platform. Andrew Bestbier [How to Add Search to a React App with Fuse.js](https://www.freecodecamp.org/news/how-to-add-search-to-a-react-app-with-fuse-js/) — Don’t know exactly that for which you are looking? Then your React app could benefit from [fuzzy search](https://en.wikipedia.org/wiki/Fuzzy_matching_%28computer-assisted_translation). This tutorial goes through a simple example using the well-regarded, lightweight, dependency-free [Fuse.js](https://fusejs.io) library. Colby Fayock [Check Out the Top Productivity Tips of 25 React Experts](https://www.telerik.com/kendo-react-ui/react-best-practices-and-productivity-tips/?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-blog-productivity-tips-pp&utm_content=brieflink) Progress KendoReact sponsor [Four Ways to Conditionally Render in React](https://t.co/kKhLG9dyL5) — For many developers, effective UI design means only showing those things which the user wants or needs to see based on certain conditions. Here’s an overview of four ways to control what gets seen and what doesn’t. Piero Borrelli ▶[Let's Build an Image Classifier with Node, Tensorflow and React](https://www.youtube.com/watch?v=ZfuUwdFNU-s) — The chilled out background music makes this feel like a spa experience but.. there is something genuinely quite nice about this screencast. Tim Tam [React Hooks: Now What Do I Do?](https://medium.com/expedia-group-tech/react-hooks-now-what-do-i-do-a30a70f216c3) — So you’ve been through the official [documentation on React Hooks](https://reactjs.org/docs/hooks-intro.html). You _think_ you understand the concept. It all seems to make sense. But what’s lacking is an integrated, holistic feel for how they are best employed. This article pulls it all together. David Polites (Expedia) 🔧 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/qteldkcadysrfyex4qms.jpg)](https://windups.gwil.co/) [Windups: A Typewriter Effect for React](https://windups.gwil.co/) — You can control the speed, trigger animations/sounds, etc. [GitHub repo.](https://github.com/sgwilym/windups) Sam Gwilym [Hooked On Redux: The Power of Redux Made As Simple as the useState Hook](https://hooked-on-redux.js.org/) — For many developers, effective UI design means only showing those things which the user wants or needs to see based on certain conditions. Here’s an overview of four ways to control what gets seen and what doesn’t. Harry Hope [Building Chat With React? Stream Chat Has You Covered](https://getstream.io/chat/react-chat/tutorial/?utm_campaign=react_status&utm_medium=promoted_newsletter&utm_source=react_status_promoted) — Have a look at our interactive chat tutorial in React and learn how to build with Stream Chat. Stream sponsor [Is It Time to Add Maps to Your React App with react-geo?](https://github.com/terrestris/react-geo#react-geo--) — There is a lot of demand for map-enabled apps and [react-geo](https://github.com/terrestris/react-geo) from [Terrestris](https://www.terrestris.de/en/) provides a complete [feature set](https://github.com/terrestris/react-geo/wiki/Feature-List) to get you going. We particularly like the [workshop](https://terrestris.github.io/react-geo-ws/) they have put together. Terrestris [style9: A CSS-in-JavaScript Compiler Inspired by Stylex](https://github.com/johanholmerin/style9) — Facebook’s [stylex](https://www.youtube.com/watch?v=9JZHodNR184) was a response to the demanding requirements of richer, more interactive content. Taking its cue from that, _style9_ features compilation to atomic CSS, typed style using [TypeScript](https://www.typescriptlang.org) and font-size conversion to [REM units](https://www.sitepoint.com/understanding-and-using-rem-units-in-css/). All that and no selectors! Johan Holmerin [Two More 'Cool' Components](https://github.com/wellyshen) — Back in [early May](https://react.statuscode.com/issues/187) we covered Welly’s [Cool Inview](https://github.com/wellyshen/react-cool-inview) hook. We were impressed. But Welly has been one busy guy and has just rolled out updates to [Cool Img](https://github.com/wellyshen/react-cool-img) and [Cool Dimensions](https://github.com/wellyshen/react-cool-dimensions). What can we say but…cool. Welly Shen [Caldera: A Server-Side Execution Environment for React](https://github.com/calderajs/caldera-react) — Ever wondered how two separate web app clients can update the same data in real time? There has _got_ to be some magic must be happening server-side. That’s exactly what Caldera promises: _all_ the logic runs on the server and real-time updates are sent out to the client. Not possible you say? Check out the [examples](https://github.com/calderajs/caldera-react-examples). CalderaJS This issue was curated by Terence Gannon and edited by Peter Cooper and Chris Brandrick. 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