Building It Step By Step
Controls and MiniMap
Learn how to enhance the workflow with a mini map and control buttons.
Getting Started
Navigate to the corresponding folder:
Terminal
cd step-10-controls-minimap
Install the dependencies:
Terminal
npm install
Then run the project:
Terminal
npm run dev
Controls and MiniMap
When you open the application, you'll notice a mini map that visualizes the workflow, along with controls for zooming and fitting the workflow to the viewport. These components are part of the React Flow abstraction layer located in src/shared/lib/flows.