Overview:

The Hashnode Blog Starter Kit is a tool that allows users to quickly deploy a frontend for their Hashnode blog. It is powered by Next.js and Tailwind and utilizes Hashnode’s Public APIs. The starter kit is fully customizable and can be deployed anywhere, including a subpath of a custom domain. With the integration of Hashnode’s headless mode, users can use Hashnode’s editor and dashboard to create content and collaborate while customizing the frontend to their liking.

Features:

• Next.js and Tailwind powered frontend
• Utilizes Hashnode’s Public APIs
• Fully customizable blog
• Can be deployed anywhere
• Supports subpath installation
• Integration with Hashnode’s headless mode
• Allows for collaborative content creation
• Supports custom domains

Installation:

Step 1: The recommended approach is to deploy the starter kit on Vercel. Follow these steps:

1. Fork the repository.
2. Create a new project on Vercel and connect the repository.
3. Choose either packages/blog-starter-kit/themes/enterprise, packages/blog-starter-kit/themes/hashnode, or packages/blog-starter-kit/themes/personal as the root directory.
4. Select Next.js as the framework preset.
5. Set the required environment variables.
6. Visit the auto-generated domain on Vercel to ensure the deployment.

Step 2 (optional subpath installation): If you want to install your blog under a custom domain subpath, follow these steps:

For Vercel:

• Add the provided rewrite to the next.config.js file.
• Deploy the project, and the subpath installation should work successfully.

For Cloudflare:

• If you are using Cloudflare in proxy mode, deploy the provided worker script.
• Replace the values of subpath and blogBaseUrl in the code snippet.
• Cloudflare will proxy requests starting with yourdomain.com/blog to your headless blog.

Step 3: After deploying the starter kit on your own domain, enable headless mode in your blog dashboard on Hashnode.

• Go to the “Advanced” tab and scroll down to the “Use Hashnode as a headless CMS” section.
• Enable the option and enter your blog base URL.
• Save the settings, and your blog will be treated as a headless blog by Hashnode.

Summary:

The Hashnode Blog Starter Kit provides a powerful tool for quickly deploying a customizable frontend for a Hashnode blog. With integration with Next.js, Tailwind, and Hashnode’s Public APIs, users can easily create and customize their blog while benefiting from the collaborative features of Hashnode’s editor and dashboard. The starter kit also supports easy deployment on various platforms and allows for subpath installation for custom domains. With the added advantage of Hashnode’s headless mode, users can have full control over their blog’s frontend while benefiting from Hashnode’s backend.