[![Contributors][contributors-shield]][contributors-url] [![Forks][forks-shield]][forks-url] [![Stargazers][stars-shield]][stars-url] [![Issues][issues-shield]][issues-url] [![MIT License][license-shield]][license-url] [![LinkedIn][linkedin-shield]][linkedin-url]
Logo

React Toolkit

Bootstrapped with https://www.npmjs.com/package/react-component-lib-boilerplate A collection of components, hooks and patterns to easily build react applications


· Report Bug · Request Feature

## About The Project The aim of this project is to put together in a library all the best practices I use to easily build powerfull react applications. The library at the moment contains just - some fully themable primitive UI components built on top of styled-system (Box, Row, Col, Button, Text, TextIntput) - an hook to easyly dispatch thunks with redux and globally keep track of their state - an hook built on top of react-query to easily work with api requests in fully typed fashion At the moment I am putting all together in this package because, but I am willing to split this 3 concepts (ui utilities, redux utilities and networking utilities) under separated libraries By using this library you will be able to: * Easily implement responsive and themable layouts without using css in a fully typed fashion * Easily dispatch redux thunks and globally track their state (loading, success, error) * Easily implement api requests globally track their state (loading, success, error) and related data A companion node cli is under development

(back to top)

### Built With * [Styled System](https://styled-system.com/) * [Styled Components](https://styled-components.com/) * [Redux](https://redux.js.org/) * [Reselect](https://github.com/reduxjs/reselect) * [React Query](https://react-query.tanstack.com/)

(back to top)

## Prerequisites you need to have the following libraries already installed: * [Styled System](https://styled-system.com/) * [Styled Components](https://styled-components.com/) * [Redux](https://redux.js.org/) * [Reselect](https://github.com/reduxjs/reselect) ## Getting Started Install the library from npm registry ### Installation This is an example of how to list things you need to use the software and how to install them. * npm ```sh npm i apperside/react-toolkit ``` * yarn ```sh yarn add apperside/react-toolkit ```

(back to top)

## Usage TODO

(back to top)

## Roadmap - [x] Publish initial version - [] Add documentation - [] Split in different packages (ui-core, redux-utils, api-utils) - [] Much more 😅 See the [open issues](https://github.com/apperside/react-toolkit/issues) for a full list of proposed features (and known issues).

(back to top)

## Contributing Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**. If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again! 1. Fork the Project 2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`) 3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`) 4. Push to the Branch (`git push origin feature/AmazingFeature`) 5. Open a Pull Request

(back to top)

## License Distributed under the MIT License. See `LICENSE.txt` for more information.

(back to top)

## Contact Your Name - [@your_twitter](https://twitter.com/your_username) - email@example.com Project Link: [https://github.com/apperside/react-toolkit](https://github.com/apperside/react-toolkit)

(back to top)

[contributors-shield]: https://img.shields.io/github/contributors/apperside/react-toolkit.svg?style=for-the-badge [contributors-url]: https://github.com/apperside/react-toolkit/graphs/contributors [forks-shield]: https://img.shields.io/github/forks/apperside/react-toolkit.svg?style=for-the-badge [forks-url]: https://github.com/apperside/react-toolkit/network/members [stars-shield]: https://img.shields.io/github/stars/apperside/react-toolkit.svg?style=for-the-badge [stars-url]: https://github.com/apperside/react-toolkit/stargazers [issues-shield]: https://img.shields.io/github/issues/apperside/react-toolkit.svg?style=for-the-badge [issues-url]: https://github.com/apperside/react-toolkit/issues [license-shield]: https://img.shields.io/github/license/apperside/react-toolkit.svg?style=for-the-badge [license-url]: https://github.com/apperside/react-toolkit/blob/master/LICENSE.txt [linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge&logo=linkedin&colorB=555 [linkedin-url]: https://linkedin.com/in/simonegaspari [product-screenshot]: images/screenshot.png