Module 6: Convert starter to theme package (#6)

globomantics-blog-theme/.gitignore

@@ -1,3 +1,4 @@
 .cache
 public
 node_modules
+.env*

globomantics-blog-theme/blog-theme/.babelrc

@@ -0,0 +1,12 @@
+{
+  "presets": [
+    [
+      "babel-preset-gatsby",
+    {
+      "targets": {
+        "browsers": [">0.25%", "not dead"]
+      }
+    }
+    ]
+  ]
+}

globomantics-blog-theme/blog-theme/.gitignore

@@ -0,0 +1,70 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# 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 (http://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
+.env*
+
+# build folder
+public
+
+# gatsby cache folder
+.cache
+
+# contentful config file
+.contentful.json
+# Local Netlify folder
+.netlify

globomantics-blog-theme/blog-theme/.npmrc

@@ -0,0 +1,2 @@
+@kamranayub:registry=https://npm.pkg.github.com
+engine-strict=true

globomantics-blog-theme/blog-theme/.nvmrc

@@ -0,0 +1 @@
+14

globomantics-blog-theme/blog-theme/.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "editor.tabSize": 2
+}

globomantics-blog-theme/blog-theme/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

globomantics-blog-theme/blog-theme/README.md

@@ -0,0 +1,64 @@
+# Contentful Gatsby Starter Blog
+
+Create a [Gatsby](http://gatsbyjs.com/) blog powered by [Contentful](https://www.contentful.com). This is a simplified version of the [Gatsby Contentful Starter](https://github.com/contentful-userland/gatsby-contentful-starter) which is maintained by our Community.
+
+![The index page of the starter blog](https://rawgit.com/contentful-userland/gatsby-contentful-starter/master/screenshot.jpg "The index page of the starter blog")
+
+Static sites are scalable, secure and have very little required maintenance. They come with a drawback though. Not everybody feels good editing files, building a project and uploading it somewhere. This is where Contentful comes into play.
+
+With Contentful and Gatsby you can connect your favorite static site generator with an API that provides an easy to use interface for people writing content and automate the publishing using services like [Travis CI](https://travis-ci.org/) or [Netlify](https://www.netlify.com/).
+
+## Features
+
+- Simple content model and structure. Easy to adjust to your needs.
+- Use the [synchronization feature](https://www.contentful.com/developers/docs/references/content-delivery-api/#/reference/synchronization) of our [Delivery API](https://www.contentful.com/developers/docs/references/content-delivery-api/).
+- Responsive/adaptive images via [gatsby-image](https://www.gatsbyjs.org/packages/gatsby-image/) and our [Images API](https://www.contentful.com/developers/docs/references/content-delivery-api/#/reference/synchronization/initial-synchronization-of-entries-of-a-specific-content-type).
+
+## Getting started
+
+See our [official Contentful getting started guide](https://www.contentful.com/developers/docs/tutorials/general/get-started/).
+
+### Get the source code and install dependencies.
+
+```
+$ git clone https://github.com/contentful/starter-gatsby-blog.git
+$ npm install
+```
+
+Or use the [Gatsby CLI](https://www.npmjs.com/package/gatsby-cli).
+
+```
+$ gatsby new contentful-starter-blog https://github.com/contentful/starter-gatsby-blog/
+```
+
+### Set up of the needed content model and create a configuration file
+
+This project comes with a Contentful setup command `npm run setup`.
+
+This command will ask you for a space ID, and access tokens for the Contentful Management and Delivery API and then import the needed content model into the space you define and write a config file (`./.contentful.json`).
+
+`npm run setup` automates that for you but if you want to do it yourself rename `.contentful.json.sample` to `.contentful.json` and add your configuration in this file.
+
+## Crucial Commands
+
+### `npm run dev`
+
+Run the project locally with live reload in development mode.
+
+### `npm run build`
+
+Run a production build into `./public`. The result is ready to be put on any static hosting you prefer.
+
+### `npm run serve`
+
+Spin up a production-ready server with your blog. Don't forget to build your page beforehand.
+
+## Deployment
+
+See the [official Contentful getting started guide](https://www.contentful.com/developers/docs/tutorials/general/get-started/).
+
+## Contribution
+
+Feel free to open pull requests to fix bugs. If you want to add features, please have a look at the [original version](https://github.com/contentful-userland/gatsby-contentful-starter). It is always open to contributions and pull requests.
+
+You can learn more about how Contentful userland is organized by visiting [our about repository](https://github.com/contentful-userland/about).

globomantics-blog-theme/blog-theme/WHATS-NEXT.md

@@ -0,0 +1,8 @@
+## Deploy the blog
+A blog on your local machine is nice to have, but a blog on the internet is even better. Return to the [tutorial doc](https://www.contentful.com/developers/docs/tutorials/general/get-started/#deploy-the-starter-gatsby-blog), select a hosting service (Netlify or Heroku) and follow the instructions to deploy.
+
+## Explore the blog content structure
+Return to the [tutorial doc](https://www.contentful.com/developers/docs/tutorials/general/get-started/#explore-how-the-sample-website-is-built-with-contentful) to view the relationship between the blog content and the data model.
+
+## Modify content and redeploy
+Follow this [tutorial](https://www.contentful.com/developers/docs/tutorials/general/automate-site-builds-with-webhooks/) to learn how to use webhooks to automate the process of redeploying your site after publishing new content.

globomantics-blog-theme/blog-theme/_config.yml

@@ -0,0 +1 @@
+theme: jekyll-theme-cayman

globomantics-blog-theme/blog-theme/app.json

@@ -0,0 +1,20 @@
+{
+  "name": "Contentful Gatsby Starter",
+  "description": "Gatsby starter for a Contentful project.",
+  "keywords": [
+    "contentful",
+    "gatsby",
+    "static",
+    "ssg"
+  ],
+  "repository": "https://github.com/contentful-userland/gatsby-contentful-starter",
+  "success_url": "/",
+  "buildpacks": [
+    {
+      "url": "heroku/nodejs"
+    },
+    {
+      "url": "https://github.com/heroku/heroku-buildpack-static"
+    }
+  ]
+}

globomantics-blog-theme/blog-theme/bin/hello.js

@@ -0,0 +1,30 @@
+const chalk = require("chalk");
+const pkg = require("../package.json");
+
+console.log(`
+
+${chalk.green("Hey there! 👋")}
+
+Thanks for giving the ${pkg.name} a try. 🎉
+To get you going really quickly this project includes a setup step.
+
+${chalk.yellow.bold("npm run setup")} automates the following steps for you:
+  - creates a config file ${chalk.yellow("./.contentful.json")}
+  - imports ${chalk.green("a predefined content model")}
+
+When this is done run:
+
+${chalk.yellow(
+  "npm run dev"
+)} to start a development environment at ${chalk.green("localhost:8000")}
+
+or
+
+${chalk.yellow(
+  "npm run build"
+)} to create a production ready static site in ${chalk.green("./public")}
+
+For further information check the readme of the project
+(https://github.com/contentful-userland/gatsby-contentful-starter)
+
+`);

globomantics-blog-theme/blog-theme/bin/setup.js

@@ -0,0 +1,114 @@
+const spaceImport = require("contentful-import");
+const exportFile = require("../contentful/export.json");
+const inquirer = require("inquirer");
+const chalk = require("chalk");
+const path = require("path");
+const { writeFileSync } = require("fs");
+
+const argv = require("yargs-parser")(process.argv.slice(2));
+
+console.log(`
+  To set up this project you need to provide your Space ID
+  and the belonging API access tokens. Please use an empty space for this.
+
+  You can find all the needed information in your Contentful space under:
+
+  ${chalk.yellow(
+    `app.contentful.com ${chalk.red("->")} Space Settings ${chalk.red(
+      "->"
+    )} API keys`
+  )}
+
+  The ${chalk.green("Content Management API Token")}
+    will be used to import and write data to your space.
+
+  The ${chalk.green("Content Delivery API Token")}
+    will be used to ship published production-ready content in your Gatsby app.
+
+  The ${chalk.green("Content Preview API Token")}
+    will be used to show not published data in your development environment.
+
+  Ready? Let's do it! 🎉
+`);
+
+const questions = [
+  {
+    name: "spaceId",
+    message: "Your Space ID",
+    when: !argv.spaceId && !process.env.CONTENTFUL_SPACE_ID,
+    validate: (input) =>
+      /^[a-z0-9]{12}$/.test(input) ||
+      "Space ID must be 12 lowercase characters",
+  },
+  {
+    name: "managementToken",
+    when: !argv.managementToken,
+    message: "Your Content Management API access token",
+  },
+  {
+    name: "accessToken",
+    when:
+      !argv.accessToken &&
+      !process.env.CONTENTFUL_ACCESS_TOKEN &&
+      !argv.deliveryToken &&
+      !process.env.CONTENTFUL_DELIVERY_TOKEN,
+    message: "Your Content Delivery API access token",
+  },
+];
+
+inquirer
+  .prompt(questions)
+  .then(({ spaceId, managementToken, accessToken }) => {
+    const {
+      CONTENTFUL_SPACE_ID,
+      CONTENTFUL_ACCESS_TOKEN,
+      CONTENTFUL_DELIVERY_TOKEN,
+    } = process.env;
+
+    // env vars are given precedence followed by args provided to the setup
+    // followed by input given to prompts displayed by the setup script
+    spaceId = CONTENTFUL_SPACE_ID || argv.spaceId || spaceId;
+    managementToken = argv.managementToken || managementToken;
+    // Some scripts that set up this repo use `deliveryToken` and
+    // `CONTENTFUL_DELIVERY_TOKEN`, instead of `accessToken` and
+    // `CONTENTFUL_ACCESS_TOKEN`. Until all scripts are updated to
+    // use `accessToken` and `CONTENTFUL_ACCESS_TOKEN` both variations
+    // will work.
+    accessToken =
+      CONTENTFUL_ACCESS_TOKEN ||
+      CONTENTFUL_DELIVERY_TOKEN ||
+      argv.accessToken ||
+      argv.deliveryToken ||
+      accessToken;
+
+    console.log("Writing config file...");
+    const configFiles = [`.env.development`, `.env.production`].map((file) =>
+      path.join(__dirname, "..", file)
+    );
+
+    const fileContents =
+      [
+        `# All environment variables will be sourced`,
+        `# and made available to gatsby-config.js, gatsby-node.js, etc.`,
+        `# Do NOT commit this file to source control`,
+        `CONTENTFUL_SPACE_ID='${spaceId}'`,
+        `CONTENTFUL_ACCESS_TOKEN='${accessToken}'`,
+      ].join("\n") + "\n";
+
+    configFiles.forEach((file) => {
+      writeFileSync(file, fileContents, "utf8");
+      console.log(`Config file ${chalk.yellow(file)} written`);
+    });
+    return { spaceId, managementToken };
+  })
+  .then(({ spaceId, managementToken }) =>
+    spaceImport({ spaceId, managementToken, content: exportFile })
+  )
+  .then((_, error) => {
+    console.log(
+      `All set! You can now run ${chalk.yellow(
+        "npm run dev"
+      )} to see it in action.`
+    );
+  })
+  .catch((error) => console.error(error));