https://github.com/morozgrafix/p5js_boilerplate
yet another version of p5.js boilerplate
https://github.com/morozgrafix/p5js_boilerplate
boilerplate hacktoberfest p5js template
Last synced: about 1 month ago
JSON representation
yet another version of p5.js boilerplate
- Host: GitHub
- URL: https://github.com/morozgrafix/p5js_boilerplate
- Owner: morozgrafix
- License: mit
- Created: 2018-10-31T03:19:41.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2025-03-25T01:57:38.000Z (about 2 months ago)
- Last Synced: 2025-04-04T03:44:54.754Z (about 2 months ago)
- Topics: boilerplate, hacktoberfest, p5js, template
- Language: HTML
- Homepage:
- Size: 1.03 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# P5JS Boilerplate 🍳
yet another version of p5.js boilerplate, partially based on https://github.com/JForsaken/p5js-boilerplate by [JForsaken](https://github.com/JForsaken)
## Getting Started
1. Install `node` and `npm` using [nvm](https://github.com/creationix/nvm) or [brew](https://brew.sh/).
2. Clone the project.
3. `cd` to your the cloned project's path.
4. Run `npm start`.
5. Your browser should open at [localhost:3000](http://localhost:3000).
Wait, *that's it* 🤔?
Yup 🍺😏.
## Additional Information
### files
This boilerplate runs through `sketch.js` as the starting point, which instantiates the canvas.
### lifecycle
The two main functions that you will need to remember are `setup()` and `draw()`, which are both in `sketch.js`.
The setup function runs only once, before the first frame is drawn.
The draw function is called on every frame.
You might need to read P5JS' [examples](https://p5js.org/examples/) and [doc](https://p5js.org/reference/) for help.
### linting
ESLint is included in the boilerplate to encourage good practices, which supports **ES6**.
It will lint prior to commits and will refuse them if errors are present, so code responsibly 😉.