Question regarding the use of libraries in React

I am rebuilding and old project that I originally built with jQuery and now I decided to turn it into a fullstack project using the MERN stack. This is the project that I am talking about.

So far for the front-end I have used these libraries:

"axios": "^0.18.0",
"joi-browser": "^13.4.0",
"react-responsive-carousel": "^3.1.45",
"react-reveal": "^1.2.2",
"react-router-dom": "^4.3.1",
"react-spinners": "^0.4.8",
"react-toastify": "^4.5.1"

I probably don’t need react-reveal because I’m only using this library for the fade in effect of the navbar, which I could probably do myself using CSS but my thinking is, why bother? I mean it’s already done and it’s a reliable library. At this point I am just tired (I already built the backend) and to be honest it feels odd to do something from scratch when it’s already done. It’s like reinventing the wheel just because.

Same with the carousel, I could use react-reveal to build a custom carousel but then I need to add the CSS and the functionality for the next and prev buttons, I don’t want to go through all that if I can just use a library that works for my purpose.

So maybe I am just lazy and I wonder if I am doing this right/wrong way. How many libraries do people usually use for a small project like this? What are the const of using so many dependencies?

I have no great opinion on this but if you are comfortable using an external library then use that. (I would myself). It probably doesn’t add much weight to the page anyway compared to other factors.

It is a hard question to answer and it depends a lot on the project/approach/constrains.

If you are a beginner, trying to learn, I would at least try to implement common UI components from scratch (carousel, dropdowns, spinners, date pickers, etc). After you struggle through that part, you understand better why and when to use external libs to achieve the same goal.

If you are already familiar with the way those common components work and how to implement them, I see no issue with pulling some battle tested libs that work across browsers and are robust. Being conscious of bundle size is also important!

2 Likes

I keep reading/hearing that developers don’t do things from scratch, the reasoning is that after you build a couple of projects you should have like a small library of components that you can reuse in different apps, of course you will probably still need to make a few changes but it’s still better than starting from 0.

I do agree with you though, I think one should be able to build a couple of those components that you mentioned to understand how things work. I have built carousels with vanilla JS when I first started, I am sure with React it would be even easier to build a reusable carousel component. But building it from scratch now for me it doesn’t feel very productive, so I rather use a library that works.

1 Like