{"id":13802397,"url":"https://github.com/djyde/cans","last_synced_at":"2025-04-15T03:51:21.077Z","repository":{"id":147580433,"uuid":"86317915","full_name":"djyde/cans","owner":"djyde","description":"🍻 A framework for building React MobX application","archived":false,"fork":false,"pushed_at":"2017-06-29T13:06:27.000Z","size":170,"stargazers_count":83,"open_issues_count":1,"forks_count":5,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-04-14T14:16:46.400Z","etag":null,"topics":["cans","choo","mobx","react"],"latest_commit_sha":null,"homepage":"http://cans.js.org","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/djyde.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-03-27T09:40:19.000Z","updated_at":"2023-02-25T12:05:37.000Z","dependencies_parsed_at":"2023-05-31T16:31:08.489Z","dependency_job_id":null,"html_url":"https://github.com/djyde/cans","commit_stats":null,"previous_names":[],"tags_count":11,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/djyde%2Fcans","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/djyde%2Fcans/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/djyde%2Fcans/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/djyde%2Fcans/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/djyde","download_url":"https://codeload.github.com/djyde/cans/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249003944,"owners_count":21196794,"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":["cans","choo","mobx","react"],"created_at":"2024-08-04T00:01:43.512Z","updated_at":"2025-04-15T03:51:21.061Z","avatar_url":"https://github.com/djyde.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cimg width=\"256\" height=\"128\" alt=\"logo\" src=\"https://cloud.githubusercontent.com/assets/914329/24503261/e6868e0a-1583-11e7-8a98-7dd24c564b8b.png\" /\u003e\n\n[![npm](https://img.shields.io/npm/v/cans.svg)](https://www.npmjs.com/package/cans)\n[![npm](https://img.shields.io/npm/dm/cans.svg)](https://www.npmjs.com/package/cans)\n[![circle](https://circleci.com/gh/djyde/cans.svg?style=shield)](https://circleci.com/gh/djyde/cans)\n[![David](https://img.shields.io/david/djyde/cans.svg)]()\n\nA framework for building React MobX application.\n\n## quick start\n\n```js\nimport cans, { inject } from 'cans'\nimport { BrowserRouter, Route } from 'cans/router'\n\nconst app = cans()\n\n// model\napp.model({\n  namespace: 'counter',\n  state: {\n    count: 0\n  },\n  actions: {\n    incr() {\n      this.count += 1\n    },\n    decr() {\n      this.count -= 1\n    }\n  },\n  computed: {\n    content() {\n      return `Count: ${this.count}`\n    }\n  }\n})\n\n// view\nconst Counter = inject(({ models })) =\u003e {\n  return (\n    \u003cdiv\u003e\n      \u003cspan\u003e{models.counter.content}\u003c/span\u003e\n      \u003cbutton onClick={models.counter.incr}\u003e+\u003c/button\u003e\n      \u003cbutton onClick={models.counter.decr}\u003e-\u003c/button\u003e\n    \u003c/div\u003e\n  )\n}\n\n// router\nconst route = () =\u003e (\n  \u003cBrowserRouter\u003e\n    \u003cRoute path='/' component={Counter} /\u003e\n  \u003c/BrowserRouter\u003e\n)\napp.route(route)\n\n// mount the app\napp.start(document.querySelector('#root'))\n```\n\n## Documents\n\n- [Document](http://cans.js.org)\n\n### Posts\n\n- [cans: A framework for building React MobX application](https://medium.com/@djyde/cans-a-framework-for-building-react-mobx-application-78bff88c3b3f)\n\n- [Building CRUD in a few minutes with cans and antd](https://medium.com/@djyde/building-curd-in-a-few-minutes-with-cans-and-antd-ba2b08a3919f)\n\n## Plugins\n\n- [cans-plugin-http](https://github.com/djyde/cans-plugin-http) HTTP (axios) plugin for cans\n- [cans-plugin-modal-store](https://github.com/djyde/cans-plugin-modal-store) cans plugin for creating modal stores\n\n## Examples\n\n- [cans-example-dashboard](https://github.com/cansjs/cans-example-dashboard/)\n\n👀 See more examples in [cans-example](https://github.com/djyde/cans-example)\n\n## Build\n\n``` bash\n$ yarn\n\n$ yarn test # unit-test\n\n$ yarn run example # run example\n```\n\n## See Also\n\n- [React-Router](https://github.com/ReactTraining/react-router)\n- [MobX](https://mobxjs.github.io/mobx/)\n\n# License\n\nMIT License\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdjyde%2Fcans","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdjyde%2Fcans","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdjyde%2Fcans/lists"}