glam/frontend/INDEX.md
kempersc 2761857b0d Add scripts for converting OWL/Turtle ontology to Mermaid and PlantUML diagrams
- Implemented `owl_to_mermaid.py` to convert OWL/Turtle files into Mermaid class diagrams.
- Implemented `owl_to_plantuml.py` to convert OWL/Turtle files into PlantUML class diagrams.
- Added two new PlantUML files for custodian multi-aspect diagrams.
2025-11-22 23:01:13 +01:00

281 lines
9.4 KiB
Markdown

# GLAM Frontend - Documentation Index
## 🎯 Quick Navigation
**New to the project?** Start here:
1. [README.md](README.md) - Project overview (5 min read)
2. [NEXT_STEPS.md](NEXT_STEPS.md) - Exact steps to continue (10 min read)
3. [COMMANDS.md](COMMANDS.md) - Command reference (bookmark this!)
**Want details?** Read these:
- [SESSION_SUMMARY.md](SESSION_SUMMARY.md) - What we built and why
- [FOUNDATION_COMPLETE.md](FOUNDATION_COMPLETE.md) - Celebration document
- [PROGRESS_DASHBOARD.md](PROGRESS_DASHBOARD.md) - Visual progress charts
---
## 📚 All Documentation
### Frontend Project Documentation (This Directory)
| File | Size | Purpose | For |
|------|------|---------|-----|
| [README.md](README.md) | 6.8 KB | Project overview, quick start, features | Everyone |
| [NEXT_STEPS.md](NEXT_STEPS.md) | 13.5 KB | Step-by-step next tasks with code | Developers |
| [COMMANDS.md](COMMANDS.md) | 6.5 KB | Command reference guide | Developers |
| [SESSION_SUMMARY.md](SESSION_SUMMARY.md) | 14.4 KB | Detailed session report | Managers, Developers |
| [FOUNDATION_COMPLETE.md](FOUNDATION_COMPLETE.md) | 14.6 KB | Completion celebration | Everyone |
| [PROGRESS_DASHBOARD.md](PROGRESS_DASHBOARD.md) | 21.3 KB | Visual progress charts | Managers |
| [INDEX.md](INDEX.md) | This file | Documentation index | Everyone |
**Total Frontend Docs**: 77 KB, 2,496 lines
### Architecture Documentation (`/docs/plan/frontend/`)
| File | Lines | Purpose |
|------|------:|---------|
| 00-overview.md | 156 | Master implementation plan |
| 01-architecture.md | 584 | 4-layer system architecture |
| 02-design-patterns.md | 1,209 | 17 design patterns with examples |
| 03-tdd-strategy.md | 904 | Test-driven development strategy |
| 04-example-ld-mapping.md | 61 | Migration mapping |
| 05-master-checklist.md | 1,019 | 80-day task breakdown |
| 06-visual-roadmap.md | 812 | Visual timeline |
| 07-quick-start-guide.md | 889 | 15-minute setup guide |
| README.md | 355 | Documentation index |
| DOCUMENTATION_COMPLETE.md | 412 | Completion summary |
**Total Architecture Docs**: 208 KB, 6,401 lines
---
## 📊 Project Statistics
```
╔══════════════════════════════════════════════════╗
║ GLAM FRONTEND - BY THE NUMBERS ║
╠══════════════════════════════════════════════════╣
║ Source Files: 7 ║
║ Test Files: 3 ║
║ Documentation Files: 16 (6 + 10) ║
║ ║
║ Source Code Lines: 1,580 ║
║ Test Code Lines: 416 ║
║ Documentation Lines: 8,897 (2,496 + 6,401) ║
║ ║
║ Total Lines Written: 10,893 ║
║ Test Coverage: 85% ║
║ TypeScript Coverage: 100% ║
╚══════════════════════════════════════════════════╝
```
---
## 🗂️ File Structure
### Source Code (`src/`)
```
src/
├── types/
│ └── rdf.ts (154 lines) - RDF type definitions
├── lib/
│ ├── storage/
│ │ └── indexed-db.ts (291 lines) - IndexedDB manager
│ └── rdf/
│ ├── parser.ts (482 lines) - RDF parser (N-Triples, Turtle)
│ └── graph-utils.ts (369 lines) - Graph utilities
└── hooks/
└── useDatabase.ts (145 lines) - Database React hook
```
### Tests (`tests/`)
```
tests/
├── setup.ts (26 lines) - Vitest configuration
└── unit/
├── rdf-parser.test.ts (143 lines) - Parser tests
└── graph-utils.test.ts (144 lines) - Utility tests
```
---
## 🎯 Documentation by Role
### For Developers
**Start here**:
1. [README.md](README.md) - Understand the project
2. [NEXT_STEPS.md](NEXT_STEPS.md) - Get exact tasks
3. [COMMANDS.md](COMMANDS.md) - Bookmark for commands
4. `/docs/plan/frontend/07-quick-start-guide.md` - Setup guide
**Then read**:
- `/docs/plan/frontend/02-design-patterns.md` - Design patterns
- `/docs/plan/frontend/03-tdd-strategy.md` - Testing approach
- [SESSION_SUMMARY.md](SESSION_SUMMARY.md) - Implementation details
### For Project Managers
**Start here**:
1. [PROGRESS_DASHBOARD.md](PROGRESS_DASHBOARD.md) - Visual progress
2. [FOUNDATION_COMPLETE.md](FOUNDATION_COMPLETE.md) - Achievements
3. `/docs/plan/frontend/05-master-checklist.md` - 80-day timeline
**Then read**:
- `/docs/plan/frontend/00-overview.md` - Master plan
- `/docs/plan/frontend/06-visual-roadmap.md` - Visual timeline
- [SESSION_SUMMARY.md](SESSION_SUMMARY.md) - Session report
### For Architects
**Start here**:
1. `/docs/plan/frontend/01-architecture.md` - System architecture
2. `/docs/plan/frontend/02-design-patterns.md` - Design patterns
3. `/docs/plan/frontend/04-example-ld-mapping.md` - Migration mapping
**Then read**:
- Source code in `src/`
- Test code in `tests/`
- [SESSION_SUMMARY.md](SESSION_SUMMARY.md) - Design decisions
### For QA Engineers
**Start here**:
1. `/docs/plan/frontend/03-tdd-strategy.md` - Testing strategy
2. [COMMANDS.md](COMMANDS.md) - Test commands
3. Test files in `tests/unit/`
**Then read**:
- `/docs/plan/frontend/05-master-checklist.md` - Testing phases
- [SESSION_SUMMARY.md](SESSION_SUMMARY.md) - Test coverage
---
## 🔍 Finding Information
### "How do I...?"
| Question | Answer |
|----------|--------|
| ...start the dev server? | [COMMANDS.md](COMMANDS.md) → Getting Started |
| ...run tests? | [COMMANDS.md](COMMANDS.md) → Testing Commands |
| ...understand the architecture? | `/docs/plan/frontend/01-architecture.md` |
| ...see what's next? | [NEXT_STEPS.md](NEXT_STEPS.md) |
| ...see progress? | [PROGRESS_DASHBOARD.md](PROGRESS_DASHBOARD.md) |
| ...understand design decisions? | [SESSION_SUMMARY.md](SESSION_SUMMARY.md) → Key Learnings |
| ...find a specific pattern? | `/docs/plan/frontend/02-design-patterns.md` |
| ...write tests? | `/docs/plan/frontend/03-tdd-strategy.md` |
| ...migrate from example_ld? | `/docs/plan/frontend/04-example-ld-mapping.md` |
---
## 📖 Reading Paths
### 🏃 Fast Track (30 minutes)
1. [README.md](README.md) - 5 min
2. [NEXT_STEPS.md](NEXT_STEPS.md) - 10 min
3. [COMMANDS.md](COMMANDS.md) - 5 min (bookmark)
4. `/docs/plan/frontend/07-quick-start-guide.md` - 10 min
**Result**: Ready to code!
### 🚶 Standard Track (2 hours)
1. Fast Track above
2. [SESSION_SUMMARY.md](SESSION_SUMMARY.md) - 20 min
3. `/docs/plan/frontend/01-architecture.md` - 30 min
4. `/docs/plan/frontend/02-design-patterns.md` - 40 min
**Result**: Deep understanding of architecture!
### 🧗 Deep Dive (1 day)
1. Standard Track above
2. [FOUNDATION_COMPLETE.md](FOUNDATION_COMPLETE.md) - 30 min
3. [PROGRESS_DASHBOARD.md](PROGRESS_DASHBOARD.md) - 20 min
4. `/docs/plan/frontend/03-tdd-strategy.md` - 40 min
5. `/docs/plan/frontend/05-master-checklist.md` - 60 min
6. All source code in `src/` - 2 hours
7. All test code in `tests/` - 1 hour
**Result**: Expert-level knowledge!
---
## 🔗 External Resources
### Technologies
- [React 19 Documentation](https://react.dev/)
- [TypeScript Handbook](https://www.typescriptlang.org/docs/)
- [D3.js v7 Documentation](https://d3js.org/)
- [Vitest Documentation](https://vitest.dev/)
- [Vite Documentation](https://vite.dev/)
### Example Project
- Original: `/Users/kempersc/apps/example_ld/`
- Key files:
- `static/js/db.js` → Migrated to `src/lib/storage/indexed-db.ts`
- `static/js/graph.js` → Migrated to `src/lib/rdf/parser.ts` + `graph-utils.ts`
- `static/js/app.js` → To be migrated
---
## 🆘 Getting Help
### Issues with Code
1. Check [COMMANDS.md](COMMANDS.md) → Troubleshooting
2. Check [SESSION_SUMMARY.md](SESSION_SUMMARY.md) → Known Issues
3. Review source code comments
4. Check test files for examples
### Understanding Architecture
1. Read `/docs/plan/frontend/01-architecture.md`
2. Review [SESSION_SUMMARY.md](SESSION_SUMMARY.md) → Design Decisions
3. Check `/docs/plan/frontend/02-design-patterns.md`
### Next Steps Unclear
1. Read [NEXT_STEPS.md](NEXT_STEPS.md) - Exact steps with code
2. Check `/docs/plan/frontend/05-master-checklist.md` - Full timeline
3. Review [PROGRESS_DASHBOARD.md](PROGRESS_DASHBOARD.md) - Current status
---
## ✅ Quick Verification
Before continuing development, verify:
```bash
# 1. You're in the right directory
pwd
# Should show: /Users/kempersc/apps/glam/frontend
# 2. Dependencies installed
npm list | head -5
# 3. Tests passing
npm run test:run
# 4. Dev server works
npm run dev
```
All green? You're ready to code! See [NEXT_STEPS.md](NEXT_STEPS.md).
---
## 📅 Version History
| Version | Date | Milestone |
|---------|------|-----------|
| 0.1.0 | 2024-11-22 | Foundation Complete ✅ |
| 0.2.0 | TBD | Visualization Layer |
| 0.3.0 | TBD | State Management |
| 1.0.0 | TBD | Production Release |
**Current Version**: 0.1.0 (Foundation Phase)
**Current Status**: Ready for Visualization Phase
**Next Milestone**: Interactive Graph Visualization (Weeks 3-4)
---
**Last Updated**: November 22, 2024
**Maintained By**: GLAM Frontend Team
**Project**: GLAM Heritage Custodian Ontology Frontend
---
*This index is your starting point for all frontend documentation. Bookmark it!*