https://github.com/im-rises/nbody-simulator-react-p5-website
N-Body simulation package demo made in React (bruteforce)
https://github.com/im-rises/nbody-simulator-react-p5-website
gravity javascript n-body nbody nbody-simulation package react simulation typescript
Last synced: 2 months ago
JSON representation
N-Body simulation package demo made in React (bruteforce)
- Host: GitHub
- URL: https://github.com/im-rises/nbody-simulator-react-p5-website
- Owner: Im-Rises
- License: mit
- Created: 2023-05-17T06:21:04.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2023-09-28T02:35:36.000Z (over 2 years ago)
- Last Synced: 2025-05-14T14:48:37.553Z (about 1 year ago)
- Topics: gravity, javascript, n-body, nbody, nbody-simulation, package, react, simulation, typescript
- Language: JavaScript
- Homepage: https://im-rises.github.io/nbody-simulator-react-p5-website/
- Size: 1.79 MB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# nbody-simulator-react-p5
## Description
This is a simple demo of the `nbody-simulator-react-p5` package. It is a nbody simulator made with React and
p5.js.
The bodies are attracted to each other and by the mouse cursor on click.
## 🚀🚀[You can try it online from your browser](https://im-rises.github.io/nbody-simulator-react-p5-website/) 🚀🚀
## 🚀🚀 [The package is available on npm](https://www.npmjs.com/package/nbody-simulator-react-p5) 🚀🚀
> **Note**
> I also made a C++ version for WebGL2 using OpenGL ES 3.0. You can check it
> out [here](https://github.com/Im-Rises/nbody-simulator-webgl).
> **Note**
> I also made a version using Barnes-Hut algorithm. You can check it
> out [here](https://github.com/Im-Rises/nbody-simulator-barnes-hut-react-p5).
## Screenshots
| Screenshot 1 | Screenshot 2 |
|---------------------------------------------------------------------------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------|
|  |  |
## Demo video
https://github.com/Im-Rises/nbody-simulator-react-p5/assets/59691442/20bc593e-7bd0-4d60-9470-a8caed1a45bd
## GitHub Actions
[](https://github.com/Im-Rises/nbody-simulator-react-p5-website/actions/workflows/node.js.yml)
[](https://github.com/Im-Rises/nbody-simulator-react-p5-website/actions/workflows/eslint.yml)
[](https://github.com/Im-Rises/nbody-simulator-react-p5-website/actions/workflows/codeql.yml)
[](https://github.com/Im-Rises/nbody-simulator-react-p5-website/actions/workflows/pages/pages-build-deployment)
The project is set up to run the following actions:
[//]: # (- pages-build-deployment : Builds the website and deploys it to GitHub Pages.)
- node.js.yml : Runs the tests for the Node.js project.
- eslint.yml : Runs the ESLint linter on the project.
- codeql.yml : Runs the CodeQL linter on the project.
- pages-build-deployment : Publish the website
## Libraries
React:
Xo:
ESLint:
GitHub gh-pages:
P5.js:
react-device-detect:
## Documentation
The Coding Challenge (math and physics):
P5.js:
P5.js React:
## Links
Check the source code
on [](https://github.com/im-rises/nbody-simulator-react-p5)
Check the demo
on [](https://github.com/im-rises/nbody-simulator-react-p5-website)
Check the package
on [](https://www.npmjs.com/package/nbody-simulator-react-p5)
## Contributors
Quentin MOREL :
- @Im-Rises
-
[](https://github.com/Im-Rises/nbody-simulator-react-p5-website/graphs/contributors)