An interactive guide to React rendering
#337 — May 3, 2023
Vercel Introduces First-Class Storage Options — Vercel is a popular platform for deploying React apps but has lacked obvious options for data storage (indeed, they have a lot of templates for common third party systems). Now, though, they’ve partnered with Upstash, Neon, and Cloudflare to offer new first-class key/value, Postgres, and file storage options.
The Interactive Guide to Rendering in React — This interactive guide explores why, when and how React renders and illustrates it with a series of short and well thought out animations.
Modular Content Management for Tech Teams with Kontent.ai — Streamline your code and scale with ease using Kontent.ai’s headless CMS. TypeScript SDK, CLI, rich text resolver & strongly typed model generator for flexible and scalable content management. Try it now.
Bulletproof React: A Scalable Architecture for Production-Ready Apps — A long standing resource that continues to get updates and deserves another look. It’s not a boilerplate app or framework itself but an opinionated guide to how you could structure a large scale React app if you’re lacking for inspiration.
Build a Type-Safe Tailwind with Vanilla Extract — A look at how a team built a type-safe alternative to Tailwind using Vanilla Extract, a way to write type-safe CSS where the final static CSS files are generated at build time.
Chris Schmitz (Highlight)
So Exactly What Are React Server Components? — There’s always room for another explanation of React Server Components, particularly one which makes few assumptions about prior knowledge and provides easy-to-follow examples.
Nick Telsan (Viget)
Server Components vs. SSR in Next.js comes at the question from a different direction.
Crafting the Next.js Website — The official Next.js site is impressive, but what went into it? One of the designers shares some of the implementation details which aren’t particularly React-y but may prove inspiring to you.
Creating ‘Bento’ Grid Layouts in React — Refers to a grid-like style of layout commonly associated with Apple product pages or Windows 8.
React Authentication, Simplified — In this article, we lay out a new approach to authentication (plus access control & SSO) in React applications.
Making Animated Tooltips with React and Framer Motion — Given there’s a fairly good chance tooltips could be the only ‘documentation’ that will actually get read, why not jazz them up a little?
Building a WebGL Carousel with React Three Fiber and GSAP — The end result is visually striking.
Connecting React, MUI and TypeScript Together
???? Code and Tools
Introducing React Native macOS 0.71 — With this version, the macOS flavor of React Native catches up with its iOS, Android and Windows cousins, and they want to keep it that way in future. v0.71 introduces an experimental preview of Fabric (React Native’s new rendering system) and more.
Mock Service Worker 1.2: REST/GraphQL API Mocking Library — Intercepts requests which you can then mock. Capture outgoing requests using an Express-like routing syntax, complete with parameters, wildcards, and regexes. GitHub repo.
Dynaboard: A Low-Code Web App IDE Made for Developers
next-sitemap: Sitemap Generator for Next.js Apps — Generates sitemaps and robots.txt for static, pre-rendered, dynamic, and server-side pages.
↳ The React library to build dashboards fast.
↳ Inline editing library. (Sandbox.)
React Suite 5.33
↳ Suite of React components.
↳ Create live-running code editing experiences.
Team Lead Web Development — Experienced with Node, React, and TS? Join us and lead a motivated team of devs and help grow and shape the future of our web app focused on helping millions explore the outdoors.
Find React Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.