To read more articles like this, visit my blog
Note: This article is from 2 years ago. So, some of the technologies are outdated.
React is simply...
For further actions, you may consider blocking this person and/or reporting abuse
Is this list generated by OpenAI from from 2018? The entire list is outdated.
Everything listed here was true maybe 5 years ago. Now everything has changed.
tslint and jslint -> are dead/abandoned.
Formic - causes horrible performance / re-render problems.
State management -> jotai does everything, all in one, with ease and without having to maintain a global app state, you can just use the depending atom-variables directly.
The use of Redux is discouraged by its own authors (redux toolkit is recommended instead). Redux got so much bad flag because of its verbosity. Having to use it is not a requirement/given at all, more like an indication of historic, old (or less charitable legacy) code.
All of your listed styling options are no longer recommended, because their design causes extra re-renders in SSR (Server Side Rendering).
Styling is best done by tailwind, it completely beats down any other competition (all css-in-js) in ease of use.
People vastly underestimate how productive you can be if you can just copy the html from many other tailwind components, templates or even complete websites.
UI Libraries -> shadcn practically beats any other in popularity rise and ease of styling. Alternative radix themes.
MUI (I used and migrated from it) -> is horrible if you want to style the components yourself. It may be okay if you are a backend engineer never to customize how things look but its unacceptable if you are a frontend developer who wants to decide how the UI elements look.
Styleguidist - is questionable as well. Every new framework/build-tool like Next.js/Vite can render MDX (markdown with react components inside).
100% agree, except on the part that MUI is difficult to customize. They include many examples of how to completely override the default material styling. At the core you're just left with the material semantics and even those you can override now, without losing strong typing. Thats said, I'm hoping that all these styling technologies will be surpassed by PandaCSS (tailwind has some really big drawbacks as well).
That are the big drawbacks of Tailwind CSS, except the package size?
It is really bad at doing dynamic stuff, even with jit and safelist and applying conditional styling based on component props turns into a gigantic mess. CVA solves all those problems.
So you mean to say it only has big drawbacks if you do not use the most common ecosystem tools like tailwind-merge and CVA?
I use it daily and have not encountered any issues with tailwind itself.
I love how you can just grab and copy the html code from any other tailwind component you can find on the web and it just looks completely the same. No other styling solution can do that.
Honestly, I would not count something a big drawback if there is an easy and clean solution (to the problem of applying conditional styling -> tailwind-merge and class-variance-authority).
A big drawback for me is if there are absolutely no solutions and you have to debug, fix and solve it yourself.
Tailwind merge doesn't solve the problems with dynamic class names and you still have to write a lot of conditionals inside your components with tw merge. Yes you can use CVA with tailwind to solve this. Have a look at PandaCSS...
💯💯💯
I can agree with many of the comments that this looks like a very out dated list generated by ChatGPT. These tools all sound great if you were talking to me 5 years ago. But in these days, a lot of these tools are not the first choice go to for developing react applications.
I mean literally, the link to
react-querypoints to v3. We are currently on v5.I'd recommend deleting this post because it is misleading.
Excellent post!
A small suggestion, if I may:
I personally had a very bad experience working with gatsby (granted, it was some years ago and things probably improved since). A couple of better alternatives to
Next.jsIMHO are Remix.run and a react SPA usingVite.Gatsby is dead (or you can call it in support mode if you are more charitable), abandoned by its own creators.
Using Vite, Next.js, Remix -> is 100% better, easier and more recommended.
I recommend using Playwright over Cypress these days. It's a way better developer experience and uses modern js conventions.
Hey, this article appears to have been generated with the assistance of ChatGPT or possibly some other AI tool.
We allow our community members to use AI assistance when writing articles as long as they abide by our guidelines. Please review the guidelines and edit your post to add a disclaimer.
Failure to follow these guidelines could result in DEV admin lowering the score of your post, making it less visible to the rest of the community. Or, if upon review we find this post to be particularly harmful, we may decide to unpublish it completely.
We hope you understand and take care to follow our guidelines going forward!
Hello Sloan. Sorry for the confusion.
Just to clarify, this article is not generated by any AI tool.
I republished this post. The original post is from 2021.
You can check it here
medium.com/p/a9ab18946224
Also, You will see that is also my article, so I am not stealing it from anywhere as well.
I appreciate you taking a look at it. I hope my explanation clears everything.
Please let me know if you need any details.
@mohammadfaisal
If it is copied/outdated just delete this. It will pass wrong information to learners/beginners.
90% of the article is still relevant.
Why would this be copied?
Adding a 2 years old article regarding information technology especially (programming) when you are mentioning 45 packages doesn't make sense. I confirmed what @adaptive-shield-matrix @barrymichaeldoyle mentioned in comment.
The main concern is many people might read your article and they will have wrong information and knowledge regarding libraries (in present context). Even if you want to post old article make sure you go through it properly and make necessary updates. Wayback machine shows you made updates in article which is fine but by the time you made updates, many users had already read article who now have wrong information.
Medium and articles are powerful. Use wisely.
With great power comes, great responsibility.
PS.
Apologies if I have gotten all wrong.
Thank you. Amazing post.
I suggest:
State Management
Zustand: github.com/pmndrs/zustand
Easy Peasy: (abstraction of Redux) easy-peasy.vercel.app/
Scaffolding
Create T3 create.t3.gg/
UI
Shadcn ui.shadcn.com/
Radix radix-ui.com/
Thank you for pulling together such a thorough list!
Already using several of these, but now I've got some good new ones to check out as well :)
Excellent post!
solve javascript library problem with javascript =) funny