╔══════════════════════════════════════════════════════════════════════╗
║ ║
║ "Truth through Data." ║
║ ║
║ The world's most detailed interactive encyclopedia for ║
║ computer hardware and software — designed for students, ║
║ engineers, and researchers. ║
║ ║
╚══════════════════════════════════════════════════════════════════════╝
CPMap is more than just a list of parts. It is a Research-Grade Educational Platform.
While Version 1.0 focused on basic hardware definitions, Version 2.0 Premium transforms the site into a high-density knowledge base with automated media ingestion, academic referencing, and advanced computing sections — bridging the gap between basic guides and academic papers.
| 🆕 Feature | 📖 Description |
|---|---|
| 📚 Academic Integration | Every page has a "Research Hub" with direct links to Google Scholar and IEEE Xplore |
| 🧠 Modern Paradigms | Deep-dives into NPU (AI), Quantum Computing, and SBC (Raspberry Pi) |
| 📦 Data Enrichment | Expanded to 70+ total pages including 30+ detailed technical sub-pages |
| 🔍 Full-Text Search | Migrated to full-text inverted index search powered by Lunr.js |
| 🤖 Automation Suite | Python tools to auto-fetch public-domain media from NASA and Wikimedia |
A Mega-Dropdown Navbar categorizes the entire computing landscape:
| 🖥️ Hardware | 💻 Software | 🔮 Computing |
|---|---|---|
| CPU / GPU / NPU | Windows | History Timeline |
| Input Devices | Linux | Server Infrastructure |
| Output & Storage | macOS / Android / iOS | Future Tech |
Every component page includes a high-resolution gallery of technical diagrams sourced automatically from Wikimedia Commons and NASA.
CPMap dynamically surfaces university-level CS lectures and engineering demonstrations — no broken links, always relevant.
- Glassmorphism Navbar — sticky, blurred glass effect
- Stats Counter — animated homepage counters showing library growth
- Pure Dark Mode — custom-engineered dark theme for long study sessions
| 🏷️ Category | 🔑 High-Level Topics | 🔬 Research Sub-pages |
|---|---|---|
| Core Hardware | CPU, GPU, NPU, RAM, Motherboard | Architecture, Benchmarks, Logic |
| Mobile & OS | Android, iOS, Windows, Linux, macOS | Kernels, NT Architecture, Distros |
| Networking | Router, NIC, WiFi-7, Server Infrastructure | Protocols, Signal Physics |
| Storage | SSD, HDD, NVMe, Optical/Laser | Flash Physics, Laser Tech |
| Future Tech | Quantum Computing, Neural Engines | Qubits, Tensor Math, SBCs |
| Layer | Technology | Purpose |
|---|---|---|
| Core | Semantic HTML5 + Modular CSS3 | Custom Design System |
| Logic | Vanilla JavaScript ES6+ | Interactivity & Search |
| Search | Lunr.js | Site-wide full-text indexing |
| Animations | Anime.js | High-end UI feedback |
Located in /tools and /scripts:
| 🐍 Script | ⚙️ Purpose |
|---|---|
cpmap_ingest.py |
Idempotent asset downloader — pulls from NASA & YouTube |
build_search_index.py |
Rebuilds the Lunr.js index across all 70+ pages |
generate_detail_pages.py |
Uses Jinja2 templates to create sub-pages from JSON datasets |
🔗 tcode-motion.github.io/computer-part-map/
If you see old content, do a Hard Refresh:
- Windows:
Ctrl + F5- Mac:
Cmd + Shift + R
# 1. Clone the repository
git clone https://github.com/Tcode-Motion/computer-part-map.git
# 2. Navigate into the project
cd computer-part-map
# 3. Install Python automation tools
pip install -r tools/requirements.txt
# 4. Run local server
python -m http.server 8000Open http://localhost:8000 in your browser 🎉
computer-part-map/
├── index.html # Homepage with animated stats
├── tools/
│ ├── cpmap_ingest.py # NASA/Wikimedia auto-downloader
│ ├── build_search_index.py
│ └── requirements.txt
├── scripts/
│ └── generate_detail_pages.py # Jinja2 page generator
├── assets/ # Auto-fetched media gallery
└── README.md
Contributions, issues, and feature requests are welcome!
- ⭐ Star the repo if you find it useful
- 🐛 Open an issue for bugs or missing topics
- 🔧 Submit a PR to add new hardware sections
Tanmoy — Tcode-Motion Building the future of open-source computer education.
"Truth through Data." — CPMap is Open Source. Always.