A Chrome DevTool built for developers to visualize the flow of state throughout their application.
reactFLO is a visualization tool for React developers that allows users to view a visual representation of an application's component hierarchy as well as the flow of state through the application.
Whether you are onboarding a new codebase or looking to expand you site, reactFLO can can help you and your team make sense of the way data is being passed through an application and empower you to make informed decisions about the structure of you components
If you are interested in altering or expanding the functionality of reactFLO you can access the source code and build out your own version of the application by following these steps: 1. Clone this repository 1. Run
npm iin your terminal to install dependencies 1. Make your changes 1. Run
npm run buildto build out the application (note: watch is active) 1. In Chrome, navigate to your extensions 1. Make sure that developer mode is toggled on (found in the top right corner) 1. Click on the button labeled:
Load unpacked1. Select the folder:
~/reactFLO/build1. Make sure to refresh the reactFLO extension every time you make changes to the files
npm testin the terminal. This will initialize the testing suite. Jest is used to run unit tests on the internal library and Enzyme is used alongside Jest to run integration testing on the front end code.