Taking an idea from Figma to final React app
#263 — November 3, 2021
React Conf 2021: It’s Online, It’s Free, and on December 8 — With the ongoing realities of COVID and travel restrictions, React Conf heads online and takes place on December 8 and 6PM GMT (with a ‘replay event’ on December 9 at 6:30AM GMT). No hotels or expensive tickets needed, and a great lineup of speakers, makes it an easy sell.
On Building an Effective Image Component for Next.js — The story of an out-of-the-box solution to optimize images for Next.js. It optimizes loading, compression and responsiveness. Now with AVIF support in Next.js 12.
Sohoni, Erickson, Castle
How to Diagnose and Fix Errors Caused by Memory Pressure — Understanding the memory pressure leading up to a crash and the device’s overall memory health is critical for debugging with speed and precision. Read our blog to learn how to prioritize and fix Android errors caused by memory pressure in React Native apps.
▶ From Figma to GitHub Using Anima — We received such a positive response to Ania’s Candy Crush tutorial in 262, we’re happy to feature another screencast: this time, taking an application from design in Figma all the way through to a functional React app.
A Next.js 12 Perf Test: Builds Slower, Not Faster? (On Windows, At Least..) — Last week we featured the Next.js 12 release which boasted improved build speeds. Tom’s initial experiments show a confused picture, but community speculation is this issue is Windows specific.
A Quick Intro to Elm for React Developers — Elm is a functional language aimed at frontend development work (and which has many ardent fans!) but it’s conceptually different enough to what you might be used to working with that an introductory post like this could be useful.
Senior Web Developer (Node/ReactJS) – Remote — Millions get inspired and plan adventures with our apps. To help us make komoot.com the place to go to plan outdoor adventures, we’re looking for a one of a kind Web Developer to join our team.
React Developer at X-Team (Remote) — Join the most energizing community for developers and work on long-term projects for Riot Games, FOX, Sony, Coinbase, and more.
Find React Jobs with Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It’s free for job-seekers.
Toward Hermes Being the Default JS Engine in React Native — Facebook (or is that Meta now?) is taking steps to making Hermes, its mobile-focused JS engine, the default engine for React Native.
File-Based Routing with React Router
How to Add a Contact Form to a React App with Netlify Forms
Seven YouTube Channels for Learning React Techniques
How to Generate Beautiful PDFs with React and Puppeteer
🛠 Code and Tools
React Awesome Query Builder — Taking inspiration from the jQuery QueryBuilder and employing Ant Design for its widgets, this component can make building complex logical queries or searches easier for your app’s users.
Chakra UI: A Modular Component Library for React — A set of WAI-ARIA-enabled, themeable components for building React apps. v1 upgrades to React 17 and Emotion 11, there’s also now a component theming API.
Progress KendoReact sponsor
timeago-react: Component to Format ‘xxx time ago’-Style Strings — For example, if you provide a date/time that was three hours ago, you’d get ‘three hours ago.’ Demos.
João Pedro Schmitz
Reactive CRDT — Ever wonder how those collaborative editing apps work? There’s a pretty good chance it’s CRDT such as implemented in Yjs. Open their demo in two browser windows and add something to the to-do list.
⚡️ Quick Bits:
React Native SQLite 2 — Despite the name, it’s SQLite3 for your React Native applications.
React Upload Gallery — Upload images and display them so they can be selected for further processing by your application.
react-native-pdf — All the cross-platform PDF viewer functionality you’re likely to need.