Putting React on Rails
🇺🇦 #285 — April 20, 2022
How to Create a Modern CRUD App with Ruby on Rails and React — A thorough, and newly updated, tutorial covering building a fully functional CRUD app with Rails 7, SQLite, esbuild, React 18, hooks, React Router, and more. An ideal guide if you want to get a feel for all the moving parts involved in such an app.
📅 Upcoming ‘The State of React’ Meetup — A panel of React 18 working group members, contributors, and React library authors including the opportunity to ask questions live! This online conference is coming up on the 26th, so you’ll need to register soon if you want to attend.
This Dot Media
Headless CMS with World-Class TypeScript Support — Kontent handles all your content management. Streamline your code using TypeScript SDK, CLI, Rich Text resolver, and strongly typed Model Generator and scale with no problems when your project grows. Have you seen our UI?
Kontent by Kentico sponsor
A Quick Guide to Mitosis: Why You Need It and How You Can Use It — Forget cell division.. this Mitosis gives you code division, essentially letting you write components once and then letting you use them in React, Vue, Solid, Angular, and elsewhere.
react-redux 8.0 is here! It adds React 18 compatibility (including SSR support) and moves over to TypeScript.
We featured the release of React Admin 4 last week, but now there’s an official blog post covering the new features.
Senior React Engineer @ Nebulab (Remote) — Join our distributed team and build high-volume eCommerce applications in a workplace made by developers for developers.
React Native Expert for Global Health (Remote) — SystemOne enables clinics to securely track infectious disease specimen, diagnostic & patient data in low resource settings.
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.
Accessible React Forms — This is overdue: in-depth coverage of building accessible forms in React. The author starts with one that does not work well in this domain, and then progressively introduces fixes to get it right.
Creating a Multi-Step Form with Formik — Complex user input can be daunting—breaking it down into smaller, step-wise chunks can make it easier. This article shows how. BTW, the ‘audiobook’ version is a welcome addition to this article—we hope this catches on.
Writing Cross-Platform Components for Web and React Native — It’s not the easiest thing to do..
React App Performance Optimization Tips
🛠 Code and Tools
React Embed 3.6: To Embed Third Party Widgets — A component that looks at the URL of the thing you want to embed and then, well, embeds it as best it can. Supports things like JSFiddle, Replit, SoundCloud, YouTube, GitHub Gist, and more.
Collings, Honnibal, Vanderwerff, et al.
React Page Visibility 7.0: Declarative, Isomorphic ‘Page Visibility’ HOC — React to your app being in the background (or invisible) so you can do things like conserve bandwidth or stop running animations.
React-Select-Datepicker: A Dropdown Date Picker Component — If a calendar feels too cumbersome, this is a different approach where you let users pick month, day and year from dropdowns. GitHub repo.
Paul Le Cam
⚡️ Quick Bits:
react-bootstrap-typeahead — React typeahead with Bootstrap styling.
use-async-memo — React hook for generating async memoized data.
react-copy-to-clipboard — The ubiquitous copy-to-clipboard functionality your app needs.
useScrollDirection — Get the scroll direction vertically.