There are two sources, one for Object Oriented and the other one for functional programing both sources do the same.
This repo has been made to see the differences on mind change from adopting an object oriented approach and switching to functional programming
- Features
- Screenshots
- Getting Started
- Running tests
- Built With
- Authors
- License
- Wallaby.js
- Bibliography / Acknowledgments
This is a very simple particle system with 3 actors.
Particle: the _main object of this system that will be affected by forces.
Emitter: Entity that will spell particles at different speed and angle
Field: A gravity field. This gravity can be positive (it will attract particles), or negative (it will repel particles)
There are other peaces to consider like the particle system itself were we set our scenario and a display system
This application contains a variety of design patterns to make the code readable and maintainable.
There is no need for a build or any package installation 🙀
Just run the index.html on a modern browser and that's it.
All the imports has been made with ES6 modules
/root --> config files /assets --> images and static content /src --> this is were the code is located (fn -> functional , OO -> object orientes ) /test --> testing files
As I said before there is no need ot install any dependencies although this project has a package .json to manage dev dependencies. This dev dependencies are relate to eslint and prettier (tools for code linting and good practices)
None , hurrah !! 🤘 🤘
... but (there is always a but), you will need to run the index.html in a server because trying to execute index.html from file directory won't work since ES6 modules are sandbox to be executed in a server and not from file system.
If you don't have any server you can run from the root of the project the following command:
npx simple-server
Then you can visit:
index-oo.html (Object Oriented)
index-fn.html (functional)
I'm using Jest to do the testing. You can do:
npm run test
Good old plain Javascript
Work by: Rodrigo Erades
MIT Licence
This Particle system is base on this article and repo:
https://software.intel.com/en-us/html5/hub/blogs/build-a-javascript-particle-system-in-200-lines
https://github.com/jsoverson/JavaScript-Particle-System
A functional canvas approach with redux
https://www.oddlyfunctional.com/making-a-game-with-functional-programming-part-1
This repository contributors are welcome to use Wallaby.js OSS License to get test results immediately as you type, and see the results in your editor right next to your code.