{"id":21025949,"url":"https://github.com/nickforddev/vue-collections","last_synced_at":"2026-05-18T02:06:10.966Z","repository":{"id":57403594,"uuid":"105560084","full_name":"nickforddev/vue-collections","owner":"nickforddev","description":"A better collections plugin for Vue.js","archived":false,"fork":false,"pushed_at":"2018-02-27T17:24:18.000Z","size":4124,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-04-26T00:07:45.866Z","etag":null,"topics":["collection","collections","models","vue","vue-plugin","vue2","vuejs"],"latest_commit_sha":null,"homepage":null,"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/nickforddev.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}},"created_at":"2017-10-02T16:54:31.000Z","updated_at":"2017-10-16T16:16:50.000Z","dependencies_parsed_at":"2022-09-18T12:01:29.994Z","dependency_job_id":null,"html_url":"https://github.com/nickforddev/vue-collections","commit_stats":null,"previous_names":["nickforddesign/vue-collections"],"tags_count":14,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickforddev%2Fvue-collections","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickforddev%2Fvue-collections/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickforddev%2Fvue-collections/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickforddev%2Fvue-collections/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nickforddev","download_url":"https://codeload.github.com/nickforddev/vue-collections/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243462249,"owners_count":20294894,"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":["collection","collections","models","vue","vue-plugin","vue2","vuejs"],"created_at":"2024-11-19T11:40:43.171Z","updated_at":"2025-10-07T13:03:25.280Z","avatar_url":"https://github.com/nickforddev.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-collections\n\n[![Version](https://img.shields.io/npm/v/vue-collections.svg)](#)\n[![Build](https://travis-ci.org/nickforddesign/vue-collections.svg?branch=master)](#)\n[![Coverage Status](https://coveralls.io/repos/github/nickforddesign/vue-collections/badge.svg?branch=master)](https://coveralls.io/github/nickforddesign/vue-collections?branch=master)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)\n\n\u003e A better collections plugin for Vue.js\n\n## Installation\n\n``` bash\nnpm install vue-collections\n```\n\n## Setup\n\n```js\nimport Vue from 'vue'\nimport VueCollections from 'vue-collections'\n\nVue.use(VueColections)\n```\n\n## Demo\n\nClone the repository and run `npm start` or view a live demo [here](https://cdn.rawgit.com/nickforddesign/vue-collections/3f51d06f/dist/index.html).\n\n## Collections\n\nA light implementation of collections in Vue.js that binds a collection of models to a Vue instance, and transforms collection data based on schemas. More information about transforming model data with schemas in [vue-models](https://github.com/nickforddesign/vue-models).\n\n```js\nimport { Collection } from 'vue-collections'\n\nexport default {\n  collection() {\n    return new Collection({\n      basePath: 'tenants'\n    })\n  },\n  created() {\n    this.fetch()\n  },\n  methods: {\n    fetch() {\n      return this.$collection.fetch()\n    }\n  }\n}\n```\n\nThe `basePath` option will determine the path of the URL following the base path of the API, which is set in ./configs\nThe `createPath` option is optional and will be appened to the API path following `basePath`, if included.\nThese options allow you to fetch your collection at `localhost:3456/tenants` and to create new users at `localhost:3456/tenants/invite`.\n\nThe main reason why this simple wrapper is useful is that the options you pass to it will maintain the location of the endpoints you need when you want to dispatch CRUD events via `dispatch('fetch')`, `dispatch('create', model)`, `dispatch('update', model)`, or `dispatch('delete', model)`.\n\nThe Collection wrapper will also server as a control layer between the websocket server and the Vuex data store, when using websockets to subcribe to a collection of models.\n\n## Models\n\nOptionally, you may pass in a `vue-models` model class, which will transform the data in each of the models per the model's schema. \n\n\n## Build Setup\n\n``` bash\n# install dependencies\nnpm install\n\n# serve demo at localhost:8080\nnpm start\n\n# run tests with jest\nnpm test\n```\n\nFor detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnickforddev%2Fvue-collections","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnickforddev%2Fvue-collections","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnickforddev%2Fvue-collections/lists"}