#184 — April 15, 2020 |
Profiling React.js Performance — Goes into detail on aspects of the React Profiler API, React’s new experimental Interaction Tracing API, and measuring custom metrics using the User Timing API. Addy Osmani |
How to Style Your React Apps with Tailwind CSS and Styled Components — Tailwind CSS is a popular CSS framework and this tutorial demonstrates using it along with Styled Components to create a form component in a React app without writing any CSS, as such, at all. Ibrahima Ndaw |
Retool: Build Internal Tools a Lot Faster, with Less Maintenance — Ship in hours, not days. Retool provides UI building blocks that connect to any DB and API so you can focus on what matters. Hackable by design — you can use JavaScript anywhere, write your own custom React components and query JSON with SQL. Retool sponsor |
33 Line 'React' — Sure, React does some useful things, but you can do the same things with very little code, so.. why not? A fun experiment that is unlikely to replace React! 😄 Also of interest is that Hacker News had its say and the author responded. Oliver Russell |
A Tour of Creating a 'Gauge' in React — A very neatly presented walk through of what it takes to build a ‘gauge’ in React, an on-page animated component kind of like an odometer. Amelia Wattenberger |
💻 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 |
React Developer at X-Team (Remote) — Join X-Team and work on projects for companies like Riot Games, FOX, Coinbase, and more. Work from anywhere. X-Team |
📘 Tutorials and Stories |
How to Build a Todo App using React and Firebase — Before you say “not another to-do list tutorial!”, it’s less common to see Firebase being used, and learning how to integrate with that could be of value to you. Sharvin Shah |
Why You Should Keep Faith with React Native — Is React Native dead? Maybe according to some. But the fact is that React Native is about to receive a whole lot of new features and upgrades this year. Zain Sajjad |
Let's Build a Financial Dashboard App with React (Free Webinar) — On April 23, TJ VanToll will stream a 45-minute live session building a stock portfolio app with React. Save your seat. Progress KendoReact sponsor |
The Algebraic Structure of Functions, Illustrated using React Components — This is one of those “let’s look at something familiar but from a different angle” articles. There’s nothing new here except, perhaps, perspective. James Sinclair |
Stop Using Client-Side Route Redirects — To be honest, this might not be something you’re doing anyway. Kent C Dodds |
Effective Code Splitting in React: A Practical Guide — Some techniques on implementing code-splitting, or breaking your code into modular bundles for better performance, in React projects. hackernoon |
Build Your Own React — Just wanted to revisit this if you want something really meaty to work on during the lockdown. It’s a well presented walkthrough of creating your own React-a-like from scratch. You’ll need some time set aside to follow along. It’s more advanced than the 33 line React-a-like we posted above. Rodrigo Pombo |
Building and Styling Tables with react-table v7 — Creating tables with React can be a pain. react-table v7 provides a modern, Hooks-based API that helps us create tables in React with little hassle. John Au-Yeung |
▶ Mapping with React Leaflet — A brief Egghead screencasts collection. Colby Fayock |
Our Tech Skills Platform Is Free for the Month of April. Start Today Pluralsight sponsor |
🔧 Code and Tools |
react-tater: Add Annotations to Any Element on a Page — Why ‘tater’? (Anno)tater, apparently 😄 Here’s a live demo where you can create your own such annotations or take a tour. Jo Sprague |
snake-cubed: A New, React-Based Spin on the Classic Game of 'Snake' — Imagine Snake but in 3D and within a cube environment. I can’t get my head around the controls, but you can play it here if you like. A fun project to learn react-three-fiber. Paul Mendoza |
Preact 10.4.0: The Fast 3KB React Alternative (With The Same API) — “This release contains some very amazing improvements to hydration and to performance when memoized vnodes are used. We recommend everyone to upgrade.” Preact |
React Intl: Internationalization (i18n) for React Apps — Components and an API to format dates, numbers, and strings, including pluralization and handling translations. Now part of the broader Format.js effort too. Yahoo Inc |
React PDF Viewer: A React Component to View PDF Documents Phuoc Nguyen |
react-virtualized-tree: A Virtualized Tree View Component Built on react-virtualized Diogo |