Bootstrap

.editorconfig

@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.gitignore

@@ -0,0 +1,91 @@
+# Created by .ignore support plugin (hsz.mobi)
+### Node template
+# Logs
+/logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.env
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# Nuxt generate
+dist
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless
+
+# IDE / Editor
+.idea
+
+# Service worker
+sw.*
+
+# macOS
+.DS_Store
+
+# Vim swap files
+*.swp

.prettierrc

@@ -0,0 +1,4 @@
+{
+  "semi": false,
+  "singleQuote": true
+}

README.md

@@ -0,0 +1,24 @@
+# Vue.js + DatoCMS + Bulma demo
+
+## Deploy on DatoCMS
+
+[![Deploy with DatoCMS](https://dashboard.datocms.com/deploy/button.svg)](https://dashboard.datocms.com/deploy?repo=datocms/nuxtjs-demo)
+
+## Build Setup
+
+```bash
+# install dependencies
+$ npm install
+
+# serve with hot reload at localhost:3000
+$ npm run dev
+
+# build for production and launch server
+$ npm run build
+$ npm run start
+
+# generate static project
+$ npm run generate
+```
+
+For detailed explanation on how things work, check out [Nuxt.js docs](https://nuxtjs.org).

assets/README.md

@@ -0,0 +1,7 @@
+# ASSETS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).

components/README.md

@@ -0,0 +1,7 @@
+# COMPONENTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+The components directory contains your Vue.js Components.
+
+_Nuxt.js doesn't supercharge these components._

datocms.json

@@ -0,0 +1,9 @@
+{
+  "name": "Nuxt.js blog",
+  "previewImage": "https://raw.githubusercontent.com/datocms/nuxtjs-demo/master/preview.png",
+  "templateId": "23796",
+  "deploymentType": "static",
+  "buildCommand": "npm run generate",
+  "buildDirectory": "dist",
+  "datocmsApiTokenEnvName": "NUXT_ENV_DATOCMS_API_TOKEN"
+}

layouts/README.md

@@ -0,0 +1,7 @@
+# LAYOUTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).

layouts/default.vue

@@ -0,0 +1,60 @@
+<template>
+  <div>
+    <nav class="navbar">
+      <div class="container">
+        <div class="navbar-brand">
+          <nuxt-link class="navbar-item" to="/">
+            <img src="/bulma.png" alt="Logo" />
+          </nuxt-link>
+          <span class="navbar-burger burger" v-on:click="toggleNavbar">
+            <span></span>
+            <span></span>
+            <span></span>
+          </span>
+        </div>
+        <div :class="['navbar-menu', navbarOpen && 'is-active']">
+          <div class="navbar-end">
+            <nuxt-link class="navbar-item is-active is-size-5 has-text-weight-semibold" to="/">
+              Home
+            </nuxt-link>
+          </div>
+        </div>
+      </div>
+    </nav>
+
+    <nuxt />
+
+    <footer class="footer">
+      <div class="content has-text-centered">
+        <p>
+          <strong>Bulma - Blog theme</strong> by
+          <a href="https://gonzalojs.com">Gonzalo Gutierrez</a>. Based on the
+          <a href="http://jigsaw-blog-staging.tighten.co/">jigsaw-blog</a>. The
+          source code is licensed
+          <a href="http://opensource.org/licenses/mit-license.php">MIT</a>
+        </p>
+      </div>
+    </footer>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      navbarOpen: false
+    }
+  },
+  methods: {
+    toggleNavbar() {
+      this.navbarOpen = !this.navbarOpen
+    }
+  }
+}
+</script>
+
+<style>
+nav.navbar {
+  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
+}
+</style>

lib/datocms.js

@@ -0,0 +1,53 @@
+import axios from 'axios'
+import gql from 'graphql-tag'
+
+export { default as gql } from 'graphql-tag'
+
+export async function request({ query, variables, preview }) {
+  const endpoint = preview
+    ? `https://graphql.datocms.com/preview`
+    : `https://graphql.datocms.com/`
+
+  const { data } = await axios.post(
+    endpoint,
+    {
+      query: query.loc && query.loc.source.body,
+      variables
+    },
+    {
+      headers: {
+        Authorization:
+          `Bearer ${process.env.NUXT_ENV_DATOCMS_API_TOKEN}`
+      }
+    }
+  )
+
+  if (data.errors) {
+    throw JSON.stringify(data.errors)
+  }
+
+  return data.data
+}
+
+export const imageFields = gql`
+  fragment imageFields on ResponsiveImage {
+    aspectRatio
+    base64
+    height
+    sizes
+    src
+    srcSet
+    webpSrcSet
+    width
+    alt
+    title
+  }
+`;
+
+export const seoMetaTagsFields = gql`
+  fragment seoMetaTagsFields on Tag {
+    attributes
+    content
+    tag
+  }
+`;

nuxt.config.js

@@ -0,0 +1,61 @@
+export default {
+  mode: 'spa',
+  /*
+   ** Headers of the page
+   */
+  head: {
+    title: process.env.npm_package_name || '',
+    meta: [
+      { charset: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+    ],
+  },
+  /*
+   ** Customize the progress-bar color
+   */
+  loading: { color: '#fff' },
+  /*
+   ** Global CSS
+   */
+  css: [],
+  /*
+   ** Plugins to load before mounting the App
+   */
+  plugins: ['~/plugins/datocms-image'],
+  /*
+   ** Nuxt.js dev-modules
+   */
+  buildModules: [],
+  /*
+   ** Nuxt.js modules
+   */
+  modules: [
+    // Doc: https://github.com/nuxt-community/modules/tree/master/packages/bulma
+    '@nuxtjs/bulma',
+    // Doc: https://axios.nuxtjs.org/usage
+    '@nuxtjs/axios',
+    // Doc: https://github.com/nuxt-community/dotenv-module
+    '@nuxtjs/dotenv'
+  ],
+  /*
+   ** Axios module configuration
+   ** See https://axios.nuxtjs.org/options
+   */
+  axios: {},
+  /*
+   ** Build configuration
+   */
+  build: {
+    postcss: {
+      preset: {
+        features: {
+          customProperties: false
+        }
+      }
+    },
+    /*
+     ** You can extend webpack config here
+     */
+    extend(config, ctx) {}
+  }
+}