This repository hosts a growing collection of React applications built with Vite. The first app was a Project Management Simulation demonstrating Active Inference principles. A second app explores project dynamics. More apps may be added over time.
- Located in
apps/project-management-simulation/src/App.tsxand bootstrapped byapps/project-management-simulation/src/index.jsx. - Uses minimal UI components defined in
App.tsxalong with the Recharts library for visualisations. - Simulates project progress across several features (Data Ingestion, ML Model, UI, Integration, Security) while tracking free energy as a measure of uncertainty.
- The simulation progresses through predefined actions (steps). Each step updates feature progress, resource allocation, overall time estimates and free energy. Each action includes an accompanying explanation, recommended decision and an Active Inference insight.
- Charts display free energy over time, feature estimates with uncertainty, and feature progress versus allocated resources.
step: current step in the simulation.overallEstimate: object withmean(weeks) anduncertainty.features: array of feature objects (name,mean,uncertainty,progress,resourceAllocation).freeEnergy: current free energy value; also logged tofreeEnergyHistoryfor charting.freeEnergyExplanation: text describing how free energy changed.
- Next Step: advance to the next action.
- Auto-Play: automatically iterate through actions at a selectable playback speed.
- Reset: return to initial state.
- Toggle display of Active Inference insights.
npm startlaunches a development server on port3000. SetAPP=<app-name>to work on a different app.npm testruns the Vitest test suite (seeapps/project-management-simulation/src/App.test.tsx).npm run buildexecutesscripts/build-all.jswhich builds every app underapps/and outputs them todocs/apps/<app-name>.
This second app explores reinforcing and balancing feedback loops in a project environment.
- Located in
apps/project-dynamics-simulator/src/App.tsxand bootstrapped byapps/project-dynamics-simulator/src/index.jsx. - Visualises progress, scope, quality, morale and other metrics with Recharts.
- Toggle effects like technical debt, team learning and user feedback to see non-linear project behaviour.
To work on this app locally run
APP=project-dynamics-simulator npm start.
This repository is intended to host multiple project-oriented apps. Each app should live in apps/<app-name> with its own src folder and index.html. Shared utilities such as index.css, reportWebVitals.js and test setup files belong in src/common so they can be imported across apps. Application-specific components and styles should remain under their respective app directory. The root index.html displays a card index of all available apps using app-index.csv and screenshots stored in pics/.
- Provide its own CSS file (e.g.,
src/App.css) for basic styling. - Include at least one test file under
src/sonpm testcovers it.
Each row of app-index.csv includes a # column. The number in this column corresponds to an image file named pics/<number>.png. Screenshots must use this lowercase .png extension so the index page can load them automatically. Missing images fall back to pics/blank.png. Update this document to describe each new application and how to run it.
Navigation: Every app should offer a link back to the card index so users can return easily. Add <a href="../../index.html">Back to app index</a> somewhere in each application's index.html.
- Located in
apps/IT-project-seq-decisions/src/App.jsxand bootstrapped byapps/IT-project-seq-decisions/src/index.jsx. - Demonstrates sequential decision making for IT projects, guiding the user through narrative, modelling and policy steps.
- Run locally with
APP=IT-project-seq-decisions npm start.
- Located in
apps/portfolio-state-machine/src/App.jsxand bootstrapped byapps/portfolio-state-machine/src/index.jsx. - Manages a portfolio of projects using a state machine and includes a simulation mode.
- Run locally with
APP=portfolio-state-machine npm start.
- Located in
apps/stakeholder-analysis-dashboard/src/App.jsxand bootstrapped byapps/stakeholder-analysis-dashboard/src/index.jsx. - Visualises stakeholder relationships, alignment and sentiment for different project roles.
- Run locally with
APP=stakeholder-analysis-dashboard npm start.
- Located in
apps/stakeholder-network-graph/src/App.jsxand bootstrapped byapps/stakeholder-network-graph/src/index.jsx. - Uses
react-force-graph-2dto display interactive stakeholder networks. - This dependency is installed at the repository root. Future apps that also need network-graph functionality should import from
'react-force-graph-2d'and avoid creating per-apppackage.jsonfiles. - Add any additional graph libraries only once in the root
package.jsonand runnpm installso all apps share them. - Run locally with
APP=stakeholder-network-graph npm start.
- Located in
apps/pareto_projects/src/App.jsxand bootstrapped byapps/pareto_projects/src/index.jsx. - Encourages teams to push project value beyond the usual Pareto frontier.
- Run locally with
APP=pareto_projects npm start.
- Located in
apps/market_timeline_explorer/src/app.jsxand bootstrapped byapps/market_timeline_explorer/src/index.jsx. - Charts potential market shifts for project-management services through AGI and ASI milestones.
- Run locally with
APP=market_timeline_explorer npm start.
- Located in
apps/building-site-occupancy-simulation/src/App.jsxand bootstrapped byapps/building-site-occupancy-simulation/src/index.jsx. - Provides a NetLogo model simulating construction site occupancy over a 24‑hour period.
- Run locally with
APP=building-site-occupancy-simulation npm start.