中文版

A comprehensive WebGPU graphics programming learning platform featuring interactive examples, tutorials, and API documentation.

• 📚 Comprehensive Tutorials - Complete learning path from basic concepts to advanced topics
• 🎮 Interactive Examples - Real-time WebGPU demos with live code editing
• 📖 API Reference - Complete WebGPU API documentation
• 🎨 Modern Interface - Responsive design built with Astro and Starlight
• 🚀 High Performance - Static generation for fast loading

.
├── public/                    # Static assets
├── src/
│   ├── assets/               # Images and static resources
│   ├── components/           # Reusable Astro components
│   │   └── WebGPUCanvas.astro # Interactive WebGPU canvas component
│   ├── content/
│   │   └── docs/             # Documentation content (Markdown/MDX)
│   │       ├── guides/       # Learning guides
│   │       ├── reference/    # API reference
│   │       └── examples/     # Interactive examples
│   └── content.config.ts     # Content collections configuration
├── astro.config.mjs          # Astro and Starlight configuration
├── package.json
└── tsconfig.json

• Learning Guides (guides/) - Hand-written tutorials and learning materials
• API Reference (reference/) - WebGPU API documentation
• Examples (examples/) - Interactive WebGPU demonstrations with live code execution

The project includes a custom WebGPUCanvas component that supports:

• Real-time WebGPU code execution
• WGSL shader code demonstrations
• Error handling and state management
• Multiple canvas instances support

All commands are run from the root of the project, from a terminal:

• Astro v5.6.1 - Modern static site generator
• Starlight v0.35.2 - Documentation theme framework
• TypeScript - Strict type configuration
• pnpm - Package manager (required, not npm/yarn)
• WebGPU API - Modern graphics API

1. Clone the repository and install dependencies:

git clone https://github.com/zhaozigu/webgpu-net-starlight.git
cd webgpu-net-starlight
pnpm install

2. Start the development server:

pnpm dev

3. Open http://localhost:4321 to start learning WebGPU!

• WebGPU Specification - Official WebGPU standard
• WGSL Specification - WebGPU Shading Language
• Starlight Docs - Learn more about the documentation framework
• Astro Docs - Learn more about Astro

Issues and Pull Requests are welcome to help improve this learning platform!

This project is licensed under the MIT License.