{"id":28726451,"url":"https://github.com/area73/particle-system-es6","last_synced_at":"2025-06-15T12:39:31.563Z","repository":{"id":40699413,"uuid":"165984707","full_name":"area73/particle-system-es6","owner":"area73","description":"Particle System ES6 OO \u0026 Functional","archived":false,"fork":false,"pushed_at":"2025-05-30T17:36:27.000Z","size":131879,"stargazers_count":7,"open_issues_count":15,"forks_count":4,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-05-31T01:47:06.862Z","etag":null,"topics":["functional-programming","javascript","object-oriented-programming","particle-system","particles"],"latest_commit_sha":null,"homepage":"https://particle-system.deelo.cloud/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/area73.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2019-01-16T06:12:09.000Z","updated_at":"2022-11-08T21:56:23.000Z","dependencies_parsed_at":"2023-02-05T01:45:52.978Z","dependency_job_id":"360b3525-f0b6-4ffb-bef7-902f7f428153","html_url":"https://github.com/area73/particle-system-es6","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/area73/particle-system-es6","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/area73%2Fparticle-system-es6","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/area73%2Fparticle-system-es6/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/area73%2Fparticle-system-es6/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/area73%2Fparticle-system-es6/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/area73","download_url":"https://codeload.github.com/area73/particle-system-es6/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/area73%2Fparticle-system-es6/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259977667,"owners_count":22941115,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["functional-programming","javascript","object-oriented-programming","particle-system","particles"],"created_at":"2025-06-15T12:39:30.634Z","updated_at":"2025-06-15T12:39:31.552Z","avatar_url":"https://github.com/area73.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n\n\u003e ## 🛠 Status: On active development\n\n# Particle System:  ES6 Object Oriented Vs Functional Paradigm\n\nThere are two sources, one for Object Oriented and the other one for functional programing both \nsources do the same.\n\nThis repo has been made to see the differences on mind change from adopting an object oriented \napproach and switching to functional programming\n\n\n## Index\n* [Features](#features)\n  * [Design Patterns](#patterns)\n* [Screenshots](#Screenshots)\n* [Getting Started](#Getting-Started)\n  * [Code scaffolding](#code-scaffolding)\n  * [Prerequisites](#Prerequisites)\n  * [Installation](#installation)\n  * [Start the development server](#start-server)\n* [Running tests](#Running-the-tests)\n* [Built With](#Built-With)\n* [Authors](#Authors)\n* [License](#License)\n* [Wallaby.js](#wallaby)\n* [Bibliography / Acknowledgments](#Acknowledgments)\n\n\u003chr\u003e\n\n\n## \u003ca name=\"features\"\u003eFeatures\u003c/a\u003e\nThis is a very simple particle system with 3 actors.\n\n**Particle:** the _main object of this system that will be affected by forces.\n\n**Emitter:** Entity that will spell particles at different speed and angle\n\n**Field:** A gravity field. This gravity can be positive (it will attract particles), or negative\n (it will repel particles)\n \nThere are other peaces to consider like the particle system itself were we set our scenario and a \ndisplay system \n\n### \u003ca name=\"patterns\"\u003eDesign Patterns\u003c/a\u003e\nThis application contains a variety of design patterns to make the code readable and maintainable.\n\n## \u003ca name=\"Screenshots\"\u003eScreenshots\u003c/a\u003e\n![Alt text](/assets/screen01.png?raw=true \"Particle System\")\n\n## \u003ca name=\"Getting-Started\"\u003eGetting Started\u003c/a\u003e\nThere is no need for a build or any package installation :scream_cat:\n\nJust run the index.html on a modern browser and that's it.\n\nAll the imports has been made with ES6 modules\n\n\n### \u003ca name=\"code-scaffolding\"\u003eCode scaffolding\u003c/a\u003e\n\u003cpre\u003e\n/root --\u003e config files\n  /assets --\u003e images and static content\n  /src --\u003e this is were the code is located (fn -\u003e functional , OO -\u003e object orientes )\n  /test --\u003e testing files\n\u003c/pre\u003e\n\n### \u003ca name=\"Prerequisites\"\u003ePrerequisites\u003c/a\u003e\nAs I said before there is no need ot install any dependencies although this project has a package\n.json to manage dev dependencies. This dev dependencies are relate to eslint and prettier (tools\n for code linting and good practices)  \n\n### \u003ca name=\"installation\"\u003eInstallation\u003c/a\u003e\nNone , hurrah !! :metal: :metal:\n\n\n### \u003ca name=\"_start-server\"\u003eStart the development server\u003c/a\u003e\n\n... but (there is always a but), you will need to run the index.html in a server because trying \nto execute index.html from file directory won't work since ES6 modules are sandbox to be executed\n in a server and not from file system.\n \n If you don't have any server you can run from the root of the project the following command:\n \n `npx simple-server`\n \n Then you can visit:\n\n```\nindex-oo.html (Object Oriented)\n\nindex-fn.html (functional) \n```\n\n## \u003ca name=\"Running-the-tests\"\u003eRunning the tests\u003c/a\u003e\nI'm using Jest to do the testing. You can do:\n\n`npm run test`\n\n## \u003ca name=\"Built-With\"\u003eBuilt With\u003c/a\u003e\nGood old plain Javascript  \n\n## \u003ca name=\"Authors\"\u003eAuthor\u003c/a\u003e\nWork by:\n\u003ca href=\"mailto:rerades@siete3.com\"\u003eRodrigo Erades\u003c/a\u003e\n\n## \u003ca name=\"License\"\u003eLicense\u003c/a\u003e\nMIT Licence\n\n## \u003ca name=\"Acknowledgments\"\u003eBibliography / Acknowledgments\u003c/a\u003e\nThis Particle system is base on this article and repo:\n\nhttps://software.intel.com/en-us/html5/hub/blogs/build-a-javascript-particle-system-in-200-lines\n\nhttps://github.com/jsoverson/JavaScript-Particle-System\n\n[A functional canvas approach with redux](https://medium.com/@peterxjang/a-functional-canvas-approach-with-redux-ce59a369241b)\n\nhttps://www.oddlyfunctional.com/making-a-game-with-functional-programming-part-1\n\n\n## \u003ca name=\"wallaby\"\u003eWallaby.js\u003c/a\u003e\n\n[![Wallaby.js](https://img.shields.io/badge/wallaby.js-powered-blue.svg?style=for-the-badge\u0026logo=github)](https://wallabyjs.com/oss/)\n\nThis repository contributors are welcome to use\n[Wallaby.js OSS License](https://wallabyjs.com/oss/) to get\ntest results immediately as you type, and see the results in\nyour editor right next to your code.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farea73%2Fparticle-system-es6","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Farea73%2Fparticle-system-es6","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farea73%2Fparticle-system-es6/lists"}