typesafe-actions VS react-loading-skeleton

createAction — lets you define action creators, similar to typesafe-actions. I'm a TypeScript die-hard so type safety is non-negotiable. 😆

Actually implementing a separate interface or type per action gets clunky; that's where adding libraries can help. typesafe-actions is an easy, quality library that I've used for this on a previous project. reduxjs-toolkit is even better; it provides some more structure and several useful features. As a bonus, it includes Immer built in.

Also a library reccomendation for anyone who prefers to stick with the official Redux ecosystem: https://github.com/piotrwitek/typesafe-actions. Makes the seclector/action/reducer/types store setup extremely clean and scaleable.

But as a fellow n00b there are some suggestions which will save you a crap tonne of headache (i.e. if using Redux, the typesafe-actions library gives the BEST modern framework for doing it in)

No, this is not because of a not-invented-here syndrome. A promising library is react-loading-skeleton, among many others.

react-loading-skeleton Create skeleton screens that automatically adapt to your app

One last fun implementation detail was working with our use of react-loading-skeleton (I love this effect, and I feel it really does work in keeping the user engaged and under the impression of the app working while data loads). To make this effect still work well in dark mode, I took the opportunity to crack open the source, and replicate a few key values as found in this snippet of our CSS.

I'll be working on a new major version of react-loading-skeleton. Check out the roadmap here!