Learn to build a custom web interface for real-time control and display of Grasshopper definitions. In this workshop, you will learn how to prepare your Grasshopper scripts to run on the web with Rhino.Compute. You will also explore the basics of Vue.js, a user-friendly web framework, enabling you to create a beautiful and reusable web interfaces that can control your Grasshopper definition inputs. Additionally, you will gain experience with Three.js web geometry library to develop dynamic and custom 3D scenes in your website.

https://docs.google.com/presentation/d/1kQS1eDlVabVp1Tn3BGf5KWl472_4omvTNg4js6gBjek/edit#slide=id.g2cb5cba85cb_0_515

Installation Instructions

• Rhino 7
• Hops
• Visual Studio Code
• Node
• Git
• Github

VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).

See Vite Configuration Reference.

npm install

npm run dev

npm run build