An open API service indexing awesome lists of open source software.

https://github.com/scriptedbutton/diagramify

Diagramify is a modern web application for creating and visualizing project management diagrams, specifically Activity on Arrow (AOA) and Activity on Node (AON) diagrams. Built with Next.js and React, it provides an intuitive interface for diagram creation and manipulation.
https://github.com/scriptedbutton/diagramify

aoa arrow-on-arrow diagrams react typescript

Last synced: about 2 months ago
JSON representation

Diagramify is a modern web application for creating and visualizing project management diagrams, specifically Activity on Arrow (AOA) and Activity on Node (AON) diagrams. Built with Next.js and React, it provides an intuitive interface for diagram creation and manipulation.

Awesome Lists containing this project

README

          

# Diagramify

Diagramify is a modern web application for creating and visualizing project management diagrams, specifically Activity on Arrow (AOA) and Activity on Node (AON) diagrams. Built with Next.js and React, it provides an intuitive interface for diagram creation and manipulation.

## Features

- Create and edit Activity on Arrow (AOA) diagrams
- Create and edit Activity on Node (AON) diagrams
- Interactive diagram canvas with drag-and-drop functionality
- Modern, responsive UI built with Tailwind CSS
- Real-time diagram updates
- Export capabilities

## Tech Stack

- **Framework**: Next.js 15
- **UI Library**: React 19
- **Styling**: Tailwind CSS
- **Diagram Libraries**:
- ReactFlow
- Dagre
- ELKJS
- **UI Components**: Radix UI
- **Type Safety**: TypeScript

## Getting Started

1. Clone the repository:

```bash
git clone https://github.com/ScriptedButton/diagramify.git
cd diagramify
```

2. Install dependencies:

```bash
npm install
# or
yarn install
# or
pnpm install
```

3. Run the development server:

```bash
npm run dev
# or
yarn dev
# or
pnpm dev
```

4. Open [http://localhost:3000](http://localhost:3000) with your browser to see the application.

## Development

- `npm run dev` - Start the development server with Turbopack
- `npm run build` - Build the application for production
- `npm run start` - Start the production server
- `npm run lint` - Run ESLint for code linting

## Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

## License

This project is licensed under the MIT License - see the LICENSE file for details.