Statamic 3 is the very latest and greatest version of Statamic, a uniquely powerful CMS built on Laravel and designed to make building and managing bespoke websites radically efficient and remarkably enjoyable.
This Content API Demo uses the entries endpoint on a Movies collection to fetch and and filter data with the help of Vue Select.
The AJAX calls happen in the main Vue instance.
onSearch(search, loading) {
loading(true);
this.search(loading, search, this);
},
search: _.debounce((loading, search, vm) => {
fetch(
`/api/collections/movies/entries?filter[title:contains]=${escape(search)}`
).then(res => {
res.json().then(json => (vm.options = json.data));
loading(false);
});
}, 350)The returned data from the /api/collections/movies/entries call is rendered in the home.antlers.html template, inside a scoped slot for the Vue Select component.
1. Clone the project repo locally and install the dependencies.
git clone [email protected]:statamic/content-api-demo.git
cd content-api-demo
composer install
npm i && npm run dev
cp .env.example .env && php artisan key:generate
2. Visit content-api-demo.test (or whatever your dev URL pattern is) to see it in action
3. Make a new user – If you want to mess around and create/modify entries. You'll want it to be a super so you have access to everything.
php please make:user
You can log in at content-api.demo.test/cp.