My current React Boilerplate

Hello there!

I'm gonna start 2022 by sharing, because, you know what they say, sharing is caring. I wonder if this applies to "clonable" stuff though... 🤔

I've been playing around a lot lately, with React. And whenever I'm doing anything a little bit "complex" with multiple components, I always need to set up four things, as a base architecture:

• A Redux Store, to handle a Global State which is, really comfortable. I know there is the Context API now, but I really like using Redux and I'm more proficient with it. Also I always install immer to manipulate state values easily.

• A Router to handle the well... routing of the app, and navigate through "pages". This is achieved through the use of React-Router V6.

• A "generic" component, able to add redundant content on all page while displaying children nested inside. I like this feature very much, clean and easy to maintain page structure.

• A custom Hook, based on useState, able to fetch data from an API (just setup the server URL in the first fetch, then set the error code. It's ready to be used anywhere, just needs a query (endpoint) to function. Then again, nothing revolutionary, but cool not to be reinventing the wheel each time, right?

I also install Sass support since I really like this, so its included, but, hey, do whatever you want with it, you're still free to add styled components or other modules.

Anyways, as I said, this is nothing revolutionary, but it might be a great starting point for you to build from if you want to quickly build a react-app requiring API calls, state management and routing!

It saves me some time. Hope it does for you too!

Also if you came here to see how I code, well then this might be a good place to start to gather some preliminary information ;)

Any feedback on how to improve this, or on how you used it is welcome :)

Link to the github repository: github.com/ClementBenezech/react-redux-rout..