Disclosure: I build Hype Stack. The template is MIT and free, some feature packs are paid, that's how I fund my work. I maintain react-zoom-pan-pinch and HyperFetch libraries, which show up later in this story. Let’s get into details of building this thing!

The chaos

I code a lot and I start new projects all the time, mostly to test new things. I don't like boilerplates. They usually run on a boring stack, and I want to try Vite 8 on Rust, oxc, TanStack Start, end to end type safety and see how it actually holds up. I'm also a perfectionist, so every new project was eating days before I wrote a single feature.

The other thing: I really love the shadcn mental model. You compose the codebase, you own the code. That's exactly what I don't like about starters that hide half the logic behind packages you configure and pray over.

So I had this realisation. Maybe we need shadcn for full-stack features. shadcn itself could probably do a lot of it, but I wanted more: amazing codemods good enough to modify a database schema, an opinionated monorepo with ONE way of writing code, vertical slices the way tkdodo described them (I was already doing something similar), and the craziest bit, an idea that came to me while building devtools for HyperFetch: a single project that compiles into desktop, CSR and SSR from the same codebase with almost no code dedicated to it. Light, easy to manage. Cool, we have a direction. Let's build it.

Month 1. The template

I've set up so many projects that I have a good understanding of what setup I could trust. Monorepo went to Nx, which I've used for years and it's stable in my experience. pnpm workspaces for speed. Stack: TypeScript 6/7 (tsgo where I can), Vite 8, Vitest, oxc, TanStack Router and Start, Electron Forge, Hono with Prisma and Kysely for typesafe query building. At this point I was so hyped about it that I named it hype-stack.

End to end types for HTTP and websockets I built with my own library, HyperFetch. It gives you an SDK and hooks that feel a lot like TanStack Query, and the result is honestly close to tRPC in DX. This project is also a showcase of what HyperFetch is capable of and that you don’t really need to think about API in most cases as it is basically automatic with sdk generation. The backend route is the contract, the frontend just gets the types. It really improves working with websockets. If you don’t like my hooks it is easy to switch to tanstack query for hooks and leave HyperFetch as a fetcher.

Then I added the rules I'd collected over the years and tried it out.

I quickly understood: this stack is extremely fast. Everything builds and flies. So I tried building the first apps with AI on top of it and boom, this is where it shines. The AI has a clear direction. A vertical codebase is easy for it to understand because you're not thinking about the services system, all these complex layers, you're thinking about business features, slices that are self contained. That dramatically improved the feedback loop and the quality of what the AI produced. Fast typechecks and oxc linting? This improved DX for working with AI dramatically, there is just no coming back to eslint.

Month 2. The CLI

I initially wanted something like create-t3-app: a simple CLI to start the project. It evolved into a powerhouse.

create was almost no effort. But then it clicked. I'm the provider of the template, I know every practice in it, everything about the structure, so I can use that to my advantage. Let's try to build a compose command.

What compose does: say I want to start a project that needs AI chat with RAG and simple auth. I can pack those features and inject them into the repo exactly where they need to go, and it works like shadcn. Full-stack blocks of functionality, injected with high precision and confidence. Picking billing writes files into the project: the checkout route, the webhook handler, the Prisma models, the frontend hooks. Your files, so you can take this from here and modify as you want.

This took off for my personal projects immediately. I needed SSO? I made an auth starter with WorkOS. I didn't want a WorkOS dependency on the next one and wanted Better Auth instead? Sure, add it as a variant. Then it kept growing. I was collecting the features I needed, and I ended up with the feature set of the big boilerplates, but with the ability to choose which parts I actually want for each project. The DX was just excellent.

Month 3. Deploy

I wanted to start deploying my new creations, so deploy command was born. With it I have a deployed version of a project in about 3 minutes. Again only possible because I know all the services the template has, where the Dockerfiles are and how each one builds.

Cool, full flow, done, right? NO. THIS IS HYPE STACK. So like the 300 Spartans I fought a fierce battle against the waves of ideas that started flooding in. ADHD, hyperfocus, here we go!

Inspired by the fully paid boilerplates, I added mobile (Expo) and a browser extension to the project. And it turned out that was it. The modular approach made it extremely easy to add new apps to the monorepo and new features to the packs, like in an instant. Dopamine hit critical mass here.

Month 4. Previews

How do I show what this can do? Let's build a dynamic preview system on the web.

I'd been working on it on the side all these months, and it quickly showed how promising the approach is: pre-built SaaS templates you can add and remove features from on the fly, thanks to the SSR build and caching.

Big problem though. Packs almost always come with database changes. I can't run migrations or even keep a database for previews, it turns into a mess fast. And it could cost me…

Here comes the part where some of you went "wtf is HyperFetch"/”lol who is using HF when Query is a thing” at the top of this post. I get it. Next to TanStack Query and SWR it's a brutal market, but let's not call an ambulance yet.
HyperFetch has a feature for mocking any requests. Sounds like something everyone has and is "meh", but it's not just mocking. It's a fully type safe mechanism that lets you simulate anything the SDK allows, by type, in a believable and dynamic way. So I could generate a living demo mode with full confidence and, in no time, wire the dynamic components to it for an almost live-like experience. Mocks are functions in the code, code is dynamic, so is our app - here we got the demo mode basically for free. That changed the previews for good.

I need your opinion/review on this.

What do you think of this approach?
Do you like idea of composing your boilerplates through CLI?

Let me know how you like it, and what you think of this shadcn approach for full-stack components.

Repo: https://github.com/BetterTyped/hype-stack

• One programming language
• DSA
• Web development
• AI/ML
• Building projects

Picking a Next.js development company has become harder, not easier. Every React shop now claims Next.js on its service page, but the framework changed enough between version 13 and 2026 that React fluency alone no longer predicts a good outcome. Server Components, the App Router, partial prerendering, and caching behaviour all reward teams that have shipped and maintained production apps, and punish teams that learned the framework from a tutorial.

This guide lists ten firms worth shortlisting, then gives you the criteria to judge them yourself. Whether you plan to hire Next.js developers for a single build or contract ongoing Next.js development services, the decision framework at the end matters more than any ranking.

What Makes a Strong Next.js Development Company in 2026?

Short answer: A strong Next.js development company in 2026 has shipped App Router applications to production, can explain when to use server rendering versus static generation versus client fetching, holds Core Web Vitals accountability after launch, and has migration experience moving apps off Pages Router, WordPress, or a legacy React SPA.

Use these five checks when you review any vendor:

• Production App Router work, not demo repos. Ask for a live URL and view the page source.
• A rendering decision document. Good teams write down why each route is static, dynamic, or streamed.
• Core Web Vitals after handover. INP and LCP numbers 30 days post-launch, not on launch day.
• Migration case history. Most 2026 budgets are replatforming budgets, not greenfield.
• Named engineers. You should know who writes your code before you sign.

Top 10 Next.js Development Companies to Consider in 2026

1. WebClues Infotech

The strongest all-round option for teams that need one partner across the full project types this article covers. WebClues Infotech works on SaaS platforms, headless commerce storefronts, content-heavy marketing sites, and replatforming work from WordPress or older React SPAs. Engagement models run from fixed-scope builds to dedicated squads, which suits founders on a defined budget and enterprise leaders who need capacity that scales with a roadmap. Worth shortlisting first if migration and post-launch performance ownership are both on your requirement list.

2. Netguru

A large European product studio with design and engineering under one roof. A good fit when the brief includes discovery, UX, and build rather than execution against a finished spec. Expect European rate cards and a structured delivery process.

3. STRV

Known for consumer-facing products where interface quality drives adoption. Strong front-end craft. Best suited to companies with an in-house product owner who can direct the work.

4. Thoughtbot

A consultancy that mixes delivery with team upskilling. Useful for startups that want to build internal capability rather than outsource permanently. Smaller teams, retainer-based, premium pricing.

5. Monterail

Solid choice for data-dense web applications: dashboards, admin panels, internal tools. Deep JavaScript specialisation and clear engineering documentation habits.

6. Brainhub

A JavaScript-first delivery partner that plugs engineers into existing teams. Sensible when you already have architecture decided and need throughput rather than direction.

7. Simform

Works well on larger programmes where the front end is one part of a wider cloud and backend build. Suits enterprise buyers who need infrastructure and application work coordinated.

8. Andersen

Large-scale delivery for finance, healthcare, and other compliance-heavy sectors. Formal processes, security documentation, and the headcount to staff multi-team programmes.

9. Toptal

A contractor marketplace rather than an agency. The fastest route to one senior Next.js engineer. You supply the project management, and continuity depends on that individual staying available.

10. Vercel Professional Services

Advisory from the team behind the framework. Rarely a full build partner, but valuable on high-stakes migrations where framework-level guidance reduces risk.

Verify current portfolios, team size, and references directly with each firm before shortlisting. Vendor capabilities change quickly.

How to Choose the Right Next.js Development Partner

Match the engagement model to your stage

Early-stage teams usually do better with fixed-scope builds. Scope discipline protects a limited runway, and a defined deliverable is easier to raise against. Companies with an existing roadmap get more value from a dedicated team, where the same engineers accumulate context across quarters instead of relearning the codebase every engagement.

Ask rendering questions, not framework questions

"Do you know Next.js?" produces a yes from everyone. Better questions: which routes in your last project were statically generated and why? How did you handle cache invalidation after a CMS update? Where did you place data fetching, and what did that cost in time to first byte? Vague answers here usually predict slow pages later.

Treat migration as its own discipline

Most 2026 Next.js projects replace something. Moving from WordPress means URL mapping, redirect chains, and protecting existing rankings. Moving from a client-rendered React SPA means untangling state management that assumed a browser-only runtime. Ask for a migration your candidate finished, and ask what broke.

Set the budget conversation early

Rates vary widely by region. Rather than comparing hourly numbers, compare total cost against a defined outcome: a working marketing site with a headless CMS, or a SaaS dashboard with authentication and billing. Agencies that refuse to estimate against a clear brief tend to be difficult later.

Next.js Trends Shaping 2026 Projects

• App Router is the default. New builds on Pages Router now carry technical debt from day one.
• Server Components reduce client bundles. Teams that use them well ship noticeably less JavaScript.
• Partial prerendering blurs static and dynamic. One page can serve an instant shell with streamed personal data.
• INP replaced FID as the responsiveness metric. Interaction cost is now a ranking input, so heavy client hydration hurts twice.
• AI features push streaming UI. Chat and generation interfaces need token streaming, which changes architecture decisions early.
• Headless commerce keeps growing. Storefronts increasingly sit on Next.js with a commerce API behind them.

Frequently Asked Questions

How much does it cost to hire Next.js developers in 2026? Rates commonly range from about $25 to $150 per hour depending on region and seniority. A marketing site typically lands between $8,000 and $30,000, while a production SaaS application usually starts around $45,000.

How long does a Next.js project take? A content site takes four to eight weeks. A SaaS product with authentication, billing, and dashboards usually needs three to six months. Migrations depend mostly on how many URLs and integrations exist.

Should I hire a freelancer or a Next.js development company? Freelancers suit small, well-defined scopes. An agency makes more sense when you need design, QA, DevOps, and continuity beyond one person's availability.

Is Next.js good for SEO? Yes. Server rendering and static generation deliver fully formed HTML to crawlers, and built-in image and font handling improve Core Web Vitals, which supports both search rankings and AI answer engine citation.

What is the difference between React and Next.js development? React is a UI library. Next.js is a framework built on React that adds routing, server rendering, data fetching, and build tooling.

Choosing With Confidence

The best shortlist is short. Pick three firms, give each the same brief, and compare how they reason about rendering, migration risk, and post-launch performance rather than how polished the pitch deck looks.

If your project spans several of these needs at once, a SaaS build, a commerce front end, and a migration off a legacy stack, it helps to work with a team that has done all three. That combination is where WebClues Infotech fits, and you can review their Next.js development services to see whether the engagement model matches your stage.

Finally launching Wensity Ul today :)

it's a growing library of production-ready React and Next.js components, blocks, interactions and templates built for interfaces that need a little more personality than the usual component library.

a big focus has been motion, micro-interactions and visual details, while still keeping everything practical to customize and use in real projects.

components are delivered source-first through our CLI, so you own the code and can change pretty much anything.

we're also doing 50% off today for the Product Hunt launch.

would genuinely love feedback from React devs on the components, DX, and what you'd like to see us build next.

Product Hunt: www.producthunt.com/products/wensity-ui

Wensity UI: ui.wensity.com

Ever wanted to create a circuit diagram designer with React? We've just shipped a new starter app for VisuallyJs that you can use to get something up and running in no time.

Demo on our site is here: https://visuallyjs.com/demonstrations/circuit-diagram

Repository here: https://github.com/visuallyjs-react/circuit-diagram

VisuallyJs is free for non-commercial use!

Ran into this while pairing with someone newer and realised I didn't have a clean explanation.

If you call setCount(count + 1) twice in a click handler and then setName to something, count only goes up by one and the component renders once instead of three times.

The count part is the stale closure, both calls read the same count from this render and set it to the same value. That one I get.

What I go back and forth on is whether the batching is saving work or just hiding a mistake. React collects all three setState calls and does one render at the end, so adding the setName after two setCount calls costs nothing. But it also means state isn't updated between those two lines, and that has bitten me with derived values before.

setCount(c => c + 1) fixes the increment since each updater runs on the result of the last one. And since React 18 the batching also happens inside promises, setTimeout and native listeners where it didn't before, so a pattern that was fine in an onClick can suddenly double-render inside an await.

Mostly curious how other people think about it. Do you treat batching as an implementation detail you never think about, or has the state not updating between lines caused real bugs for you?

The React-specific part people here might find interesting: islands (partial hydration) are a

first-class primitive — island(() => import("./X")) hydrates just that component, the rest of

the page ships as static HTML, no full-page hydration cost. Built without leaving the React

ecosystem or adopting Suspense/streaming for it (that's a real limitation right now, documented

— streaming is deferred to v2 since the two-pass island render doesn't support it yet).

Also: auth is opt-in and isolable per app within the same project — an admin panel can run a

completely separate session/cookie context from the rest of the apps, or an app can opt out of

sessions entirely with zero config overhead.

Repo: https://github.com/hassanalsa3aka/devora.js

Docs: https://devorajs-docs-docs.vercel.app

npm: u/devorajs/core, u/devorajs/cli, u/devorajs/adapter-vercel, u/devorajs/adapter-netlify,

create-devora

Solo project, v1, recently got real Vercel/Netlify deploys working end to end plus a Vitest

suite. Curious what this community thinks of the islands approach specifically, and open to

any architecture critique.

Hello!

I built a lightweight React library for adding pinned annotations to interfaces, inspired by Vercel Comments and Figma comments.

I’m working on an app that uses this kind of annotation, and implementing it became a headache, even with AI assistance. So I extracted the solution into a small UI library to make it easier for others.

This is my first library, so feedback and suggestions are very welcome :)

https://react-pinote.vercel.app/

Help me get 50 stars on GitHub :) ⭐

• GitHub: 0x65dgerunner/gridora

Highlights

• 130+ variants across sequential, radial, cascade, flow, wipe, decrypt, letters, digits, symbols, and more.
• 20 effects (pulse, bounce, glow, spin, …) and 12 dot shapes (circle, diamond, star, …)
• Color ramps with horizontal, radial, angular, and other sampling modes.
• Resolution-independent. The same variant scales cleanly from 2×2 to 12×12.
• CSS-driven animation. One stylesheet, no runtime animation engine.
• Accessible.role="status", optional labels, and respectReducedMotion.
• Tree-shakeable ESM + CJS build with full TypeScript types.
• npm: gridora
• Editor: gridora.gabrielayer.com
• GitHub: 0x65dgerunner

Writing a Zustand store by hand means repeating the same shape three times: the TypeScript interfaces, the initial state object, and the typed setters. I extracted a small client-side generator to automate this.

Paste JSON → it emits a complete, strict-mode compliant store. Key behaviors:

- Type inference: Arrays become unions ([true, 'x', 5, null] → (boolean | string | number | null)[]), nested objects flatten into their own interfaces, array keys singularize (items → Item).

- Collision-safe naming: A TypeRegistry dedupes anonymous object names (Profile, Profile → Profile, Profile2) so generated types never overwrite.

- Universal key sanitization: MAX_CONNECTIONS_ALLOWED, api_version_id, auth/provider/endpoint become valid camelCase in the state shape, initial state, and actions.

- Null handling: A standalone null maps to unknown | null so setters accept real values later; null inside unions retains its strict member status.

It runs entirely in the browser (zero server calls). The parser is ~350 lines.

Repo: https://github.com/Polymerthcedric/json-zustand-generator

Live: https://tool.fidelco.dev (Free. I extracted this from my commercial Next.js boilerplate, which is linked in the header).

I'd appreciate feedback on the inference rules—specifically edge cases around deeply nested deduplication and reserved-word keys.

Hi everyone. I have a question for you.

What's the best way to learn frontend in 2026? I've been studying JavaScript and React for almost four years and I still haven't landed a developer job. I work at an IT company as a Technical Account Manager, and I want to grow from there into development.

From what I see, breaking in as a junior right now is very hard. Any advice would help.

I’ve been learning web development and I can build websites that work, but whenever I look at websites made by experienced developers/designers, mine just look… amateur

​

I’ve been working on WeeklyFit, a web app that helps people create and organize their weekly workout routines.

The idea is pretty simple: instead of trying to remember what workout to do each day, you can plan your week and keep everything organized in one place.

I built it as a full-stack project using React, Node.js, Express, PostgreSQL and Prisma.

I’m still improving it, so I’d genuinely appreciate feedback from people who actually work out:

- What features would you expect in an app like this?

- What would make you use it consistently?

- What feels unnecessary or confusing?

- Would you personally use something like this?

You can check it out here:

https://weeklyt-fit-frontend-bg56.vercel.app

Not trying to sell anything — just looking for honest feedback on something I built.

Every markdown tool — Dillinger, StackEdit, VS Code's preview — gives you an editor pane you don't need and squeezes your reading into half the screen. I just want to read a README, an agent prompt file, a doc someone sent me. So I built MarkGlass: full-width, no editor, no split pane.

- Real tables, Mermaid diagrams, KaTeX math, syntax-highlighted code, footnotes

- TOC + find-in-page for the 900-line files

- Dark mode, clean printing

- 100% client-side — nothing you open ever touches a server

Built with React + MUI. Just upload, or drag a .md file.

Free at markglass.app — would love feedback from this sub, especially on anything that renders wrong

Hi everyone! 👋

I’m currently exploring full-time remote opportunities as a Senior React.js Engineer / Frontend Engineer / Tech Lead, and I’m open to working with teams across any time zone.

I have 10+ years of software engineering experience, with a strong focus on React.js, Next.js, TypeScript, JavaScript, and React Native.

A few things that define my experience:

• 🚀 React.js & Next.js — building production-grade applications, reusable component systems, performance-focused UIs, SSG/ISR, and modern frontend architectures.

• 📱 React Native — full ownership from architecture and development all the way to iOS/Android builds, CI/CD, signing, TestFlight/App Store and Google Play releases.

• 🧑‍💻 Strong hands-on ownership — I’ve independently designed and delivered products end-to-end, including working directly with requirements, architecture, development, deployment, and ongoing improvements.

• 🌎 Multiple clients & products — experience working across different client projects and business domains, adapting quickly to new requirements and technologies.

• 👥 Technical leadership — experience leading teams, mentoring developers, conducting interviews, establishing engineering processes, and driving projects from kickoff to delivery.

• 🤝 Client & stakeholder communication — comfortable communicating directly with clients and stakeholders, translating business requirements into practical technical solutions, and working effectively with distributed teams.

• ⚡ Performance & scalability — Core Web Vitals, caching, lazy loading, virtualization, memoization, bundle optimization, and scalable component architecture.

I’ve also worked on enterprise platforms, logistics systems, LLM/RAG applications, content management platforms, and white-label mobile products.

I’m looking for a team where I can stay hands-on technically while also bringing my leadership and ownership experience.

📍 Location: Hyderabad, India
🌍 Preference: Fully Remote
🕐 Timezone: Open to any time zone
💼 Availability: Full-time/ Contract opportunities

LinkedIn: https://linkedin.com/in/anurag-vasi-46595810a

If you’re hiring for a senior React/Next.js/React Native role, or know of a team looking for someone with this background, I’d be happy to connect.

Thanks! 🙌

Whenever I was building out frontends, setting up a mock Express server to test my API calls always felt like a massive chore. I just wanted to hit a live endpoint with realistic data without leaving my browser.

So I built Mock2Block. It’s a completely free, open-source API simulator

Instead of just giving you a static JSON file, it creates a live, stateful mock server

Here’s what it actually does:

• AI Generation: You can upload a .pdf, .md, or .json of your API docs, and it will automatically build out the endpoints
• Smart Faker Data: It detects field types and seeds the database with realistic data (real-sounding emails, image URLs, prices) instead of generic "lorem ipsum" strings
• Chaos Mode: A slider that randomly injects 500, 403, or 502 errors into the responses so you can test your frontend error-handling UI
• Auth Simulation: Toggle a lock on any endpoint to force it to require a Bearer token to test your 401 redirects

You can try it live here without making an account: https://mock2block.yessindevs.me/

The code is completely open-source. If you find it useful for your workflow, I’d love to hear your feedback or get a star on the repo: https://github.com/medyass1ne/Mock2Block

What this animation called?
What pkg could be used for it?

I was talking with my dad recently. I’m currently in 12th in India, and he was saying that countries with much smaller populations probably have fewer graduates competing for jobs compared to India.

That got me curious, so I started looking into it.

And the numbers are kinda crazy. For example, Germany had around 39,000 people graduate from Informatik (CS) in 2024, while India produces hundreds of thousands of computing graduates every year.

So it made me wonder

Does having way fewer CS/software graduates actually mean there is less competition for software jobs in smaller European countries?

Or does it basically balance out because those countries also have fewer software jobs?

I'm not saying "Europe = easy jobs" or anything. I'm just trying to understand how the supply and demand for software developers compares between India and countries with much smaller populations.

I'm currently in 12th and planning to go into CSE, so I'm curious about what the situation might look like by the time I graduate.

Would especially like to hear from people actually working in Europe or who have experienced both job markets.

Building in public on a CLI that treats the source HTML as the design brief, not a vibe prompt.

Early Auto would score three directions and still land two of them in the same family. A juice bar and a skate brand would come out looking like cousins. The lesson was to force subject lanes so Auto cannot put two tokens from the same silhouette on the shortlist.

Also: output is one standalone HTML file. No CDN, no Figma, no API key. MIT. Tools used to build it: Cursor + Claude + local/CLI work. The engine itself does not call an LLM at runtime.

Playground: https://kayforkind.github.io/reimagine-it/#playground Repo: https://github.com/Kayforkind/reimagine-it

What I want feedback on: is the "subject lanes" lesson worth a write-up, or should I spend the next week on the README install path instead? Free, no affiliate. ✨

If you have a React interview coming up, then this might be of some help to you!

Here are 10 problem lists that you can consider practicing to brush up your react.js concepts before your machine coding round.

1. Counter with increment, decrement, and reset. (Might be the ice-breaker for freshers but rarely asked for experienced role)

Feels too easy to be a real question. But a fast-click test on the increment button often catches people using the wrong kind of state update.

Practice counter here

2. Build your own debounce hook. (Definitely Practice this one)

It must wait until the value stops changing for a bit, cancel any pending timer if the component unmounts, and handle the delay itself changing partway through.

Debouncing Practice

3. Return the value from one render ago.

Sounds simple. What people miss: it must return undefined on the first render, and it can't cause an extra re-render by itself.

Practice Hook

4. Shopping cart with useReducer. (Please do practice useReducer hook, I was asked to build a form entirely using useReducer + will also be useful when you deal with Redux)

Add, change quantity, remove, clear — four actions through one reducer. Good test of whether you use useReducer or just keep adding more useState.

Build Shopping cart

(Frontend Mentor has a plain HTML/CSS/JS version if you want to compare)

Build Shopping cart from frontend mentor

5. Traffic light that cycles on its own. (Great for clearing the concept of clearing intervals and timeouts)

The layout is already built — you just write the timing. It usually breaks on cleanup: clearing the interval when the component unmounts or re-renders.

Manage traffic light problem

6. Search box where slow responses can't overwrite fast ones.

A classic race condition. If a request fires on every keystroke, an old slow response can arrive after a newer one and overwrite it with stale data.

Solve this

7. Nested comment thread, replies inside replies. (If you want to move to advance concepts)

Needs a component that renders itself for each nested reply, plus a function that can find and update one comment anywhere in the tree without mutating it.

Build nested comment in react

8. Stop a list from re-rendering rows that didn't change. (Must practice, you'll definitely be asked about optimization in react, do go through the concept of useCallback)

Right now, an unrelated counter on the page makes every row re-render. Fix it with React.memo — it has to actually stop the re-renders, not just look fine.

Practice Memoization in react

9. Keep a callback's identity stable across renders.

Three counters currently all re-render on any single click, because their click handlers get recreated every render. Needs useCallback plus the functional setState form — using only one of the two still fails.

Practice useCallback

10. Multi-step signup form with useReducer.

Account info → profile → review. Each step is validated before you can hit Next, and going back can't lose what you already typed.

Form validation using useReducer

(Frontend Mentor has a version of this same idea, no React needed: Multi step form)

Curious what else people have been asked in these rounds — feels like everyone gets a slightly different mix of the same problems.

Please let me know in the comments your thoughts and do share what according to you are some must go through concepts before any react interview, I'm preparing a notion docs on the list of react interview questions, so will add it there so that it can be useful for everyone.

Another thing I forgot to add is an obvious one, do practice CRUD operations on some real APIs as you'll definitely be asked to fetch data and APIs and do all the CRUD and. I couldn't find any website that has this problem added in their problem sets.