- Notifications
You must be signed in to change notification settings - Fork30
A quick and organized mind map app built with React Flow. Follow the tutorial to learn how to build it yourself.
xyflow/react-flow-mindmap-app
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
This mind map app was created as an example for the blog post"Tutorial: Build a Mind Map App with React Flow", which has a step-by-step guide on how to build a this mindmap (for intermediate or advanced React users).React Flow is a library for creating node-based UIs.
- Quickly create new nodes on drag + mouse-release
- Organize nodes by moving child notes with their parent
- Edit text in nodes
- Using Zustand for state management
- Custom node with an input field
- Using node area as a handle
- Dynamic width and auto focus
Demo:https://react-flow-mindmap.netlify.app
We are usingVite for the development.
Before you start, you need to install the dependencies:
npm install
npm run dev
npm run build
About
A quick and organized mind map app built with React Flow. Follow the tutorial to learn how to build it yourself.
Topics
Resources
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Uh oh!
There was an error while loading.Please reload this page.
