JonasGruenwald/verlet-ts

Advice how to get started?

Closed this issue · 1 comments

Supposed I only know vanilla js and never used typescript, how do I start testing/playing around with this project? In particular I would like to test some things in basic.ts, create a new shape etc.
I read a little and installed tsc through npm, and I think I should start a build in vscode with Terminal->Run build task...but I am not sure what the intended way is and how I ultimately run my changes in the browser. Any advice?

Hi! Here are some pointers:

  • This is just a library, so unless you want to work on it / contribute, you don't need to use typescript at all, it's distributed as a js bundle that you can install with npm, how you set up your project is up to you, it doesn't need to include a build step if you don't want to have that
  • The functionality of this project is mainly just a port of this JavaScript library:
    https://github.com/subprotocol/verlet-js
    With my own architectural preference of completely decoupling the simulation from any drawing logic etc.
    So if you just want to play around I would maybe just look at verlet-js instead? So far, this project doesn't offer anything more. In fact it offers less because it doesn't include any drawing functionality, since I prefer to just implement that wherever the library is consumed
  • If you do want to build something with this library, take a look at the examples in /src

It's intended to work like this:

  • Create a Simulation instance
  • Create some Particle instances and add them to the simulation
  • Create some DistanceConstraint instances between particles and add them to the simulation
  • Call simulation.update to update the simulation for a number of steps

If you would like to visualize the simulation (draw something to the screen) that's up to you to implement, I have done that in the examples here:
https://github.com/JonasGruenwald/verlet-ts/blob/main/src/utils/drawing.ts
But it's explicitly not part of the library since I think it's always going to be opinionated, maybe you want to use p5.js, draw something directly on canvas, use SVGs, WebGL, whatever.

Hope that helps :)