{"id":13392857,"url":"https://github.com/bugthesystem/design-patterns-and-idioms-in-es6","last_synced_at":"2025-04-10T02:23:20.143Z","repository":{"id":26843097,"uuid":"30302636","full_name":"bugthesystem/design-patterns-and-idioms-in-es6","owner":"bugthesystem","description":"Design patterns and idioms in JS(ES6)  /w traceur","archived":false,"fork":false,"pushed_at":"2017-01-11T10:07:55.000Z","size":46,"stargazers_count":350,"open_issues_count":0,"forks_count":33,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-04-06T13:56:36.336Z","etag":null,"topics":["design-patterns","es6","idioms","javascript","traceur"],"latest_commit_sha":null,"homepage":"","language":"HTML","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/bugthesystem.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}},"created_at":"2015-02-04T14:28:58.000Z","updated_at":"2025-04-04T23:27:09.000Z","dependencies_parsed_at":"2022-08-30T23:01:17.196Z","dependency_job_id":null,"html_url":"https://github.com/bugthesystem/design-patterns-and-idioms-in-es6","commit_stats":null,"previous_names":["bugthesystem/design-patterns-and-idioms-in-es6","ziyasal/design-patterns-and-idioms-in-es6"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bugthesystem%2Fdesign-patterns-and-idioms-in-es6","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bugthesystem%2Fdesign-patterns-and-idioms-in-es6/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bugthesystem%2Fdesign-patterns-and-idioms-in-es6/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bugthesystem%2Fdesign-patterns-and-idioms-in-es6/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bugthesystem","download_url":"https://codeload.github.com/bugthesystem/design-patterns-and-idioms-in-es6/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248143333,"owners_count":21054760,"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":["design-patterns","es6","idioms","javascript","traceur"],"created_at":"2024-07-30T17:00:38.240Z","updated_at":"2025-04-10T02:23:20.123Z","avatar_url":"https://github.com/bugthesystem.png","language":"HTML","funding_links":[],"categories":["Programming Language Design Patterns","javascript","es6"],"sub_categories":[],"readme":"# Design Patterns and Idioms in ES6\nA collection of design patterns and idioms in ES6\n\n**Boilerplate forked from  [angular/atscript-playground](https://github.com/angular/atscript-playground)**\n\n### Initial setup\n\n```bash\n# Clone the repo...\ngit clone https://github.com/ziyasal/design-patterns-in-es6.git\ncd design-patterns-in-es6\n\n# Then, you need to install all the dependencies...\nnpm install\n\n# If you want to be able to use global commands `karma` and `gulp`...\nnpm install -g karma-cli gulp\n```\n\n```bash\n# Do initial build, start a webserver and re-build on every file change...\ngulp build serve watch\n```\nOpen a browser and see the result.\n\nCurrent Patterns\n======================\n\n| Pattern | Description |\n|:-------:| ----------- |\n| [abstract_factory](src/abstract_factory/abstractFactory.ats) | use a generic function with specific factories |\n| [adapter](src/adapter/adapter.ats) | adapt one interface to another using a whitelist |\n| 3-tier | data\u003c-\u003ebusiness logic\u003c-\u003epresentation separation (strict relationships) |\n| borg | a singleton with shared-state among instances |\n| [bridge](src/bridge/bridge.ats) | a client-provider middleman to soften interface changes |\n| [builder](src/builder/builder.ats) | call many little discrete methods rather than having a huge number of constructor parameters |\n| catalog | general methods will call different specialized methods based on construction parameter |\n| chain | apply a chain of successive handlers to try and process the data |\n| [command](src/command/command.ats) | bundle a command and arguments to call later |\n| [composite](src/composite/composite.ats) | encapsulate and provide access to a number of different objects |\n| [decorator](src/decorator/decorator.ats) | wrap functionality with other functionality in order to affect outputs |\n| [facade](src/facade/facade.ats) | use one class as an API to a number of others |\n| [factory_method](src/factory_method/factorymethod.ats) | delegate a specialized function/method to create instances |\n| flyweight | transparently reuse existing instances of objects with similar/identical state |\n| graph_search | (graphing algorithms, not design patterns) |\n| mediator | an object that knows how to connect other objects and act as a proxy |\n| [memento](src/memento/memento.ats) | generate an opaque token that can be used to go back to a previous state |\n| [mvc](src/mvc/mvc.ats) | model\u003c-\u003eview\u003c-\u003econtroller (non-strict relationships) |\n| [observer](src/observer/observer.ats) | provide a callback for notification of events/changes to data |\n| pool | preinstantiate and maintain a group of instances of the same type |\n| [prototype](src/prototype/prototype.ats) | use a factory and clones of a prototype for new instances (if instantiation is expensive) |\n| [proxy](src/proxy/proxy.ats) | an object funnels operations to something else |\n| [publish_subscribe](src/publish_subscribe/pubsub.ats) | a source syndicates events/data to 0+ registered listeners |\n| state | logic is org'd into a discrete number of potential states and the next state that can be transitioned to |\n| [strategy](src/strategy/strategy.ats) | selectable operations over the same data |\n| [template](src/template/template.ats) | an object imposes a structure but takes pluggable components |\n| [visitor](src/visitor/visitor.ats)| invoke a callback for all items of a collection |\n| chaining_method | continue callback next object method |\n| [iterator](src/iterator/iterator.ats) | Provide a way to access the elements of an aggregate object sequentially |\n\n\n### What are all the pieces involved?\n\n#### [Traceur]\nTranspiles AtScript code into regular ES5 (today's JavaScript) so that it can be run in a current browser.\n\n#### [RequireJS]\nTraceur is configured to transpile AtScript modules into AMD syntax and we use RequireJS to load the code in the browser.\n\n#### [Assert] library\nWhen `typeAssertions: true` option is used, Traceur generates run-time type assertions such as `assert.type(x, Object)`. The assert library does the actual run-time check. Of course, you can use your own assert library.\n\nThe idea with type assertions is that you only use them during the development/testing and when deploying, you use `typeAssertions: false`.\n\n#### [Karma]\nTest runner that runs the tests in specified browsers, every time that you change a file.\n\n#### [Gulp]\nTask runner to make defining and running the tasks simpler.\n\n\n[AtScript]: http://atscript.org\n[Traceur]: https://github.com/google/traceur-compiler\n[RequireJS]: http://requirejs.org\n[Assert]: https://github.com/angular/assert\n[Karma]: http://karma-runner.github.io/\n[Gulp]: http://gulpjs.com\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbugthesystem%2Fdesign-patterns-and-idioms-in-es6","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbugthesystem%2Fdesign-patterns-and-idioms-in-es6","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbugthesystem%2Fdesign-patterns-and-idioms-in-es6/lists"}