this is not a troll post. change my mind.

1- state is immutable in react. meaning you’ll have to juggle your way around useeffect

2- jsx is basically html in javascript meaning all kinds of hassle

3- why can’t someone use context instead of archaic redux?

4- if you manage to get your first job in react, you’ll be overwhelmed with old class components because you’ll be the one who has to turn them into functional components

5- everything takes 2x(at least) time in react compared to others

6- everyone’s a react developer. it’s saturated as hell.

Hi everyone!

I'm very excited to share a collection of hooks library I just released that I think would do really well for a few reasons:

1. Tree-Shakable: You're only loading the hooks you're importing, which are, on average, 400B per hook import, making it super tiny!

2. Super Detailed Documentation: It includes Stackblitz live demos everywhere, and I'll make sure to keep it that way in the future.

3. Highly Performant: No unnecessary re-renders at all. This is one thing I've been focusing on, and in some places, I'm optionally providing a dependency list in case passed values or callbacks often change.

4. Very Flexible: Providing options whenever possible. If I find something that can be customized, I will make sure to add it.

5. Easily Extendable: This brings me to the next point.

First of all, because it supports tree shaking very well, we can add any new useful hooks to the collection in the future without having to worry about bundle size. Also, I'm planning on updating and releasing a new version once React 19 and the new React Compiler become stable! So, I would really appreciate any contributions from anyone willing to help with that.

Lastly, any kind of contributions are WELCOME! Whether to suggest new features for existing hooks, find new issues and report/work on them, or suggest new useful hooks and work on them if you'd like so we can add them to the collection.

I would really like to make this your go-to hooks library so you can use it in all your React projects and not worry about writing your own hooks.

CHECK IT OUT: https://github.com/mhmdjaw/react-hooks

I'd like to know if you're going to go deeper into react in 2024, and what your reasons are for doing so.

Nowadays vue, solid, svelte are constantly being updated and the performance is getting better and better.

But react stopped for a long time at least on 18.2. Performance hasn't gotten better either.
Is it because of the huge ecosystem that you continue to choose react, or what?

i've been using javascript to build web applications for a while now (almost a year) and I just can't understand why anyone would want to use it. Idk, classes in js are just so complicated to me. The functional way of doing things just seems a lot easier and straightforward. it's like class-based react. I can't ever imagine myself using react in that way. That's why every single time I open react docs to read through it I just get pissed. Why are they still teaching how to use react the class way????????

Does anyone else share the same feelings?

I've never actually worked as a developer so for the experienced devs here; how often do you come across or use the this keyword along with other stuff that come with classes in js?

I consider myself to be an expert react dev. Its been almost 4 years I’ve been working with react. I’ve written a headless hybrid ecommerce application from scratch.

I sometimes struggle what the difference between the best and me? Im not being pompous im just curious

We are a team of 3 devs building a web app, and our current setup of managing environment variables is completely broken.

Right now, whenever someone adds a new API key or changes a database string, they just paste the plain text into a private Discord channel and tell everyone to update their local files.

Inevitably, someone misses the message, pulls the latest main branch, and spends twenty minutes debugging an error that was literally just a missing variable string.

looked at enterprise tools like Doppler or HashiCorp Vault, but they feel like complete overkill for a tiny project and the configuration looks overly complex for what we need.

How are other small teams handling this without losing their minds? Is there a dead simple tool out there that just lets us run a terminal command to sync local files instantly?

I am currently looking to create a web , but I realized that using react I can develop using javascript or typescript , now I want to read from you what is better? I currently know that typescript is a typed laguange so it is really good for developers to know the type of every thing, but I want to read from you your experience , your suggestions and what is the trend currently?

Hello fellas, I am a React developer. I'm developing personal projects but I don't know how to handle the backend of the project. Are there any platforms/tools I can use for the backend? I don't want to dive into learning Node/Express, looking for an easy way. I need this to store users' data easily.

I consider using tailwind css. I was wondering if anyone could elaborate about potential disadvantages and cons of the framework. Thank you!

I'm returning to React dev after taking a break for 4 years or so and wanted to start a hobby project. Hot damn, are things more complicated!

ReactRouter used to be a routing solution that you'd simply install. Now it wants your entire project to sit on it's framework from the ground-up?

People are talking a lot about TanStack, but I just want a router, I can do the rest myself. Why do I need to include the entire Tan ecosystem in my project?

I'm not looking to build the next Google or YouTube, just looking to make a minimal GUI that I can run little light-weight SPAs on for a simple GUI, or load onto an ESP micro-controller to give it a web UI. I'm not looking for server-side anything.

I'm not sure if I'm confused and missing something obvious that I can't quite see. What's an easy way to start a new React SPA project these days?

I made the switch from css, to styled components, and then to tailwind when starting my current project.

I hated it for about 4 hours, then it was okay, and now I feel sick thinking about ever going back to work in old projects not using it.

But I'm likely biased, and I'd love to know why you're not using it? I'm sure great justifications for alternatives exist, and I'd be very curious to hear them.

So...why are you not using tailwind?

I've spent the last few years working with Next.js, and while I love the React ecosystem, I’ve felt increasingly bogged down by the growing complexity of the stack—Server Components, the App Router transition, complex caching configurations, and slow dev server starts on large projects.

So, I built JopiJS.

It’s an isomorphic web framework designed to bring back simplicity and extreme performance, specifically optimized for e-commerce and high-traffic SaaS where database bottlenecks are the real enemy.

🚀 Why another framework?

The goal wasn't to compete with the ecosystem size of Next.js, but to solve specific pain points for startups and freelancers who need to move fast and host cheaply.

1. Instant Dev Experience (< 1s Start) No massive Webpack/Turbo compilation step before you can see your localhost. JopiJS starts in under 1second, even with thousands of pages.

2. "Cache-First" Architecture Instead of hitting the DB for every request or fighting with revalidatePath, JopiJS serves an HTML snapshot instantly from cache and then performs a Partial Update to fetch only volatile data (pricing, stock, user info).

• Result: Perceived load time is instant.

• Infrastructure: Runs flawlessly on a $5 VPS because it reduces DB load by up to 90%.

3. Highly Modular Similar to a "Core + Plugin" architecture (think WordPress structure but with modern React), JopiJS encourages separating features into distinct modules (mod_catalog, mod_cart, mod_user). This clear separation makes navigating the codebase incredibly intuitive—no more searching through a giant components folder to find where a specific logic lives.

4. True Modularity with "Overrides" This is huge for white-labeling or complex apps. JopiJS has a Priority System that allows you to override any part of a module (a specific UI component, a route, or a logic function) from another module without touching the original source code. No more forking libraries just to change one React component.

5. Declarative Security We ditched complex middleware logic for security. You protect routes by simply dropping marker files into your folder structure.

• needRole_admin.cond -> Automatically protects the route and filters it from nav menus.

• No more middleware.ts spaghetti or fragile regex matchers.

6. Native Bun.js Optimization While JopiJS runs everywhere, it extracts maximum performance from Bun.

• x6.5 Faster than Next.js when running on Bun.

• x2 Faster than Next.js when running on Node.js.

🤖 Built for the AI Era

Because JopiJS relies on strict filesystem conventions, it's incredibly easy for AI agents (like Cursor or Windsurf) to generate code for it. The structure is predictable, so " hallucinations" about where files should go are virtually eliminated.

Comparison

I'm currently finalizing the documentation and beta release. You can check out the docs and get started here: https://jopijs.com

I'd love to hear what you all think about this approach. Is the "Cache-First + Partial Update" model something you've manually implemented before?

Thanks!

Hey r/reactjs! 👋

I've been seeing a lot of debates about Context API vs Redux lately, and as someone who's shipped multiple production apps with both, I wanted to share my honest take on why Redux + Redux Toolkit often comes out ahead for serious applications.

The Performance Reality Check

Context API seems simple at first - just wrap your components and consume values. But here's what they don't tell you in the tutorials:

Every time a context value changes, ALL consuming components re-render, even if they only care about a tiny piece of that state. I learned this the hard way when my app started crawling because a single timer update was re-rendering 20+ components.

Redux is surgically precise - with useSelector, components only re-render when their specific slice of state actually changes. This difference becomes massive as your app grows.

Debugging: Night and Day Difference

Context API debugging is basically console.log hell. You're hunting through component trees trying to figure out why something broke.

Redux DevTools are literally a superpower:

• Time travel debugging (seriously!)

• See every action that led to current state

• Replay actions to reproduce bugs

• State snapshots you can share with teammates

I've solved production bugs in minutes with Redux DevTools that would have taken hours with Context.

Organization Gets Messy with Context

To avoid the performance issues I mentioned, you end up creating multiple contexts. Now you're managing:

• Multiple context providers

• Nested provider hell in your App component

• Figuring out which context holds what data

Redux gives you ONE store with organized slices. Everything has its place, and it scales beautifully.

Async Operations: No Contest

Context API async is a mess of useEffect, useState, and custom hooks scattered everywhere. Every component doing async needs its own loading/error handling.

Redux Toolkit's createAsyncThunk handles loading states, errors, and success automatically.

RTK Query takes it even further:

• Automatic caching

• Background refetching

• Optimistic updates

• Data synchronization across components

Testing Story

Testing Context components means mocking providers and dealing with component tree complexity.

Redux separates business logic completely from UI:

• Test reducers in isolation (pure functions!)

• Test components with simple mock stores

• Clear separation of concerns

When to Use Each

Context API is perfect for:

• Simple, infrequent updates (themes, auth status)

• Small apps

• When you want minimal setup

Redux + RTK wins for:

• Complex state interactions

• Frequent state updates

• Heavy async operations

• Apps that need serious debugging tools

• Team projects where predictability matters

My Recommendation

If you're building anything beyond a simple CRUD app, learn Redux Toolkit. Yes, there's a learning curve, but it pays dividends. RTK has eliminated most of Redux's historical pain points while keeping all the benefits.

The "Redux is overkill" argument made sense in 2018. With Redux Toolkit in 2024? It's often the pragmatic choice.

What's your experience been? I'm curious to hear from devs who've made the switch either direction. Any war stories or different perspectives?

I created a custom form validation hook.Its a simple hook and I felt I didn't needed react hook forms for just simple form validation. For simpe validation writing that much code and loading the whole library felt not right. Maybe I am wrong.

I've been working professionally with React for about 3 years now. I've been involved in large, enterprise-level projects, handled complex UIs, state management, performance issues, all of that.

But lately, I've been having this recurring feeling that React is... too easy? Or at least, very repetitive. I don’t feel like I’m really “engineering” anything. I’ve reached a point where I rarely feel challenged—most of the time, I already know exactly what to do, and it feels like I’m just assembling things in a predictable way.

It makes me question myself sometimes am I really a developer? Shouldn't real engineering involve more problem-solving or invention?

Also, the job market is flooded with React developers. It’s no longer a “special” skill. Everyone seems to know it or be learning it, and that kind of diminishes how I feel about it.

Am I alone in thinking this? Is this just a phase of developer growth? Or do I need to explore more complex areas maybe move closer to systems-level programming, backend, or something else?

Would love to hear your thoughts especially from those who’ve been down this path.

https://louayzouaoui.com/

Has anyone else found Tanstack Start + Query very complex?

Looking as this createFileRoute & the component page there is a lot of boilerplate going on:

export
 const Route = createFileRoute('/(app)/_layout/clients/')({
  component: ClientListPage,
  validateSearch: searchSchema,
  errorComponent: () => <div>Error loading clients</div>,
  loaderDeps: ({ search: { sort, order } }) => ({ sort, order }),
  loader: async ({ context: { queryClient }, deps: { sort, order } }) => {
    
await
 queryClient.ensureQueryData({
      queryKey: clientKeys.list(sort, order),
      queryFn: () => getClients({ data: { sort, order } }),
    })
  },
})


function ClientListPage() {
  const queryClient = useQueryClient()
  const navigate = useNavigate()
  const { sort, order } = Route.useSearch()


  const { data: clients } = useSuspenseQuery({
    queryKey: clientKeys.list(sort, order),
    queryFn: () => getClients({ data: { sort, order } }),
    staleTime: 5 * 60 * 1000,
  })

I also find the use of the query client with the router complex.

Hi I'm working in a Fortune 500 Company. In all my life I have been doing hobby react projects and trying out different frameworks for fun but now I'm responsible for choosing a tech stack for a critical frontend component which will serve huge traffic across different geographic locations. But I'm not feeling confident enough to suggest a stable enough type safe framework for long term. I have some preferences though keep it on React because I don't know Angular. If it is based on typescript it would be better. Complile time should be fast like SWC. Hit me with some suggestions and your reasons..

I got the chance to show my worth to a marketing agency and i build them a react/nextjs website.
However, its tie they focus on SEO.
The marketing department wants to use a plugin/integration called : YOAST SEO.

Reasons:
Its easy to edit live and click a button to publish.
Steps:
Login WP, open blog, edit, hit enter.

Whereas using React with a CMS(Contentfull).
Log into CMS, copy the text into a SEO tool, edit, and paste back into CMS, then hit enter in the CMS to publish edits.

Edits such as:
suggestions of Keywords/ text in the content.
page meta data, etc.

How can i integrate something to my CMS, in this case Contentfull, to replicate YOAST SEO functionality in my next.js app?

the only hints or possible solutions i have at the moment are:

1. Headless WP with a next.js/react front end using Contentfull ??

Just did first relatively small app with React 19 and the only difference in this case was that bundle size is 10kB larger. There's not much to the app itself, a modest number of components, some basic login/register, display data from backend functionality and such.

I'm wondering why even use latest version if I'm not using any new features. In fact it only makes the application worse. Devtools code coverage reports 55% of the code is unused. That's complete waste and delay for loading the page. Surely I can use an older version but it's kinda silly to lock the version because of unused features.

Not every website is netflix , e-commerce or some AI startup. Regular SPAs are still common and they can have a lot value. Sometimes it's enough to have a dynamic islands in otherwise static page.

Anyone else feeling like they're not the target audience of the library? Like noone cares about your use case, just go and use something else...