DEV Community

5 Small and Hidden React libraries You Should Already Be Using

Al - Naucode on December 04, 2022

If you, like me, love finding small gems in the NPM directory to improve your development process, today is your lucky day. I am starting a new se...

Read full post

Hussein Kizz • Dec 8 '22

Thanks for sharing, surely loved this especially the emoji package, will try it out.

Wilmela • Dec 7 '22

Thanks for sharing.

Azooz • Dec 7 '22

Thanks for sharing :)

Al - Naucode • Dec 7 '22

Glad it helped you!

Jason Boxman • Dec 7 '22

Thanks for sharing!

Danny Fallas • Dec 5 '22

I’ll take the change to share my module here npmjs.com/package/@dannyman/use-store , I’ve been using it on many apps that are on production right now and it becomes really helpful on them.

insidewhy • Dec 7 '22

Why do you base64 encode the data?

Danny Fallas • Dec 7 '22

To make it non readable to most of the non tech users in case there is something sensitive there

insidewhy • Dec 7 '22

Doesn't seem worth it. The hit to performance or the inconvenience for debugging.

Also, why shouldn't you be able to read your own data? What's sensitive about that? And it doesn't even stop a and actor from easily reading the data.

Al - Naucode • Dec 7 '22

Imagine you are debugging and you just use console.log(oneObject, anotherObject, oneVar, "The code took X time to run");

That is not that organized. I am not telling in the article that it will be more comfortable to use. But it will be a little more organized.

And since you should never deploy console.log to a production build, no bad actor should be see them.

In the end, it depends on you if using these methods or not, in this post I am just bringing attention to a few extra functions.

Danny Fallas • Dec 7 '22

Will think about adding it as an option.
For the business logic when created, it was needed. Don’t want to give out data easily to everyone if you are in a shared computer , the idea is to add better encryption later.

Lovepreet Singh • Dec 4 '22

Thanks, Really helpful.

👉 Kindly check my blog too and suggest any improvements dev.to/lovepreetsingh/what-is-dock...

José Pablo Ramírez Vargas • Dec 4 '22

Thanks for the post. I have bookmarked it because I will be exploring that Logt package in more detail.

I have a counter offer for you: Instead of urlcat, use wj-config. It will do what urlcat does, but it does this from per-environment configuration values. It takes care of your configuration data in the same way .Net Configuration does, relieving you from having a million fake environment variables in .env files, plus you get the URL functions that do route value replacement and query string addition.

Al - Naucode • Dec 4 '22

Oh, sounds like a package I need to try! I will check it tomorrow, hopefully in the next chapter of this series it will be added

grzesiek-ds • Dec 4 '22

React-loadable literally says that you should migrate to React.lazy since its not maintained for quite long time. Please do not recommend others a deprecated libraries, Reading docs does not hurts.

Al - Naucode • Dec 4 '22

Yeah, React-loadable is deprecated. Loadable-components is not the same library. In fact, React-loadable recommends to migrate to React.lazy or loadable-components. This is the one you say (npmjs.com/package/react-loadable) and this is the one I talk about: github.com/gregberge/loadable-comp...

Shifa Ur Rehman • Dec 4 '22

Ohohohoho! Sick burn!

NoodleOfDeath • Dec 7 '22

Please read the docs yourself? react-loadable is not the same as @loadable/components

Ido Schacham • Dec 5 '22 • Edited

urlcat looks cute. Nonetheless, it is not tiny - 10.5 KB minified and gzipped. I would expect 'tiny' to be below 1 KB or something similar, especially for such a specific low functionality library.