Initial Commit

.gitignore

@@ -0,0 +1,8 @@
+# Project dependencies
+# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
+node_modules
+.cache/
+# Build directory
+public/
+.DS_Store
+.env

.nvmrc

@@ -0,0 +1 @@
+v12

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Dato SRL
+
+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.

README.md

@@ -0,0 +1,52 @@
+# Gatsby Portfolio Website
+
+This repo contains a static website written with [GatsbyJS](https://www.gatsbyjs.org/), integrated with content coming from [DatoCMS](https://www.datocms.com).
+
+![Preview](preview.png)
+
+[See the live demo](https://demo-datocms-gatsby.netlify.com/)
+
+If you want to use try this out yourself, you first need to set up a project on DatoCMS which will host your data.
+
+You can [sign up for a free account](https://dashboard.datocms.com/signup) and then you can simply click this button:
+
+[![Deploy with DatoCMS](https://dashboard.datocms.com/deploy/button.svg)](https://dashboard.datocms.com/projects/new-from-template/static-website/gatsby-portfolio)
+
+## Repo usage
+
+First, install the dependencies of this project:
+
+```
+npm install
+```
+
+Add an `.env` file containing the read-only API token of your DatoCMS site:
+
+```
+echo 'DATO_API_TOKEN=abc123' >> .env
+```
+
+Then, to run this website in development mode (with live-reload):
+
+```
+npm run develop
+```
+
+To build the final, production ready static website:
+
+```
+npm run build
+```
+
+The final result will be saved in the `public` directory.
+
+## About
+
+The goal of this project is to show how easily you can create static sites using the content (text, images, links, etc.) stored on [DatoCMS](https://www.datocms.com). This project is configured to fetch data from a specific administrative area using [the API DatoCMS provides](https://www.datocms.com/docs/content-management-api).
+
+You can find further information about how to integrate DatoCMS with Gatsby in [our documentation](https://www.datocms.com/docs/static-generators/gatsbyjs).
+
+This websites uses:
+
+- [GatsbyJS](https://github.com/gatsbyjs/gatsby) as website generator;
+- [gatsby-source-datocms](https://github.com/datocms/gatsby-source-datocms) to integrate the website with DatoCMS.

datocms.json

@@ -0,0 +1,11 @@
+{
+  "name": "Gatsby Portfolio Website",
+  "description": "Simple portfolio website built with Gatsby.js and DatoCMS source plugin",
+  "previewImage": "https://www.datocms-assets.com/205/1584546486-screen-shot-2020-03-18-at-16-47-38-fullpage.png?crop=top&fit=crop&h=500&w=600&auto=format",
+  "datocmsProjectId": "604",
+  "deploymentType": "static",
+  "buildCommand": "npm run build",
+  "datocmsApiTokenEnvName": "DATO_API_TOKEN",
+  "buildDirectory": "public",
+  "livePreviewUrl": "https://adoring-carson-24f43a.netlify.com/"
+}

gatsby-config.js

@@ -0,0 +1,18 @@
+require('dotenv').config()
+
+module.exports = {
+  siteMetadata: {
+    title: `Creative Portfolio`,
+  },
+  plugins: [
+    `gatsby-plugin-react-helmet`,
+    `gatsby-plugin-sass`,
+    `gatsby-transformer-remark`,
+    {
+      resolve: `gatsby-source-datocms`,
+      options: {
+        apiToken: process.env.DATO_API_TOKEN,
+      },
+    },
+  ],
+}

gatsby-node.js

@@ -0,0 +1,31 @@
+const path = require(`path`)
+const { createFilePath } = require(`gatsby-source-filesystem`)
+
+exports.createPages = ({ graphql, actions }) => {
+  const { createPage } = actions
+
+  return new Promise((resolve, reject) => {
+    graphql(`
+      {
+        allDatoCmsWork {
+          edges {
+            node {
+              slug
+            }
+          }
+        }
+      }
+    `).then(result => {
+      result.data.allDatoCmsWork.edges.map(({ node: work }) => {
+        createPage({
+          path: `works/${work.slug}`,
+          component: path.resolve(`./src/templates/work.js`),
+          context: {
+            slug: work.slug,
+          },
+        })
+      })
+      resolve()
+    })
+  })
+}