# graphif/project-graph

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/graphif-project-graph).**

4,168 stars · 266 forks · TypeScript

## Links

- GitHub: https://github.com/graphif/project-graph
- Homepage: https://graphif.dev
- awesome-repositories: https://awesome-repositories.com/repository/graphif-project-graph.md

## Topics

`canvas` `canvas2d` `canvasjs` `cross-platform` `graph-algorithms` `project-graph` `reactjs` `reactjs-project` `tailwind` `tailwind-css` `tauri-app` `vite` `vitejs`

## Description

Project-graph is a visual workspace designed for managing complex information through node-based knowledge graphs. It provides a direct manipulation interface that allows users to organize data into logical networks, mapping non-linear thoughts and project workflows through interconnected nodes and bidirectional links.

The system distinguishes itself through an event-sourced state management model that records every modification as a discrete action, enabling precise undo and redo capabilities. It incorporates a reactive layout engine that automatically calculates node spacing and connection paths during interaction to maintain visual clarity and prevent element overlap.

The platform supports comprehensive visual knowledge management, including tools for labeling connections, customizing interface navigation, and structuring data into nested graphs. To ensure data integrity and performance, the system utilizes automatic real-time persistence and binary serialization to optimize storage efficiency for large datasets.

## Tags

### Part of an Awesome List

- [Notes and Knowledge](https://awesome-repositories.com/f/awesome-lists/productivity/notes-and-knowledge.md) — Organizes complex ideas and notes into interconnected networks to move beyond traditional folder structures.
- [Visual Workflow Organization](https://awesome-repositories.com/f/awesome-lists/productivity/task-and-project-management/visual-workflow-organization.md) — Maps logical steps and project structures using a drag-and-drop interface to clarify dependencies.
- [Node Graph Organization](https://awesome-repositories.com/f/awesome-lists/productivity/task-and-project-management/visual-workflow-organization/node-graph-organization.md) — Allows users to connect nodes using drag-and-drop interactions to map complex workflows and logical relationships. ([source](https://github.com/graphif/project-graph/tree/master/app))

### Business & Productivity Software

- [Non-Linear Knowledge Bases](https://awesome-repositories.com/f/business-productivity-software/non-linear-knowledge-bases.md) — Supports nested graphs and bidirectional links to create flexible, non-linear thought maps.
- [Visual Diagramming Tools](https://awesome-repositories.com/f/business-productivity-software/visual-diagramming-tools.md) — Offers a drag-and-drop interface for organizing data into logical networks and structured trees.

### Data & Databases

- [Graph Data Models](https://awesome-repositories.com/f/data-databases/graph-data-models.md) — Stores information as a relational network of nodes and edges to represent complex, non-linear connections.
- [Automatic State Persistence](https://awesome-repositories.com/f/data-databases/in-memory-databases-with-persistence/automatic-state-persistence.md) — Automatically persists document changes in real time to ensure continuous progress preservation. ([source](https://github.com/graphif/project-graph#readme))
- [Real-Time Content Persistence](https://awesome-repositories.com/f/data-databases/tabular-data-frameworks/real-time-content-persistence.md) — Commits changes to storage in real time to ensure data integrity and prevent loss during editing.

### Development Tools & Productivity

- [Event-Logged Undo-Redo Histories](https://awesome-repositories.com/f/development-tools-productivity/change-tracking/state-tracking-utilities/action-based-state-tracking/undo-redo-state-history/event-logged-undo-redo-histories.md) — Records every modification as a discrete action in an event log to enable precise undo and redo capabilities.

### Education & Learning Resources

- [Information Mapping](https://awesome-repositories.com/f/education-learning-resources/information-mapping.md) — Provides a drag-and-drop interface for organizing data into logical trees or networks to build structured diagrams. ([source](https://github.com/graphif/project-graph#readme))

### Software Engineering & Architecture

- [Automatic Layout Engines](https://awesome-repositories.com/f/software-engineering-architecture/automatic-configuration/automatic-layout-engines.md) — Automatically calculates node spacing and connection paths to maintain visual clarity and prevent element overlap.

### User Interface & Experience

- [Drag and Drop Interactions](https://awesome-repositories.com/f/user-interface-experience/form-and-input-management/interaction-and-event-handling/drag-and-drop-interactions.md) — Provides a direct manipulation interface for repositioning nodes and establishing logical relationships via drag-and-drop.

### Web Development

- [Undo-Redo History](https://awesome-repositories.com/f/web-development/history-management/undo-redo-history.md) — Tracks workspace modifications to allow users to revert to previous states and recover lost work. ([source](https://github.com/graphif/project-graph#readme))
- [Relationship Mapping](https://awesome-repositories.com/f/web-development/relationship-mapping.md) — Supports nested graphs and bidirectional links to create flexible, interconnected thought maps. ([source](https://graphif.dev/))