React Server Components Guide, JavaScript Promises Interview Prep, Next.js Updates, and Nano Banana - This Week in React & AI
Weekly roundup of React Server Components, Next.js updates, JavaScript promises interview prep, and AI image generation.
From mastering JavaScript promises (and implementing them yourself!) to Josh Comeau’s best breakdown of React Server Components, this week’s drop is packed. I’ve also got a look at what’s new in Next.js, a reminder on why you might be overusing useEffect
, and Addy Osmani’s wild Gemini Nano demo where hairstyles change on demand!
SPONSOR: Baz: Signal, Not Noise AI Code Review
Don't drown in walls of code review text. Get precise, contextual feedback shaped by your team's standards and conventions.
That’s how trust is built: one accurate, actionable insight at a time. Free for individual developers. Works in any IDE with integrations for GitHub and GitLab.
Try Baz and review your next PR with a trusted agent
⚛️ This Week's Top 5 Resources in React and AI
1️⃣ Promises Explained: Hard Interview Question
In this video, I walk through how JavaScript promises really work, not just .then
and .catch
, but what’s happening under the hood. We will also implement our own version of Promises. Key points -
Start with a simple mental model: promises are like someone proposing to their girlfriend - waiting on a response.
Promises exists in three states: pending → fulfilled → rejected.
Promises can be chained and the result flows through the chains.
A hard interview question: implement promises yourself. I encountered this question in an interview.
💡 Why you should care: If you’re interviewing for JavaScript roles, promise mastery is a must-have skill.
2️⃣ React Server Components Explained by Josh W. Comeau
Josh breaks down React Server Components in his approachable style. He compares RSCs to “sending a blueprint” rather than shipping the full furniture. Here’s what stood out -
He explains the pain RSCs solve: cutting down bundle size and eliminating “data fetching waterfalls.”
Shows how
use client
anduse server
directives split responsibilities and why this matters for performance.Calls out limitations: not everything can be a server component (anything tied to browser APIs must stay client-side).
My favorite part: his animations and metaphors make a tough concept click.
💡 Why you should care: RSCs could massively reduce bundle sizes and boost performance for your apps.
3️⃣ New improvements and Next.js 16 on the horizon
Next.js 15.5 introduces several significant updates focused on performance, TypeScript improvements, and preparing for Next.js 16. Here are the key highlights:
Typed Routes (Stable): Compile-time type safety catches invalid links before production, now works with both Webpack and Turbopack.
Route Props Helpers: Auto-generated global
PageProps
,LayoutProps
, andRouteContext
types with full parameter typing for dynamic and parallel routes.next typegen
Command: Standalone type generation for external validation and CI workflows without running dev/build.next lint
Deprecation: Shows warnings in 15.5, removed in Next.js 16. New projects choose ESLint, Biome, or no linter with explicit configs.
4️⃣ You Might Not Need an Effect
Although an older blog post, this blog post is worth resurfacing. While reviewing community’s React apps last week, I noticed that there were a lot of issues with effects dependencies, therefore wanted to highlight some important things -
Effects are really about synchronizing with external systems, and not for transforming data or handling user events.
Common Anti-patterns and Solutions -
❌ Don't create derived state with Effects
✅ Calculate values during rendering (e.g.,
const fullName = firstName + ' ' + lastName
)
❌ Don't use Effects to clear state on prop changes
✅ Use the
key
prop to reset component state automatically
❌ Don't chain multiple Effects that trigger each other
✅ Calculate everything in event handlers or during rendering
💡 Why you should care: Cutting unnecessary effects will make your app faster by reducing re-renders.
5️⃣ Gemini Nano Banana 🍌
In this demo, Addy Osmani highlighted Gemini Nano 🍌, showing off Google DeepMind’s latest upgrade to Gemini’s native image generation and editing. Here are the highlights:
He changes hairstyles on the fly and the results actually look realistic.
You can keep the same character identity across different images while switching outfits, poses, or scenes.
It can blend images into one seamless shot even combine multiple people together. I am thinking creating family photos even when one member is missing!
🔥 What I'm Bringing for You
1️⃣ Heartfelt chat with Jack Herrington
We had such a fun conversation covering everything from learning a new technology and becoming really good at it, to breaking into tech while navigating learning disabilities. You don’t want to miss this one!
2️⃣ Hackathon Next Week in Tech Hustlers Discord
📣 Announcing The First Ever Tech Hustler's Hackathon – a week-long challenge where you build AI Agents, or projects that create real impact for the community - from tools that make daily life easier to ideas that brings community closer together
📆 September 13th – 19th, 2025
2️⃣ I Code Reviewed Your Apps
Last week, I jumped into some of your React apps live on stream. Huge thanks to everyone who submitted — it was awesome to see your work! I’ll be sharing a summary video soon covering the most common mistakes and tips from those reviews.
📊 Weekly Poll
❤️ This Newsletter Is Powered by You
Want to support my work? You can sponsor me on GitHub or simply share this newsletter with a friend who’s learning React. Both go a long way 🙏
P.S. Forward this to a friend who’s brushing up on React fundamentals or prepping for JavaScript interviews. They’ll thank you.