星期三 04 下午 七月 23o 2025
Figma MCP vs Claude: A React coding battle
#437 — July 23, 2025
Together with
⚛️ 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
React Markdown Editor 4.0.8 – Simple Markdown editor with syntax highlighting and no dependence upon a larger editor component. (Demos.)
Yet Another React Lightbox 3.25 – Modern React lightbox component.
React Native Audio API 0.6.5 – Audio engine based on Web Audio API.
React Admin 5.10 – Framework for building B2B frontend interfaces.
React Stripe.js 3.8 – Components for Stripe.js and Stripe Elements.
📢 Elsewhere in JavaScript
A roundup of some other interesting stories in the broader JavaScript landscape, in case you’ve missed them:
Platformatic has unveiled a way to run Laravel apps in Node.js.
Bun v1.2.19 has been released with a new option to use a pnpm-style isolated, symlinked node_modules
with bun install
, an interactive package updater, a VS Code Test Explorer integration, a faster integrated Postgres client, and more.
The eslint-config-prettier package was recently compromised and here’s some analysis of how it worked and how it happened.
bhvr is an interesting new attempt at creating a React-based stack for fullstack apps using Hono and Vite. (bhvr itself stands for Bun, Hono, Vite and React.)
Curated by Peter Cooper and Terence C. Gannon.
A Cooperpress publication.
#437 — July 23, 2025
Together with
⚛️ 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
React Markdown Editor 4.0.8 – Simple Markdown editor with syntax highlighting and no dependence upon a larger editor component. (Demos.)
Yet Another React Lightbox 3.25 – Modern React lightbox component.
React Native Audio API 0.6.5 – Audio engine based on Web Audio API.
React Admin 5.10 – Framework for building B2B frontend interfaces.
React Stripe.js 3.8 – Components for Stripe.js and Stripe Elements.
📢 Elsewhere in JavaScript
A roundup of some other interesting stories in the broader JavaScript landscape, in case you’ve missed them:
Platformatic has unveiled a way to run Laravel apps in Node.js.
Bun v1.2.19 has been released with a new option to use a pnpm-style isolated, symlinked node_modules
with bun install
, an interactive package updater, a VS Code Test Explorer integration, a faster integrated Postgres client, and more.
The eslint-config-prettier package was recently compromised and here’s some analysis of how it worked and how it happened.
bhvr is an interesting new attempt at creating a React-based stack for fullstack apps using Hono and Vite. (bhvr itself stands for Bun, Hono, Vite and React.)
Curated by Peter Cooper and Terence C. Gannon.
A Cooperpress publication.
发布者