{"id":20042211,"url":"https://github.com/creativecuriositystudio/cruddle","last_synced_at":"2026-04-09T07:02:55.168Z","repository":{"id":94964221,"uuid":"83475668","full_name":"creativecuriositystudio/cruddle","owner":"creativecuriositystudio","description":"(DEPRECATED) Simplifying CRUDL screen development using ModelSafe","archived":false,"fork":false,"pushed_at":"2017-05-03T06:46:14.000Z","size":1214,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-07-06T00:33:19.486Z","etag":null,"topics":["angular2","crud","data","html","model","typescript","ui","web"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/creativecuriositystudio.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.md","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}},"created_at":"2017-02-28T20:23:19.000Z","updated_at":"2017-05-29T02:30:08.000Z","dependencies_parsed_at":"2023-06-05T04:15:26.774Z","dependency_job_id":null,"html_url":"https://github.com/creativecuriositystudio/cruddle","commit_stats":{"total_commits":31,"total_committers":1,"mean_commits":31.0,"dds":0.0,"last_synced_commit":"4cef8700cbb82c35e7388651fe73559f45e14c25"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/creativecuriositystudio/cruddle","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creativecuriositystudio%2Fcruddle","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creativecuriositystudio%2Fcruddle/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creativecuriositystudio%2Fcruddle/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creativecuriositystudio%2Fcruddle/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/creativecuriositystudio","download_url":"https://codeload.github.com/creativecuriositystudio/cruddle/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creativecuriositystudio%2Fcruddle/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265577828,"owners_count":23791239,"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":["angular2","crud","data","html","model","typescript","ui","web"],"created_at":"2024-11-13T10:49:18.623Z","updated_at":"2025-12-30T22:07:10.588Z","avatar_url":"https://github.com/creativecuriositystudio.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Cruddle\n\n## Introduction\n\nCruddle is an Angular 2 library that provides functionality to generate\ngeneric CRUD(L) screens from [ModelSafe](https://github.com/creativecuriositystudio/modelsafe) data models. \nThe huge benefit of this is that screens in a CRUDL-based application can have their fields and validations\nautomatically provided by ModelSafe, so the actual work you need to do develop Angular components\nfor CRUDL screens is minimal. Cruddle provides all of the functionality to describe how a screen\nshould look and perform from a ModelSafe model, and you just need to turn that stateful information\ninto Angular templates.\n\nFor a general run down of how the library works, see the usage section below.\n\n## Installation\n\n```sh\nnpm install --save cruddle\n```\n\n## Usage\n\n### General Concepts\n\nCruddle separates the concept of a screen into three components:\n\n* The description of a screen, which might describe the columns to show in a list, what buttons\n  to show on the screen and so on. Basically a literal description of how the UI might function.\n* The user interface (UI) which takes the description of a screen and renders it using\n  HTML and then creates visual elements that can change the screen state.\n* The state of a screen, which the UI interacts with in order to keep track of certain\n  functionality related to the screen. For example, the state of a list might contain\n  pagination information\n\nIn a sense, the UI can be thought of as visual glue between a screen describer (produces\nscreen descriptions) and a screen state.\n\nEach different CRUDL action has its own respective describer and state types.\nThese can be used to write the base components/user interfaces for each CRUDL action.\n\n### Create \u0026 Update\n\nIn most applications, a create or update screen will generally\nact the same or extremely similar when it comes to UI. To encourage writing minimal code,\nCruddle's create and update functionality are described by the single `FormDescriber` class.\nIn order to generate a `FormState`, you should extend the `FormDescriber` with a model-specific\nversion.\n\nIf you have no custom functionality, you can use the `AutoFormDescriber` provider\nincluded in `CruddleModule` to generate default form describers for models. You will still\nneed to provide the `save` function to use for saving the form data.\n\n### Read\n\nIn order to generate a `ReadState`, you should extend the `ReadDescriber` with a model-specific\nversion.\n\nIf you have no custom functionality, you can use the `AutoReadDescriber` provider\nincluded in `CruddleModule` to generate default read describers for models.\n\n### Delete\n\nIn order to generate a `DeleteState`, you should extend the `DeleteDescriber` with a model-specific\nversion.\n\nIf you have no custom functionality, you can use the `AutoDeleteDescriber` provider\nincluded in `CruddleModule` to generate default delete describers for models. You will\nstill need to provide the `delete` function to use for deleting the model data.\n\nNote that some applications may have the delete screen as a popup\non the list screen rather than a separate screen. If that's the case,\nthen the delete component can just be ignored and a delete action can be\nadded to the list component.\n\n### List\n\nIn order to generate a `ListState`, you should extend the `ListDescriber` with a model-specific\nversion.\n\nIf you have no custom functionality, you can use the `AutoListDescriber` provider\nincluded in `CruddleModule` to generate default delete describers for models. You will\nstill need to provide the `refresh` function to use for refreshing the list screen.\n\n## Documentatation\n\nThe API documentation generated using [TypeDoc](https://github.com/TypeStrong/typedoc)\nis [available online](http://creativecuriositystudio.github.io/cruddle).\n\nTo generate API documentation from the code into the `docs` directory, run:\n\n```sh\nnpm run docs\n```\n\n## Testing\n\nTo execute the test suite run:\n\n```sh\nnpm run test\n```\n\n## License\n\nThis project is licensed under the MIT license. Please see `LICENSE.md` for more details.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcreativecuriositystudio%2Fcruddle","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcreativecuriositystudio%2Fcruddle","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcreativecuriositystudio%2Fcruddle/lists"}