My Personal Blog. Powered by Gatsby and Netlify CMS
OTHER License
TypeScript
Lunr search
Pagination
SEO friendly (Head API, Slug, Sitemap, Robots.txt etc)
Google Analytics & Disqus Comments with Cloudflare Zaraz
Built with shadcn/ui (Tailwind CSS)
Decap CMS(Netlify CMS) generated markdown pages with Prism code highlighting, social embedding etc
Netlify Forms
Dark Mode
Create a Gatsby site.
Use the Gatsby CLI to create a new site, specifying the blog starter.
# create a new Gatsby project
gatsby new {your-project-name} https://github.com/v4iv/theleakycauldronblog.git
Start developing.
Navigate to new site’s directory and start it up.
cd {your-project-name}/
yarn develop
Set up debugging in VS Code by adding the following to launch.json
{
"name": "Gatsby Develop",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/.bin/gatsby",
"args": [
"develop"
],
"env": {
"PARCEL_WORKERS": "0",
"GATSBY_CPU_COUNT": "2",
},
"runtimeArgs": [
"--nolazy"
],
"console": "integratedTerminal"
},
Open the code and start editing!
Your site is now running at http://localhost:8000!
Edit src/pages
to see your site update in real-time!
Customize
You'll need to change the following files to make it fully yours, also make sure to not deploy the site with the blog posts written for theleakycauldronblog.com:
gatsby-config.ts
: edit siteMetadata variable
locales/en/common.json
: react-i18next is being used to manage entire site's branding, though you can extend it to support multiple languages as well
static/admin/config.yml
: site url, default values
src/assets/avatar.png
: your brand icons
static/icon-*.png
: your brand icons
static/apple-touch-icon.png
: your brand icons
static/favicon.ico
: your brand icons
static/robots.txt
: sitemap url
Learn more