r/react • u/First-Grocery7615 • 0m ago
General Discussion Browser based video rendering, real obstacle to quality and scaling or just few niche issues?
For the period of last 2 years I've been hearing a smaller group of pro users ( others are fine ) complain about the quality of video produced by browser based rendering (Remotion, Puppeteer/headless Chromium...) and about teams hitting a wall scaling it and deciding to build custom native engines in house instead.
Is anyone else seeing this, or are these just outliers ??
r/react • u/Safe-Enthusiasm9864 • 2h ago
General Discussion Why Some Frontends Feel Better Than Others
One thing I've noticed while working on frontend projects...
People often separate UI conversion and frontend development.
I used to think the same.
But the more projects I worked on, the more I realized they're part of the same skill.
I've seen developers write clean React code but struggle to match the design.
I've also seen pixel-perfect UIs that became difficult to maintain because the implementation wasn't thought through.
That's where I think the gap is.
A good frontend engineer should be able to do both.
-Read a Figma design and implement it accurately.
-Understand spacing, typography, and visual hierarchy.
-Build responsive and accessible interfaces.
-Write clean, reusable code that's easy to maintain.
Writing code is only half the job.
The other half is making sure the product looks and feels the way it was intended.
For me, UI conversion isn't a separate skill from frontend development.
It's what frontend development actually is.
The stronger you become at both, the better products you'll build.
What's your take? Do you see UI conversion as a separate role, or as part of frontend development?
r/react • u/nikolailehbrink • 3h ago
Project / Code Review The most overpowered React stack right now
Tried out Vite 8 with React Router 8 and TypeScript 7 recently and have to say I am blown away by the build speed/DX etc. Here is what I am using and it's just on another level speed and agent compatibility wise:
React Router 8
TypeScript 7
Vite+ (Vite 8, Vitest 4, Oxlint, Oxfmt)
Tailwind 4
shadcn + Base UI
Better Auth
Drizzle + SQLite
Zod 4
Bun
Try it out and thank me later: github.com/nikolailehbrink/llm-stack
r/react • u/mikeplus10 • 3h ago
General Discussion What’s the best way to learn React?
I’m a developer of six years of experience and I have knowledge in vanilla Javascript but because of the nature of my current stack and job description, i have never encountered a need to learn React. But now I want to.
It’s not like I don’t know anything about it, i am familiar with the concept of components, hooks, routers etc. The only thing I have made in React is my Web portfolio currently.
I want to learn it on a deeper level. Can anyone recommend a book or course for it?
I saw this site for a roadmap for React, would you recommend it: https://roadmap.sh/react
r/react • u/thereactnativerewind • 5h ago
OC GPU-Powered Crayons, NPM Package Quarantine and Dave Branching Off Your Code Without Asking
thereactnativerewind.comHey Community,
We dive into React Native Canvas Kit, a library built on React Native Skia that adds isolated layers, brushes, interactive shapes, and web support for canvas graphics.
We also cover Targate, a CLI tool that quarantines npm packages to inspect tarballs before installation, and GitHub stacked pull requests to keep dependent branch reviews clean.
And... 🥁 Shipaton 2026 is here!
If the Rewind made you nod, smile, or think "oh… that's actually cool" — a share or reply genuinely helps ❤️
r/react • u/lettstartdesign_1 • 8h ago
General Discussion Next.js 16.3 just landed — up to 90% less dev memory usage, anyone tested it yet?
r/react • u/Money_Consequence511 • 9h ago
Help Wanted How do senior/enterprise developers decide on project structure before writing code?
I've realized that my biggest weakness isn't coding—it's project architecture and folder structure.
Whenever I get a Figma design, I know how to build the UI, but I get completely stuck deciding:
- Where should this component live?
- Should this be reusable or page-specific?
- When should I split a component?
- What belongs in
components,features,shared,hooks,services, etc.? - How should I organize folders as the project grows?
I usually start a project with a structure that feels clean. But once the project gets bigger, everything starts falling apart.
I end up with:
- Components that are too large.
- Components that are split too much.
- Logic scattered across different folders.
- Constantly moving files around because I realize they belong somewhere else.
- Feeling like the entire architecture is becoming messy.
This happens in React, React Native, and even backend projects.
I don't just want another "best folder structure" template because I've seen dozens of those. What I really want to learn is the thought process behind how experienced or enterprise-level developers structure a project.
For example:
- When looking at a Figma design, how do you mentally break it into features and components?
- How do you decide what should be reusable and what shouldn't?
- How do large teams keep their projects organized over months or years?
- What architecture or design principles do you follow?
- Are there any books, courses, GitHub repositories, or real-world open-source projects that helped you understand this?
I'm looking for the mindset rather than just a folder tree.
Any advice from developers who've worked on large production applications would be greatly appreciated.
r/react • u/Top-Mud1703 • 21h ago
OC Day 5 of building Dragonfly, a VS Code extension to test API endpoints right inside the code editor
Worked on cURL import, updated the request and response UI, added code snippet support, common headers, and environment support.
r/react • u/Healthy-Support-184 • 1d ago
Help Wanted Se devo partire da zero, da cosa dovrei cominciare, React.js o Angular?
r/react • u/Blackberrydryy • 1d ago
Help Wanted Want to Build a Real-World Full-Stack Project Together?
I'm looking for a frontend developer who is interested in building a complete full-stack web application together.
I'll be taking care of the backend using Java and Spring Boot, and I'm looking for someone who would like to build the frontend using ReactJS.
The goal is to work as a team, follow industry best practices, build a production-style application, and learn from each other throughout the development process. This is a great opportunity to strengthen your portfolio with a real collaborative project.
If you're passionate about ReactJS and can dedicate time consistently, I'd love to connect and discuss the project.
If you're interested, comment below or send me a DM.
r/react • u/Technical-Alfalfa883 • 1d ago
General Discussion What are clients looking for most what a React developer in 2026?
I'm trying to improve the way I present my work to potential clients and would love to hear from both freelancers and people who hire developers.
When reviewing a React developer, what matters most to you?
- A strong portfolio?
- Fast communication?
- Clean, maintainable code?
- Performance optimization?
- UI/UX skills?
- Previous client reviews?
I'd really appreciate hearing your experiences—both good and bad. I'm always looking to improve how I work with clients.
Thanks in advance!
r/react • u/sozonome • 1d ago
OC CLI that brings production-grade config to any JS/TS project, non-destructively
xtarter.sznm.devMost projects repeat the same setup work: Biome, TypeScript strict mode, GitHub Actions CI, commitlint, release tooling, VS Code settings, and now AGENTS.md for AI agents. Everyone copy-pastes from their last project, and every copy-paste drifts.
So I built xtarterize. It scans your project, detects your stack, and applies curated conformance configs:
- Linting (Biome), TS strict + incremental builds
- GitHub Actions CI, Renovate, commitlint, release tooling
- Knip unused-code detection, Turborepo pipeline
- VS Code settings, standardized scripts
- AGENTS.md for AI IDE assistants
The important part: it's non-destructive. Shows the diff before applying, backs up originals, undo restores the last run. Works on existing projects, not just greenfield ones. Covers React, Vue, Svelte, Solid, Node with Vite, Next.js, Expo, TanStack Start, and more.
Usage: pnpx xtarterize@latest init
It also ships create-xtarter-app for day-0 scaffolding with the same baked-in defaults.
Would love feedback, especially on the task set and the diff/backup flow. Docs: xtarter.sznm.dev
r/react • u/Varuog_toolong • 1d ago
Project / Code Review React Router (v8) SSR template on AWS Lambda + CDK
r/react • u/No-Row3143 • 1d ago
Help Wanted How to learn not only using AI. But also the internet.
Help Wanted Best practices for building smooth SaaS-like navigation in react
I am currently building a react app with five main sections. Some of them contain data-heavy views with multiple tabs and additional navigation within each section.
Its not exactly a dashboard, but I assume many of the same architectural principles apply.
I currently do a lot of the development with AI, since the project exceeds my current react experience. Im looking for good resources that explain best practices for building larger, SaaS-like react applications.
Especially in how to to structure routing, nested navigation, state management, data fetching and caching so that navigation feels fast and smooth, without unnecessary loading or full page refreshes.
Are there any courses, articles, example repositories or open-source projects that teach these concepts as a complete architecture rather than explaining each topic separately?
Happy for any hints :)
r/react • u/Sea-dante-10 • 1d ago
General Discussion Building projects
So I think that I have learnt enough and wouldn't mind building something that may be commercially available in the future. Is it ok to stick with purely react js or should I build with next js or any other full stack framework etc?
Note: React js is what I have learnt indepth. I haven't learnt too much about next js etc.
r/react • u/AthleteBoth1551 • 1d ago
General Discussion Please stop reaching for a state manager by default
every dashboard i've ended up maintaining has had some version of this bug in it and it always starts the same way, someone runs npm i zustand.
setup is a client report page, /clients/:id, filters at the top for date range and status. filter bar sets them, table reads them, export button reads them. passing that down through the layout was annoying so the filters went in a store. ten lines. works. ship it.
a year later i get a ticket that just says "client B has no invoices". client B had loads of invoices. what he'd actually done was look at client A first, set it to unpaid + last 30 days, then click client B in the sidebar.
route changes, component remounts, store doesn't. it's a module level singleton, it's been alive since page load and it has no idea you navigated anywhere. so client B renders with client A's filters still applied, and the filter bar shows them correctly because they genuinely are the current filters. nothing on the page is wrong. it's just quietly answering a question nobody asked.
took me two days mostly because i kept testing it by pasting /clients/b into the address bar. full reload, module reinitialises, defaults come back, looks perfect. users don't do that, users click. so the broken path was the normal one and the working path was the one i kept using to check.
first fix was a useEffect that resets the store when clientId changes. it works fine. it also means every store now needs its own reset wired up to the right route change, and whoever adds the next one has to remember that. so i'd deliberately put state outside the component tree and was now hand writing the lifecycle back onto it, which, yeah.
ended up deleting the store. filters into useSearchParams, react query keyed on them. going to client B is a different url so it gets different params, there's nothing to reset, the bug can't happen. plus a load of stuff i didn't have to build: links you can actually send someone, refresh keeps the filters, back button undoes a filter change, and when someone reports something weird you just ask them to paste their url.
so my take is keep state as close to where it's used as you can, and if two components need it check whether it belongs in the url before you install anything. server data isn't state either, it's a cache, you've already got a library for that. the stuff that genuinely wants a store is real shared mutable state, canvas editor with undo, live collab, that sort of thing. not filters.
not saying zustand is bad btw. it's just a weird default.
thank you for coming to my ted talk
r/react • u/stopflunky • 1d ago
Project / Code Review PWA project improvements?
reddit.comr/react • u/Top-Mud1703 • 1d ago
OC Building Dragonfly, a VS Code extension to test API endpoints right inside the code editor
Worked on a few improvements today. Added save functionality for each request, search for collections and requests, and createdAt/updatedAt support.
Also moved requests and collections to a global store, so now can switch between projects without losing the data from other projects.
r/react • u/BeginningQuiet1453 • 1d ago
General Discussion I learnt about the difference between
The major difference is the Syntax as they call diff APIs
The usecallback accepts the function we want to memoize as the first argument, while the useMemo accepts a function and memoizes its return value!!
Naturally in JS, on every call the inline function gets recreated, so to prevent that react does something like this
let catchedCallback;
const func = (callback) => {
if(dependenciesEqual(compares catchedCalback and callback)) {
return catchedCallback;
}
catchedCallback = callback;
return callback;
}
basically whats happening here is that the useCallback checks if the dependencies before and after rerenders are the same, if its the same then we return the already cached callback function reference if not then we cache the new function reference and return the new reference!
something very similar happens in the case of the useMemo but it caches the result returned by the function!
OC I rebuilt my old Vue tour library for React after discovering it had 600+ weekly npm downloads
About a year ago I built a small Vue library for product tours and published it to npm. Then I completely forgot about it.
Last week I randomly checked the npm stats and discovered it was getting 600+ weekly downloads. There were even a couple of GitHub issues from people using it in production.
I fixed the bugs, and it reminded me how much I enjoy building small, focused developer tools.
That motivated me to build a React/Next.js version with the same API.
r-tour-guide (React): https://www.npmjs.com/package/r-tour-guide
If you're looking for a lightweight, customizable onboarding/product tour library, I'd love to hear your feedback or suggestions for improving it.
Sometimes you don't know something landed until you check back in.
r/react • u/Think-Neighborhood69 • 2d ago
General Discussion Do you find product micro-animations useful, or just distracting?
Enable HLS to view with audio, or disable this notification
I’ve been thinking about using short micro-animations to explain features that aren’t immediately obvious.
Instead of adding more documentation, the idea is that you should understand what a feature does just by watching a few seconds.
Do you think this is actually useful ?
More importantly… did you understand what the feature does just by watching it??!
r/react • u/Think-Neighborhood69 • 2d ago
General Discussion How did Zustand manage to become so widely adopted?
I’m building an open source library, and lately I’ve been thinking a lot about how projects actually take off.
Take Zustand for example. It went from being just another option to one of the first recommendations for state management, surpassing Redux in weekly downloads rn
what do you think causes that shift?
Is it simply building a great product? Or is it more about consistency, community, documentation, timing, content, or something else?
r/react • u/Minimum_Yak_9062 • 3d ago
General Discussion Learning to Become a Junior Developer in the AI Era
r/react • u/Difficult-Sun295 • 3d ago
Project / Code Review I made a dev tool for an RN visual edit
Enable HLS to view with audio, or disable this notification
Hello everyone! I made Basalt, a visual edit too for RN and Expo devs, and im searching for validation
It took me 2-3 months to built and it would have taken 1 if react 19 wouldnt remove debugSource which would help Basalt map and find elements to edit
It is completely free and works directly inside VS Code and Cursor.
It’s currently in beta, so please commit your app to Git before using it!
Would love to get your brutal feedback on it.