Min's Collective Org Chart

Static org chart frontend for Min's Collective, built with Vite, React, TypeScript, Tailwind CSS, and React Flow. The app renders a company structure from a local JSON file and is ready to deploy to GitHub Pages.

What it does

• Renders the org chart from public/data/org-chart.json
• Uses separate team nodes between managers and employees
• Opens employee cards on GitHub when a profile link is available
• Supports pan, zoom, fit-to-view, and subtree collapse
• Works as a fully static site with no backend, auth, SSR, or database

Stack

• Vite
• React
• TypeScript
• Tailwind CSS
• React Flow (@xyflow/react)
• Dagre for automatic top-down layout

Project structure

.
├── .github/workflows/deploy.yml
├── public/
│   ├── avatars/
│   └── data/org-chart.json
├── src/
│   ├── components/
│   ├── types/
│   ├── utils/
│   ├── App.tsx
│   ├── index.css
│   └── main.tsx
├── index.html
├── package.json
└── vite.config.ts

Local development

npm install
npm run dev

Production build

npm run build
npm run preview

Data format

The app reads a local JSON file at public/data/org-chart.json.

Minimal shape:

{
  "departmentTitle": "Min's Collective",
  "roots": [
    {
      "id": "aleksandr-minkin",
      "fullName": "Aleksandr Minkin",
      "title": "CEO",
      "department": "Leadership",
      "email": "Not provided",
      "phone": "Not provided",
      "location": "Remote",
      "bio": "CEO of the organization.",
      "avatar": "https://github.com/minkinad.png",
      "github": "https://github.com/minkinad",
      "reports": []
    }
  ]
}

Supported employee fields:

• id
• fullName
• title
• department
• email
• phone
• location
• bio
• avatar
• github
• reports

GitHub Pages

The repository already includes GitHub Pages support:

• vite.config.ts resolves the correct base path for GitHub Actions builds
• .github/workflows/deploy.yml builds and deploys dist/

Setup steps:

1. Push the repository to GitHub.
2. Open Settings -> Pages.
3. Set the source to GitHub Actions.
4. Push to main to trigger deployment.

Notes

• Static frontend only
• No backend
• No API routes
• No authentication
• No server-side rendering
• GitHub Pages compatible after build