gatsby-starter-morning-dew v3.6.0

gatsby-starter-morning-dew

:rocket: A gatsby-starter-morning-dew is a Gatsby starter to build lightning-fast websites!
:dizzy: You can also use gatsby-starter-morning-dew as a Gatsby Theme

Demo website.

Features

• :purple_heart: Gatsby v3 / React 16
• :mag: SEO optimized
• :love_letter: Write posts/pages in Markdown or MDX
  • :art: Code syntax highlight
  • :books: Multilang support/i18n (blog post)
• :iphone: Mobile Friendly (Responsive design)
• :last_quarter_moon_with_face: Dark mode
• :sparkles: PWA ready
  • :airplane: Offline support
  • :page_with_curl: Manifest support
• :wrench: Fully configurable (see data/siteConfig.js)
• :speech_balloon: Disqus support
• :nail_care: css-in-js (with styled-components v5)
• :bookmark: Groups post with tags
• :bird: post preview image generation (Twitter, Facebook...)
• :gem: Developer tools:
  • eslint
  • prettier
• :construction_worker: Travis CI support

Installation (starter)

• with Gatsby-cli:

npm install --global gatsby-cli
gatsby new gatsby-blog https://github.com/maxpou/gatsby-starter-morning-dew

• without Gatsby-cli

git clone my-site git@github.com:maxpou/gatsby-starter-morning-dew.git
cd my-site
npm install

Then run npm run develop to try it locally.

Installation (theme)

You can also use gatsby-starter-morning-dew as a Gatsby theme!

1. Add the theme

   npm install gatsby-starter-morning-dew

2. In your gatsby-config.js, add:

   const config = require('./data/siteConfig')
   // ...
   plugins: [
       {
         resolve: "gatsby-starter-morning-dew",
         options: {},
       },
       {
         resolve: `gatsby-plugin-manifest`,
         options: {
           name: config.siteTitle,
           short_name: config.siteTitle,
           start_url: config.pathPrefix,
           background_color: config.background_color,
           theme_color: config.theme_color,
           display: config.display,
           icon: 'content/images/company-icon.png', // path to your image
         },
       },
   ],

3. Add an image called baymax.png in content/images/baymax.png.
   🐞This is due to a theme limitations.
   😬 Don't worry, this picture will not appear on your website!

Need more details? Checkout:

• maxpou.fr source: Maxence Poutord's personnal blog;
• gatsby-groot source: a minimalist blog that use this template!

Commands

# working locally
npm run dev

# generate build
npm run build

# format code
npm run format

# lint code
npm run lint

# Generate generate post preview images (npm run dev need to run before)
npm run generatePostPreviewImages

:warning: Add --prefix-paths if you are using path prefix!

Configure

module.exports = {
  siteTitle: 'gatsby-starter-morning-dew',
  siteDescription: 'A Gatsby theme/starter to build lightning-fast websites',
  authorName: 'Maxence Poutord',
  twitterUsername: '_maxpou',
  authorAvatar: 'avatar.jpeg', // file in content/images
  defaultLang: 'en', // show flag if lang is not default. Leave empty to enable flags in post lists
  authorDescription: `
  For the last decade, Maxence Poutord has worked with a variety of web technologies. He is currently focused on front-end development.
  On his day to day job, he is working as a senior front-end engineer at VSware. He is also a frequent tech speaker and a mentor.
  As a new digital nomad, he is living where the WIFI and sun is 😎 <br>
  Do you want to know more? <a href="https://www.maxpou.fr/about" target="_blank">Visit my website!</a>
  `,
  siteUrl: 'https://maxpou.github.io/',
  disqusSiteUrl: 'https://www.maxpou.fr/',
  // Prefixes all links. For cases when deployed to maxpou.fr/gatsby-starter-morning-dew/
  pathPrefix: '/gatsby-starter-morning-dew', // Note: it must *not* have a trailing slash.
  siteCover: 'cover-baymax.jpeg', // file in content/images
  background_color: '#ffffff',
  theme_color: '#222222',
  display: 'standalone',
  icon: 'content/images/baymax.png',
  postsPerPage: 6,
  disqusShortname: 'maxpou',
  headerTitle: 'gatsby-starter-morning-dew',
  headerLinksIcon: 'baymax.png', // file in content/images (leave empty to disable: '')
  headerLinks: [
    {
      label: 'Blog',
      url: '/',
    },
    {
      label: 'About',
      url: '/about-gatsby-starter-morning-dew',
    },
    {
      label: 'Installation',
      url: '/how-to-install',
    },
  ],
  // Footer information (ex: Github, Netlify...)
  websiteHost: {
    name: 'GitHub',
    url: 'https://github.com',
  },
  footerLinks: [
    {
      sectionName: 'Explore',
      links: [
        {
          label: 'Blog',
          url: '/',
        },
        {
          label: 'About',
          url: '/about-gatsby-starter-morning-dew',
        },
        {
          label: 'Installation',
          url: '/how-to-install',
        },
      ],
    },
    {
      sectionName: 'Follow the author',
      links: [
        {
          label: 'Github',
          url: 'https://github.com/maxpou/gatsby-starter-morning-dew',
        },
        {
          label: 'Website',
          url: 'https://www.maxpou.fr',
        },
        {
          label: 'Twitter',
          url: 'https://twitter.com/_maxpou',
        },
      ],
    },
  ],
}

Deploy