Pull Request 1: ADD mdx blog posts

content/blog/anotherpost/index.md

@@ -0,0 +1,224 @@
+---
+path: "numtwo"
+title: "Another Post"
+date: "Tuesday"
+description: "Another Description"
+---
+
+I've stolen this blog from the repo. But I promise its just for a test ;)
+
+Oh, and here's a great quote from this Wikipedia on
+[salted duck eggs](https://en.wikipedia.org/wiki/Salted_duck_egg).
+
+> A salted duck egg is a Chinese preserved food product made by soaking duck
+> eggs in brine, or packing each egg in damp, salted charcoal. In Asian
+> supermarkets, these eggs are sometimes sold covered in a thick layer of salted
+> charcoal paste. The eggs may also be sold with the salted paste removed,
+> wrapped in plastic, and vacuum packed. From the salt curing process, the
+> salted duck eggs have a briny aroma, a gelatin-like egg white and a
+> firm-textured, round yolk that is bright orange-red in color.
+
+You can also write code blocks here!
+
+```js
+const saltyDuckEgg = "chinese preserved food product"
+```
+
+| Number | Title                                    | Year |
+| :----- | :--------------------------------------- | ---: |
+| 1      | Harry Potter and the Philosopher’s Stone | 2001 |
+| 2      | Harry Potter and the Chamber of Secrets  | 2002 |
+| 3      | Harry Potter and the Prisoner of Azkaban | 2004 |
+
+[View raw (TEST.md)](https://raw.github.com/adamschwartz/github-markdown-kitchen-sink/master/README.md)
+
+This is a paragraph.
+
+    This is a paragraph.
+
+# Header 1
+
+## Header 2
+
+    Header 1
+    ========
+
+    Header 2
+    --------
+
+# Header 1
+
+## Header 2
+
+### Header 3
+
+#### Header 4
+
+##### Header 5
+
+###### Header 6
+
+    # Header 1
+    ## Header 2
+    ### Header 3
+    #### Header 4
+    ##### Header 5
+    ###### Header 6
+
+# Header 1
+
+## Header 2
+
+### Header 3
+
+#### Header 4
+
+##### Header 5
+
+###### Header 6
+
+    # Header 1 #
+    ## Header 2 ##
+    ### Header 3 ###
+    #### Header 4 ####
+    ##### Header 5 #####
+    ###### Header 6 ######
+
+> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
+    > Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
+> ## This is a header.
+>
+> 1. This is the first list item.
+> 2. This is the second list item.
+>
+> Here's some example code:
+>
+>     Markdown.generate();
+    > ## This is a header.
+    > 1. This is the first list item.
+    > 2. This is the second list item.
+    >
+    > Here's some example code:
+    >
+    >     Markdown.generate();
+- Red
+- Green
+- Blue
+
+* Red
+* Green
+* Blue
+
+- Red
+- Green
+- Blue
+
+```markdown
+- Red
+- Green
+- Blue
+
+* Red
+* Green
+* Blue
+
+- Red
+- Green
+- Blue
+```
+
+- `code goes` here in this line
+- **bold** goes here
+
+```markdown
+- `code goes` here in this line
+- **bold** goes here
+```
+
+1. Buy flour and salt
+1. Mix together with water
+1. Bake
+
+```markdown
+1. Buy flour and salt
+1. Mix together with water
+1. Bake
+```
+
+1. `code goes` here in this line
+1. **bold** goes here
+
+```markdown
+1. `code goes` here in this line
+1. **bold** goes here
+```
+
+Paragraph:
+
+    Code
+
+<!-- -->
+
+    Paragraph:
+
+        Code
+
+---
+
+---
+
+---
+
+---
+
+---
+
+    * * *
+
+    ***
+
+    *****
+
+    - - -
+
+    ---------------------------------------
+
+This is [an example](http://example.com "Example") link.
+
+[This link](http://example.com) has no title attr.
+
+This is [an example][id] reference-style link.
+
+[id]: http://example.com "Optional Title"
+
+    This is [an example](http://example.com "Example") link.
+
+    [This link](http://example.com) has no title attr.
+
+    This is [an example] [id] reference-style link.
+
+    [id]: http://example.com "Optional Title"
+
+_single asterisks_
+
+_single underscores_
+
+**double asterisks**
+
+**double underscores**
+
+    *single asterisks*
+
+    _single underscores_
+
+    **double asterisks**
+
+    __double underscores__
+
+This paragraph has some `code` in it.
+
+    This paragraph has some `code` in it.
+
+![Alt Text](https://placehold.it/200x50 "Image Title")
+
+    ![Alt Text](https://placehold.it/200x50 "Image Title")

content/blog/helloworld/index.md

@@ -0,0 +1,8 @@
+---
+path: "helloworld"
+title: "Hello World"
+date: "Wednesday"
+description: "Hello Description"
+---
+
+Hello-World!

gatsby-config.js

@@ -25,5 +25,13 @@ module.exports = {
       },
       __key: "images",
     },
+    {
+      resolve: "gatsby-source-filesystem",
+      options: {
+        path: `./content/blog`,
+        name: `blog`,
+      }
+    },
+    "gatsby-transformer-remark"
   ],
-};
+};

gatsby-node.js

@@ -0,0 +1,45 @@
+const path = require("path")
+
+// Implement the Gatsby API “createPages”. This is called once the
+// data layer is bootstrapped to let plugins create pages from data.
+exports.createPages = async ({ graphql, actions, reporter }) => {
+  const { createPage } = actions
+  // Query for markdown nodes to use in creating pages.
+  const result = await graphql(
+    `
+      {
+        allMarkdownRemark(limit: 1000) {
+          edges {
+            node {
+              frontmatter {
+                path
+                title
+                date
+                description
+              }
+            }
+          }
+        }
+      }
+    `
+  )
+  // Handle errors
+  if (result.errors) {
+    reporter.panicOnBuild(`Error while running GraphQL query.`)
+    return
+  }
+  // Create pages for each markdown file.
+  const blogPostTemplate = path.resolve(`src/templates/blog-post.js`)
+  result.data.allMarkdownRemark.edges.forEach(({ node }) => {
+    const path = `/blog/${node.frontmatter.path}`
+    createPage({
+      path,
+      component: blogPostTemplate,
+      // In your blog post template's graphql query, you can use pagePath
+      // as a GraphQL variable to query for data from the markdown file.
+      context: {
+        pagePath: path,
+      },
+    })
+  })
+}

package.json

@@ -27,6 +27,7 @@
     "gatsby-plugin-sharp": "^3.14.1",
     "gatsby-source-filesystem": "^3.14.0",
     "gatsby-transformer-sharp": "^3.14.0",
+    "gatsby-transformer-remark": "^5.7.0",
     "react": "^17.0.1",
     "react-compare-slider": "^2.1.0",
     "react-dom": "^17.0.1",
@@ -38,4 +39,4 @@
     "postcss": "^8.3.9",
     "tailwindcss": "^2.2.16"
   }
-}
+}