Figma MCP vs Claude: A React coding battle

дата:
Plus an introduction to Zustand, a new UI component library, and some new React Compiler docs too. |

#​437 — July 23, 2025

Read on the Web
Together with  Frontend Masters logo
⚛️ React Status

Untitled UI React: A Fresh UI Component Library — A giant collection of open-source (MIT) components built around Tailwind CSS and React Aria so you can 'copy, paste, and build' – there's a full introduction here. It is, however, not only open source, there's a 'PRO' offering which gives even more components, examples, and Figma integration.

Untitled UI

The New React Compiler Docs — The React team has been working hard on improving the official documentation for React Compiler, the ahead-of-time optimization tool that's still currently in its release candidate phase. But if you want to learn more and dive in, these improved docs make it a good time to do so.

The React Team

Avoid Common Mistakes in React and Next.js — Avoid redundant useState and useEffect, deeply nested data, unscalable forms, and hidden shared state bugs. David Khourshid teaches practical patterns to refactor complex apps and scale with confidence!

Frontend Masters sponsor

▶  Figma MCP vs Claude: A UI Building Battle — Jack has a basic app view built in Figma and wants to turn it into working React code. What works best? Taking a screenshot and getting Claude Code to attempt to implement it, or use Figma's own MCP server to do the work? (8 minutes.)

Jack Herrington

Introducing Zustand for State Management — The 'barebones' state management solution Zustand is now mature, popular, and battle-tested, but if you've been waiting for a comprehensive introduction, this is for you.

Adam Rackis

React Router and React Server Components: The Path Forward — Find out what's coming up for you if you're a React Router user keen to work with React Server Components: "the implications are greater than you might expect."

Ebey and Dalgleish

React Graph Visualization: Practical Guide & Real Examples — Discover why React graph visualization is a developer favorite for building dynamic, flexible and interactive UIs.

Cambridge Intelligence sponsor

📄 How to Build 2D Game-Style Physics with Matter.js and React Native Skia Daniel Friyia (Expo)

📄 We Migrated Our Next.js Site to Eleventy and Increased Performance by 24% – Eleventy (11ty) is a popular Node-based static site generator. Dan Webb

📄 Create a React PWA with Social Login Authentication using Okta Emmanuel Folaranmi (Okta)

🛠  Code, Tools & Libraries

Reagraph: WebGL-Powered Network Graph Visualization for React — It has thorough docs and a full Storybook instance packed with examples with code. GitHub repo.

REAGRAPH

React Unity WebGL 10.0: Embed Unity WebGL Apps into React Apps — Unity is best known as a platform for building 3D games but can be used for broader applications too. React Unity WebGL, now celebrating its 8th birthday, helps you integrate WebGL-powered Unity apps with React apps and communicate between the two. GitHub repo.

Jeffrey Lanters

React CodeMirror: A CodeMirror Editor Component — CodeMirror is a popular JavaScript code editor – this makes it easier to use from React. The homepage has a full, customizable demo showing off the potential. GitHub repo.

UIW

fluent-state: Fluent, Immutable React Local State 'That Just Makes Sense' — A proxy-based hook for deeply nested, reactive state, computed reactive state and built-in effects — zero boilerplate, no reducers, no magic.

Marcel Bos

📢  Elsewhere in JavaScript

A roundup of some other interesting stories in the broader JavaScript landscape, in case you've missed them:

n

Комментарии

Отправить комментарий