Build a blog system like Calpa's Blog in ease.
If you like this project, please don't hesitate to star it. Thank you.
You can edit the posts in /src/content/*.md
, or using Netlify-cms to edit the posts.
Use the button below to build and deploy your own copy of the repository:
After clicking that button, you’ll authenticate with GitHub and choose a repository name. Netlify will then automatically create a repository in your GitHub account with a copy of the files from the template.
Next, it will build and deploy the new site on Netlify, bringing you to the blog system when the build is complete.
Use the button below to code with the blog system:
How to start this project?
npm install --global gatsby-cli
awesome-blog
is your blog's foldergatsby new awesome-blog https://github.com/calpa/gatsby-starter-calpa-blog
cd awesome-blog
Run Development Server
npm start
to start the hot-reloading development server (powered by Gatsby)open http://localhost:8000
to open the site in your favorite browserEdit the export object in data/config
Note: To look up theme_color hex code, click here.
module.exports = {
title: 'your blog title here',
maxPages: 12
meta: {
description: 'blog description',
keyword: 'blog, JavaScript',
theme_color: '#hexcode',
favicon: 'https:yourimageurl.com',
google_site_verification: 'your google verification hash',
},
name: 'your name',
email: 'your_email@gmail.com',
iconUrl: 'https://youricon.jpg',
License: 'by',
url: 'https://yourblog.me',
about: '/2018/05/01/about-your-name/',
// Sidebar
zhihuUsername: 'your zhiu user name here',
githubUsername: 'your github user name here',
friends: [
{
title: 'friend title',
href: 'link to their blog',
}
]
Plugins in the configuration file:
gaOptimizeId: 'GTM-WHP7SC5',
gaTrackId: 'UA-84737574-3',
navbarList: [
{
href: '/stats/',
title: 'stat title',
},
{
href: '/tags/',
title: 'tags',
},
{
href: '/guestbook/',
title: 'guestbook',
},
{
href: '/2018/10/04/about-your-blog/',
title: 'your title',
},
],
redirectors: [
{
fromPath: '/',
toPath: '/page/1',
},
],
Gitalk plugin configuration
gitalk: {
clientID: '18255f031b5e11edd98a',
clientSecret: '2ff6331da9e53f9a91bcc991d38d550c85026714',
repo: 'calpa.github.io',
owner: 'calpa',
admin: ['calpa'],
distractionFreeMode: true,
},
}
Calpa's blog is currently using Netlify, though, you may use Github Pages as an alternative.
Github Pages
npm run deploy
to deploy the blog to Github Pages
Netlify
Auto Deploy
For window is defined
, wrap the require in check for window:
if (typeof window !== `undefined`) {
const module = require("module");
}
npm run reset
to clear the local cache
Check GatsbyJS Debugging Docs
Please read CONTRIBUTING.md for more information.
And don't hesitate to put your star and watch this starter project.
If you are interested in this project, please feel free to contact Calpa Liu.
Thanks For Contribute... :)