JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://localhost:8000/newton.js"></script>
<script src="http://hunterloftis.github.io/newton/current/newton.min.js"></script>
<canvas id="display" width="400" height="400"></canvas>

CSS

html {
    margin: 0;
    padding: 0;
}
body {
    text-align: left;
    font-size: 12px;
    padding: 0;
    margin: 0;
}
#display {
    display: block;
    border: solid 1px #ccc;
    margin: 0;
    background: #000;
}
a {
    text-decoration: none;
    color: #2badad;
}

JavaScript

var display = document.getElementById('display');
var renderer = Newton.GLRenderer(display);

var sim = Newton.Simulator({
    solve: [ Newton.PinConstraint, Newton.BoxConstraint, Newton.RopeConstraint ]
});
var gravity = Newton.LinearForce(7, Math.PI * 1.5);
var container = Newton.BoxConstraint(0, 0, 500, 400);

var prev, current;

// build a string to dangle
for (var i = 0; i < 250; i++) {

    // add a particle to the string
    current = sim.add(Newton.Particle(200 + i * 10, 100));

    // a PinConstraint pins the first Particle in place
    if (!prev) sim.add(Newton.PinConstraint(current));

    // a RopeConstraint attaches subsequent particles to the previous particle
    else sim.add(Newton.RopeConstraint(prev, current));

    prev = current;
}

renderer.render(sim);

sim.add(gravity);
sim.add(container);
sim.start();