diff --git a/src/v2/cookbook/serverless-blog.md b/src/v2/cookbook/serverless-blog.md index ff5a767717..9b99d496d5 100644 --- a/src/v2/cookbook/serverless-blog.md +++ b/src/v2/cookbook/serverless-blog.md @@ -4,8 +4,6 @@ type: cookbook order: 5 --- -# Create a CMS-Powered Blog Using Vue.js - So you've just launched your Vue.js website, congrats! Now you want to add a blog that quickly plugs into your website and you don't want to have to spin up a whole server just to host a Wordpress instance (or any DB-powered CMS for that matter). You want to just be able to add a few Vue.js blog components and some routes and have it all just work, right? What you're looking for a blog that's powered entirely by API's you can consume directly from your Vue.js application. This tutorial will teach you how to do just that, let's dive in! We're going to quickly build a CMS-powered blog with Vue.js. It uses [ButterCMS](https://buttercms.com/), an API-first CMS that lets you manage content using the ButterCMS dashboard and integrate our content API into your Vue.js app. You can use ButterCMS for new or existing Vue.js projects. @@ -37,14 +35,14 @@ const butter = Butter('your_api_token'); Using CDN: -```javascript +```html ``` - Import this file into any component you want to use ButterCMS. Then from the console run: +Import this file into any component you want to use ButterCMS. Then from the console run: ```javascript butter.post.list({page: 1, page_size: 10}).then(function(response) { @@ -55,7 +53,8 @@ butter.post.list({page: 1, page_size: 10}).then(function(response) { This API request fetches your blog posts. Your account comes with one example post which you'll see in the response. ## Display posts -To display posts we create a `/blog` route (using vue-router) in our app and fetch blog posts from the Butter API, as well as a `/blog/:slug` route to handle individual posts. + +To display posts we create a `/blog` route (using Vue Router) in our app and fetch blog posts from the Butter API, as well as a `/blog/:slug` route to handle individual posts. See the ButterCMS [API reference](https://buttercms.com/docs/api/?javascript#blog-posts) for additional options such as filtering by category or author. The response also includes some metadata we'll use for pagination. @@ -88,7 +87,7 @@ export default new Router({ Then create `components/BlogHome.vue` which will be your blog homepage that lists your most recent posts. -```javascript +```html -Display the result