Avoiding those code smells
#248 — July 21, 2021
Adobe’s Efforts in Creating an Accessible Autocomplete Experience for React Spectrum — Adobe is placing a very high priority on accessibility in the Spectrum design system. That is judging by the time, effort and thought they have put into making a ubiquitous combo-box easier to use for everybody.
Daniel Lu
Five Code Smells React Beginners Should Avoid — About to pull the trigger on your first big pull request for a high profile project? You should probably go through this checklist first.
Jason Lee Hodges
React Authentication, Simplified — Authentication is one of those things that just always seems to take a lot more effort than we want it to. In this article, we lay out a different approach to authentication (plus access control & SSO) in React applications.
Userfront sponsor
Remotion 2.2: ‘Write Videos’
in React — In case you missed it back in February when we featured Remotion, it’s a pretty exciting way to work with video using the React concepts and constructs you know and love. “If you know React you can make videos.”
Jonny Burger
Create a Fullstack Next.js App with Authentication, Data and Storage — How can you build a full-stack application with what is ostensibly a front-end framework? Spoiler alert: It involves AWS Amplify.
Ali Spittel
Introducing the New Overlay Hooks for Ionic React — Although V6 is already out in beta, these new hooks in V5.6 will give you better, more natural control over UI elements such as alerts, modals and pop-ups.
Ely Lucas
Jobs
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.
X-Team
Front-End Developer – Utrust (Remote, GMT -2/+4) — We are changing the world with crypto. Join our team, working with technologies such as React, Redux, GraphQL and TypeScript.
Utrust
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.
Hired
What’s the Difference Between Controlled and Uncontrolled Components in React? — A very quick and precise differentiation between these two broad categories of components.
Alyssa E. Easterly
How to Stop Re-Rendering Lists in React
Alex Sidorenko
▶ How to Setup and Deploy React 18 Alpha Using Snowpack & Vercel
Deji Adesoga
How to Parse Markdown in Next.js
Flavio Copes
🛠 Code and Tools
use-smartcrop: Content Aware Image Cropping Hook — A React wrapper for smartcrop.js and color-thief which algorithmically predicts good crops for images.
Flyyer
useCookieConsent — The prompts encouraged by certain interpretations of the GDPR data protection rules are everywhere these days; this hook could make implementing them and being compliant with the rules more straightforward.
Antoni Silvestrovič
How to Implement a React Data Grid in 16 Minutes: Video Tutorial
Progress KendoReact sponsor
React Tags — A tagging component ready to use in your React projects and inspired by Gmail’s To field functionality.
Prakhar Srivastav and Aakansha Doshi
Bulletproof React: An Architecture for React Apps — Using a group chat application as the case study, the author touches on every significant aspect of building and deploying a React application which will make it “bulletproof” and therefore production ready. Note, however: “This is not supposed to be a template or a framework. It is an opinionated guide that shows how to do some things in a certain way.”
Alan Alickovic
React Wavify — A UI component which incorporates the physics of real waves configured by a series of parameters. It’s pleasantly soothing to watch.
Jaxson Van Doorn
⚡️ Quick Bits:
react-letter — Embed HTML email content into your app.
react-hook-form-persist — A storage agnostic persistance hook to go with React Hook Form.
react-color-palette — Lightweight color picking component, now in its sixth major release.
auth0-react — Add Auth0 (the popular commercial authentication service) to a React single page application (SPA).
