A new library and template using React Hooks for creating Streamlit Components

Hi community,

I created a thin wrapper of streamlit-component-lib for React Hooks and function-based components, and also set up a component template using it.

I like hooks and function-based components rather than class-based ones and think some of you are the same.
I hope these are helpful, and welcome any feedback :slight_smile:


This is very nice, I much prefer function based also and being time poor I’m usually not following best practises when making components, really appreciate this template, maybe I’ll make some better components now, thanks!

1 Like

Nice :slight_smile: thanks for creating this @whitphx

There is a « components template » section in the [tracker]{Streamlit Components - Community Tracker) , you can add your template there so we can keep track of it

I also think you can make a MR on the component template readme in the community template section

Have a nice day,

@andfanilo Thank you, I did both :smiley:

1 Like

This is great Yuichiro!

I’ve also shared your new library on our Creators’ channel :slight_smile:


1 Like

I agree, and I did the same in my Auth0 authentication component using Next.js. It’s nice to have a semi-official template though that promotes this. Thanks, @whitphx!!

1 Like

I rewrote my streamlit-webrtc component to use the hooks- and functions-based style with this library: Fix to use hooks by whitphx · Pull Request #424 · whitphx/streamlit-webrtc · GitHub :v: