Movatterモバイル変換

#191 — June 3, 2020

Read on the Web

🖤 It'stime to speak up,donate or even juststream a fundraising video, 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.

The React Core Team Joins The Facebook Employee Walkout —“Facebookʼs recent decision to not act on posts that incite violence ignores other options to keep our community safe.” The React team specifically suggeststhe Equal Justice Initiative as a target for your support.

Dan Abramov on Twitter

Analyzing the Performance of Notion's Electron App — 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

Scale Your Software Projects Without Losing Speed — See how Shopify used Buildkite CI/CD to scale from 300 to 1800 engineers while keeping build times under 5 minutes.

Buildkitesponsor

The Rise of React (And Its Growing Pervasiveness) — In the most recent issue ofIncrement, 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 — 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’sGetting Started with React tutorial, for example.

Mozilla Developer Network

Reparenting is Now Possible with React — 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”. But here’s a solution which will deliver most of what you need.

Paolo Longo

💻 Jobs

Find A Job Through Vettery — 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 — 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

📘 Tutorials and Stories

Building Reusable React Components Using 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 — The AWSCloud Development Kit 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 — Don’t know exactly that for which you are looking? Then your React app could benefit fromfuzzy search. This tutorial goes through a simple example using the well-regarded, lightweight, dependency-freeFuse.js library.

Colby Fayock

Check Out the Top Productivity Tips of 25 React Experts

Progress KendoReactsponsor

Four Ways to Conditionally Render in React — 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 — 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? — So you’ve been through the officialdocumentation on React Hooks. Youthink 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

Windups: A Typewriter Effect for React — You can control the speed, trigger animations/sounds, etc.GitHub repo.

Sam Gwilym

Hooked On Redux: The Power of Redux Made As Simple as the useState Hook — 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 — Have a look at our interactive chat tutorial in React and learn how to build with Stream Chat.

Streamsponsor

Is It Time to Add Maps to Your React App with react-geo? — There is a lot of demand for map-enabled apps andreact-geo fromTerrestris provides a completefeature set to get you going. We particularly like theworkshop they have put together.

Terrestris

style9: A CSS-in-JavaScript Compiler Inspired by Stylex — Facebook’sstylex 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 usingTypeScript and font-size conversion toREM units. All that and no selectors!

Johan Holmerin

Two More 'Cool' Components — Back inearly May we covered Welly’sCool Inview hook. We were impressed. But Welly has been one busy guy and has just rolled out updates toCool Img andCool Dimensions. What can we say but…cool.

Welly Shen

Caldera: A Server-Side Execution Environment for React — Ever wondered how two separate web app clients can update the same data in real time? There hasgot 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 theexamples.

CalderaJS