Skip to content

Repository files navigation

Typing SVG

Live SiteVersionLicenseTechStar


╔══════════════════════════════════════════════════════════════════════╗
║ ║
║ "Truth through Data." ║
║ ║
║ The world's most detailed interactive encyclopedia for ║
║ computer hardware and software — designed for students, ║
║ engineers, and researchers. ║
║ ║
╚══════════════════════════════════════════════════════════════════════╝

📖 Project Vision

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.


🔬 What's New in Version 2.0?

🆕 Feature📖 Description
📚 Academic IntegrationEvery page has a "Research Hub" with direct links to Google Scholar and IEEE Xplore
🧠 Modern ParadigmsDeep-dives into NPU (AI), Quantum Computing, and SBC (Raspberry Pi)
📦 Data EnrichmentExpanded to 70+ total pages including 30+ detailed technical sub-pages
🔍 Full-Text SearchMigrated to full-text inverted index search powered by Lunr.js
🤖 Automation SuitePython tools to auto-fetch public-domain media from NASA and Wikimedia

✨ Premium Features

🧭 Advanced Navigation

A Mega-Dropdown Navbar categorizes the entire computing landscape:

🖥️ Hardware💻 Software🔮 Computing
CPU / GPU / NPUWindowsHistory Timeline
Input DevicesLinuxServer Infrastructure
Output & StoragemacOS / Android / iOSFuture Tech

🖼️ Automated Visual Galleries

Every component page includes a high-resolution gallery of technical diagrams sourced automatically from Wikimedia Commons and NASA.

🎥 Embedded University Lectures

CPMap dynamically surfaces university-level CS lectures and engineering demonstrations — no broken links, always relevant.

🌙 Premium UI/UX

  • 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

🗂️ Knowledge Architecture

🏷️ Category🔑 High-Level Topics🔬 Research Sub-pages
Core HardwareCPU, GPU, NPU, RAM, MotherboardArchitecture, Benchmarks, Logic
Mobile & OSAndroid, iOS, Windows, Linux, macOSKernels, NT Architecture, Distros
NetworkingRouter, NIC, WiFi-7, Server InfrastructureProtocols, Signal Physics
StorageSSD, HDD, NVMe, Optical/LaserFlash Physics, Laser Tech
Future TechQuantum Computing, Neural EnginesQubits, Tensor Math, SBCs

🛠️ Tech Stack & Automation

🌐 Frontend

HTML5CSS3JavaScriptLunr.jsAnime.js

LayerTechnologyPurpose
CoreSemantic HTML5 + Modular CSS3Custom Design System
LogicVanilla JavaScript ES6+Interactivity & Search
SearchLunr.jsSite-wide full-text indexing
AnimationsAnime.jsHigh-end UI feedback

🤖 Automation Suite (Python)

Located in /tools and /scripts:

🐍 Script⚙️ Purpose
cpmap_ingest.pyIdempotent asset downloader — pulls from NASA & YouTube
build_search_index.pyRebuilds the Lunr.js index across all 70+ pages
generate_detail_pages.pyUses Jinja2 templates to create sub-pages from JSON datasets

🚀 Deployment & Local Setup

🌐 Visit the Live Site

🔗 tcode-motion.github.io/computer-part-map/

If you see old content, do a Hard Refresh:

  • Windows:Ctrl + F5
  • Mac:Cmd + Shift + R

💻 Local Development

# 1. Clone the repository
git clone https://github.com/Tcode-Motion/computer-part-map.git
# 2. Navigate into the projectcd computer-part-map
# 3. Install Python automation tools
pip install -r tools/requirements.txt
# 4. Run local server
python -m http.server 8000

Open http://localhost:8000 in your browser 🎉


📁 Project Structure

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

🤝 Contributing

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

👨‍💻 Author

Tanmoy — Tcode-MotionBuilding the future of open-source computer education.

GitHubLive LibraryYouTube

"Truth through Data." — CPMap is Open Source. Always.