npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

gatsby-starter-morning-dew

v3.6.0

Published

A Gatsby theme/starter to build lightning-fast blog/websites

Downloads

246

Readme

Build Status Netlify Status code style: prettier Maintainability semantic-release

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.

screenshot

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

Lighthouse scores (locally :bowtie:)

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 [email protected]: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
  1. 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
      },
    },
],
  1. 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:

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

Deploy to Netlify