feat: data fetching from src

gatsby-config.js

@@ -1,16 +1,15 @@
 module.exports = {
   plugins: [
     `gatsby-plugin-react-helmet`,
-    `gatsby-plugin-offline`,
-    `gatsby-transformer-sharp`,
-    `gatsby-plugin-sharp`,
     {
       resolve: `gatsby-plugin-emotion`,
     },
+    // create routes for client side routing
     {
       resolve: `gatsby-plugin-create-client-paths`,
       options: { prefixes: [`/app/*`] },
     },
+    // provide fonts from Google fonts
     {
       resolve: `gatsby-plugin-prefetch-google-fonts`,
       options: {
@@ -22,6 +21,8 @@ module.exports = {
         ],
       },
     },
+    // plugins for PWA support
+    `gatsby-plugin-offline`,
     {
       resolve: `gatsby-plugin-manifest`,
       options: {
@@ -34,6 +35,9 @@ module.exports = {
         icon: `src/img/splash.png`,
       },
     },
+    // plugins for optimized images
+    `gatsby-transformer-sharp`,
+    `gatsby-plugin-sharp`,
     {
       resolve: `gatsby-source-filesystem`,
       options: {
@@ -41,6 +45,15 @@ module.exports = {
         path: `${__dirname}/src/img`,
       },
     },
+    // parse data from /src/data as Javascrip objects
+    `gatsby-transformer-json`,
+    {
+      resolve: `gatsby-source-filesystem`,
+      options: {
+        path: `./src/data/`,
+      },
+    },
+    // easier imports and exports
     {
       resolve: "gatsby-plugin-module-resolver",
       options: {

package.json

@@ -20,6 +20,7 @@
     "gatsby-plugin-react-helmet": "^3.0.12",
     "gatsby-plugin-sharp": "^2.0.37",
     "gatsby-source-filesystem": "^2.0.36",
+    "gatsby-transformer-json": "^2.1.11",
     "gatsby-transformer-sharp": "^2.1.19",
     "react": "^16.8.4",
     "react-dom": "^16.8.4",

src/data/greetings.json

@@ -0,0 +1,12 @@
+[
+  "Hello",
+  "Hi there",
+  "Bonjour",
+  "Salut",
+  "Privet",
+  "Nǐ hǎo",
+  "Ciao",
+  "Konnichiwa",
+  "Guten Tag",
+  "Ahlan"
+]

src/data/quotes.json

@@ -0,0 +1,10 @@
+[
+  {
+    "quote": "Dude, sucking at something is the first step to being sorta good at something.",
+    "author": "Jake the Dog"
+  },
+  {
+    "quote": "Sucking at something is the first step to being sort of good at something.",
+    "author": "Jake the Dog"
+  }
+]

src/routes/Welcome.js

@@ -3,27 +3,45 @@ import { Link } from "gatsby"
 import styled from "@emotion/styled"
 import { withTheme } from "emotion-theming"
 
+import { SIZES } from "styles/constants"
 import { Button, P } from "components/elements"
-import Logo from "components/Logo"
 import Footer from "components/Footer"
 import { todayUrl } from "utils/date"
 
 const WelcomeGrid = styled.div`
-  margin-top: 30px;
+  text-align: center;
+  margin-top: 60px;
   line-height: 1.5;
   color: ${props => props.theme.colors.primary};
   height: 100%;
 `
 
+const Quote = styled.blockquote`
+  margin-top: 30px;
+  font-family: Montserrat;
+  font-size: ${SIZES.medium};
+  color: ${props => props.theme.colors.primary};
+`
+const QuoteAuthor = styled(P)`
+  font-style: italic;
+`
+
 class Welcome extends Component {
   render() {
     const { theme } = this.props
     return (
       <WelcomeGrid>
-        <h1>Your Space for Wandering Thoughts and Ideas</h1>
+        <h1>Hello</h1>
+        <Quote>
+          Sucking at something is the first step to being sort of good at
+          something
+        </Quote>
+        <QuoteAuthor style={{ letterSpacing: 1.1, marginBottom: 30 }}>
+          - Jake the Dog
+        </QuoteAuthor>
         <P style={{ letterSpacing: 1.1, marginBottom: 30 }}>
           This your space for wandering thoughts and ideas. Write about whatever
-          comes to mind.
+          is on your mind.
         </P>
         <Link to={`/app${todayUrl()}`} style={{ textDecoration: "none" }}>
           <Button colors={theme.colors}>Write about today</Button>

yarn.lock

@@ -6583,6 +6583,14 @@ gatsby-telemetry@^1.0.9:
     stack-utils "1.0.2"
     uuid "3.3.2"
 
+gatsby-transformer-json@^2.1.11:
+  version "2.1.11"
+  resolved "https://registry.yarnpkg.com/gatsby-transformer-json/-/gatsby-transformer-json-2.1.11.tgz#b1c9acbc0da6e7e11b7dd278e9543171a71ecd89"
+  integrity sha512-vVNjAV93c3aFbW6GJxG+rxuzr3Absadv9RYMaUh7OBhmSPYDyb+4JvaCvEfL+4P/ZEN3Ch4GNUD2eCNgfnF2tw==
+  dependencies:
+    "@babel/runtime" "^7.0.0"
+    bluebird "^3.5.0"
+
 gatsby-transformer-sharp@^2.1.19:
   version "2.1.19"
   resolved "https://registry.yarnpkg.com/gatsby-transformer-sharp/-/gatsby-transformer-sharp-2.1.19.tgz#9edd635a7b3ad385695a7a05d103cfabfcfa5926"