25 Hand-Picked ReactJS Libraries You Probably Didn't Know Existed 😍

Using these will put Web Developer on Steroids.

{ 1 } React Hot Toast

The Best Toast in Town. Smoking hot React notifications.

Add beautiful notifications to your React App

{ 2 } React Content Loader

SVG-Powered component to easily create placeholder loadings (like Facebook's cards loading).

{ 3 } React Filepond

A new way to upload files
- Multiple Input Formats
- Image Optimization
- Responsive
- Async or Sync Uploading

{ 4 } React Notion X

Fast and accurate React renderer for Notion. TS batteries included. ⚡ ️

{ 5 } React Select

A flexible and beautiful Select Input control for ReactJS with multiselect, autocomplete, async and creatable support.

{ 6 } Sweet Alert

A beautiful replacement for success messages, error messages or info messages

{ 7 } React Query

Performant and powerful data synchronization for React.

{ 8 } React Hook Form

Less code. More performant

Reducing the amount of code you need to write, and removing unnecessary re-renders are some of the primary goals of React Hook Form.
{ 9 } React Infinite Scroller

Infinitely load content using a React Component.

{ 10 } React Motion

A spring that solves your animation problems. Level up your animation game.

{ 11 } React DnD

A React utility to help you build complex drag and drop interfaces while keeping your components decoupled.

{ 12 } React Desktop

A JavaScript library built on top of Facebook's React library, which aims to bring a native desktop experience to the web, featuring many macOS Sierra and Windows 10 components.

{ 13 } Splitbee

Track and optimize your online business with Splitbee. Your friendly analytics & conversion platform.

{ 14 } React Window

React components for efficiently rendering large lists and tabular data.

{ 15 } Stripe Elements

Stripe Elements are rich, pre-built UI components that help you create your own pixel-perfect checkout flows across desktop and mobile.

{ 16 } Chakra UI

A simple, modular and accessible component library that gives you the building blocks you need to build your React applications.

{ 17 } Draft JS

Rich Text Editor Framework for React.

Draft.js fits seamlessly into React applications, abstracting away the details of rendering, selection, and input behavior with a familiar declarative API.

{ 18 } ChartJS

Build beautiful charts in minutes with Chartjs, Dashboards will looks sexy like never before.

{ 19 } React Slick

React carousel component. One of the best sliders out there to showcase anything.

{ 20 } React Auto Suggest

WAI-ARIA compliant autosuggest component built in React

{ 21 } React Burger Menu

An off-canvas sidebar React component with a collection of effects and styles using CSS transitions and SVG path animations.

{ 22 } React Spinners

A collection of loading spinner components for react

{ 23 } React Bootstrap Datatable

Next Generation of react-bootstrap-table. Datatable made easy like never before.

{ 24 } Styled Components

styled components is the result of wondering how we could enhance CSS for styling React component systems.

{ 25 } Semantic UI

Semantic is a development framework that helps create beautiful, responsive layouts using human-friendly HTML.

Thanks for stopping and checking these resources, I'm sure it's going to help you at some point in time.

1. Follow @MakadiaHarsh for such tips and tricks

2. Quote retweet the first and share what do you think of this?

Cheers! 🥂

• • •

Missing some Tweet in this thread? You can try to force a refresh

Keep Current with Harsh Makadia

Harsh Makadia Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!


Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @MakadiaHarsh

15 Sep
Learning programming is hard.

I felt like quitting 6 years back when I started my web development journey.

But I survived in TECH and I love it now.

Here are 21 lessons I wish I'd known earlier in my career.

{ 1 } Choose a language

There are an unbelievable number of programming languages out there.

But, the thing is, you need to start slow.

Pick one thing at a time and practice as much as possible. Then, you can move on to the next.
{ 2 } Understand a programming concept

You may be tempted to cut corners when learning a new programming language. While it's OK to use Google to find answers, don't by-heart the syntax.

If you don't remember the syntax that's fine, but remembering the concept is a must.
Read 25 tweets
10 Sep
17 Killer Websites for Web Developer 🤯

99.8% don't know all of them.

1. Random Image via API

The most powerful photo engine in the world.

The Unsplash API is a modern JSON API that surfaces all of the info you’ll need to build any experience for your users

2. Embeddable Widget Apps for Notion

Add 3rd party apps embed or create a custom embed for your Notion Document.

Read 20 tweets
8 Sep
Hit 8K 🎉
Thank you everyone! 🙏🏻

I tweet about Web development, No-code Hacks, Life Lessons.

Compound Growth is real! 🔥

0 - 2k ➜ 9 years
2k - 4k ➜ 79 days
4k - 6k ➜ 37 days
6k - 8k ➜ 35 days

Here are top threads 🧵 that'll skyrocket your growth ↓
Optimization of the profile is key for your growth.

Here are a set of concrete, specific suggestions that will help you mold your profile into something that impresses those that read it.

Read More
Tweet Formats that worked for me

Experimenting with different tweet formats is a great way to find out how your tweets resonate with your followers.

Read More
Read 16 tweets
7 Sep
If you want to quickly hack web development, learning no-code tools is an excellent way to go.

Here are some highly useful, resources to guide you in mastering it.

1. Nocode MBA

No Code MBA teaches you how to turn your idea into reality - all without code.

🔗 nocode.mba
2. Nocodery

Code is a thing of the past. Start creating apps and websites easier, faster, and without any special skills.

🔗 dev.nocodery.com/tutorials
Read 21 tweets
6 Sep
Supercharge your React App Performance by 10X with these handy tricks.

10 ultimate hacks every Web Developer should know about.

1. useState Lazy Initialization With Function

There are times when we need to set the initial value of the state from some variable or from a function that returns a value.
Since our function is in the body, every time a re-render happens, this function is getting called even if its value is not required (we only need it during the initial render).

+ Use the above-mentioned hack to boost performance
Read 20 tweets
5 Sep
These 15 life lessons can radically change your life!

They will help you find happiness and keep improving yourself for years to come

Surround yourself with people who are making better progress than you.
The more you learn, the more you will grow 📈
Read 17 tweets

Did Thread Reader help you today?

Support us! We are indie developers!

This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!

Follow Us on Twitter!