🔺 WebGPU Seed
A WebGPU repo you can use to get started with your own renderer.
Visit the
typegenbranch for type generation, but otherwise you should use@types/webgpu.
Setup
First install:
-
A Text Editor such as Visual Studio Code.
Then type the following in any terminal your such as VS Code's Integrated Terminal.
# 🐑 Clone the repo
git clone https://github.com/alaingalvan/webgpu-seed
# 💿 go inside the folder
cd webgpu-seed
# 🔨 Start building the project
npm startRefer to this blog post on designing web libraries and apps for more details on Node.js, packages, etc.
Project Layout
As your project becomes more complex, you'll want to separate files and organize your application to something more akin to a game or renderer, check out this post on game engine architecture and this one on real time renderer architecture for more details.
├─ 📂 node_modules/ # 👶 Dependencies
│ ├─ 📁 gl-matrix # ➕ Linear Algebra
│ └─ 📁 ... # 🕚 Other Dependencies (TypeScript, Webpack, etc.)
├─ 📂 src/ # 🌟 Source Files
│ ├─ 📄 index.html # 📇 Main HTML file
│ └─ 📄 renderer.ts # 🔺 Triangle Renderer
├─ 📄 .gitignore # 👁️ Ignore certain files in git repo
├─ 📄 package.json # 📦 Node Package File
├─ 📄 license.md # ⚖️ Your License (Unlicense)
└─ 📃readme.md # 📖 Read Me!
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent