{"id":15295036,"url":"https://github.com/ludo237/vuejs-carousel","last_synced_at":"2025-10-07T06:31:26.890Z","repository":{"id":33476727,"uuid":"37122418","full_name":"ludo237/vuejs-carousel","owner":"ludo237","description":"Complete photo carousel build with VueJS and web standards in mind","archived":true,"fork":false,"pushed_at":"2017-02-18T08:05:07.000Z","size":1243,"stargazers_count":50,"open_issues_count":0,"forks_count":16,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-05-01T22:16:43.088Z","etag":null,"topics":["carousel","javascript","photos","vue","vuejs","vuejs-carousel","vuejs2"],"latest_commit_sha":null,"homepage":"https://ludo237.github.io/vuejs-carousel/","language":"Vue","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/ludo237.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG","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-06-09T09:18:32.000Z","updated_at":"2024-02-24T07:49:45.000Z","dependencies_parsed_at":"2022-09-12T15:24:30.037Z","dependency_job_id":null,"html_url":"https://github.com/ludo237/vuejs-carousel","commit_stats":null,"previous_names":[],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ludo237%2Fvuejs-carousel","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ludo237%2Fvuejs-carousel/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ludo237%2Fvuejs-carousel/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ludo237%2Fvuejs-carousel/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ludo237","download_url":"https://codeload.github.com/ludo237/vuejs-carousel/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234093317,"owners_count":18778796,"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":["carousel","javascript","photos","vue","vuejs","vuejs-carousel","vuejs2"],"created_at":"2024-09-30T17:08:22.370Z","updated_at":"2025-10-07T06:31:26.508Z","avatar_url":"https://github.com/ludo237.png","language":"Vue","funding_links":[],"categories":["Awesome Vue.js [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)"],"sub_categories":["Libraries \u0026 Plugins"],"readme":"[![npm version](https://img.shields.io/npm/v/vuejs-carousel.svg)](https://www.npmjs.com/package/vuejs-carousel)\n[![Downloads](https://img.shields.io/npm/dt/vuejs-carousel.svg)](https://www.npmjs.com/package/vuejs-carousel)\n[![License](https://img.shields.io/npm/l/vuejs-carousel.svg)](https://www.npmjs.com/package/vuejs-carousel)\n\n[![Code Climate](https://codeclimate.com/github/ludo237/vuejs-carousel/badges/gpa.svg)](https://codeclimate.com/github/ludo237/vuejs-carousel)\n[![Test Coverage](https://codeclimate.com/github/ludo237/vuejs-carousel/badges/coverage.svg)](https://codeclimate.com/github/ludo237/vuejs-carousel/coverage)\n[![Issue Count](https://codeclimate.com/github/ludo237/vuejs-carousel/badges/issue_count.svg)](https://codeclimate.com/github/ludo237/vuejs-carousel)\n\n[![bitHound Overall Score](https://www.bithound.io/github/ludo237/vuejs-carousel/badges/score.svg)](https://www.bithound.io/github/ludo237/vuejs-carousel)\n[![bitHound Dependencies](https://www.bithound.io/github/ludo237/vuejs-carousel/badges/dependencies.svg)](https://www.bithound.io/github/ludo237/vuejs-carousel/master/dependencies/npm)\n[![bitHound Dev Dependencies](https://www.bithound.io/github/ludo237/vuejs-carousel/badges/devDependencies.svg)](https://www.bithound.io/github/ludo237/vuejs-carousel/master/dependencies/npm)\n[![bitHound Code](https://www.bithound.io/github/ludo237/vuejs-carousel/badges/code.svg)](https://www.bithound.io/github/ludo237/vuejs-carousel)\n\n# VueJs Carousel [![Awesome Vue](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/vuejs/awesome-vue)\n\n    Easy to use VueJS component for Photo galleries, built with VueJS and web standards in mind\n\n## How to install\n\nIn order to use the carousel you have to follow 3 simple steps:\n\n- Install the package from npm `npm install vuejs-carousel --save`\n- Go into your Vue main file or main javascript file\n- Import the carousel `import {store, Photos, Theater} from \"vuejs-carousel\"`\n- Add the component inside your views\n\n\n## How to use\n\nThis carousel is pretty easy to use. Put the source code inside your page:\n\n     \u003cscript src=\"dist/example.js\"\u003e\u003c/script\u003e\n\nAdd the components to your page like the example:\n\n    \u003cdiv id=\"your-application-id\"\u003e\n        \u003cphotos source=\"https://www.mockaroo.com/8e9a75b0/download?count=10\u0026key=e2db8d80\"\u003e\u003c/photos\u003e\n        \u003ctheater\u003e\u003c/theater\u003e\n    \u003c/div\u003e\n\nTry it with a source, for example you can use [Mockaroo](https://www.mockaroo.com/8e9a75b0)\n\n\n## Configuration\n\nThe current state of the component uses an array of `photos` objects and it expects this attributes:\n\n- id\n- thumbnail\n- photo\n- name\n- body\n- created_at\n- comments *array*\n    - id\n    - name\n    - body\n    - created_at\n\n**Be Aware**: If you have a different API structure you have to change the code a little bit in particular\nyou have to change the attributes of `selectedPhoto` and of `photos`. I will try to make this as dynamic as \npossible soon...\n\nThe source of the API is provided by [Mockaroo](https://www.mockaroo.com/8e9a75b0)\n\n## Contributing\n\nIf you want to contribute to this project issues and pull requests are welcome! In order to get started with the code you should:\n\n- Either download or clone this repository\n- Run `npm install` this will install all the necessary dependencies\n- Run `npm run dev`\n- Start coding :smile:\n\n## License\n\nSee [License file](LICENSE) for further details.\n\n## Changelog\n\nSee [Changelog File](CHANGELOG) for further details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fludo237%2Fvuejs-carousel","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fludo237%2Fvuejs-carousel","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fludo237%2Fvuejs-carousel/lists"}