React Templates & Themes Logo React Templates & Themes
Blog screenshot

Blog

Author Avatar Theme by Giscafer
Updated: 24 Apr 2025
287 Stars

Next.js + Issues 博客解决方案 https://www.giscafer.com

Github Live Preview

Categories

Nextjs Scss Blog

Overview:

The giscafer.com website/blog is built with Next.js/Typescript and deployed on Vercel. The blog content is sourced from GitHub issues, with updates automatically pushed to the project’s data/blog/*.mdx folder through continuous integration (CI) monitoring. The website features automatic synchronization of GitHub issues, FaunaDB cloud storage for TODO functions like post liking and article view statistics, tags classification, and comments functionality.

Features:

  • GitHub Issues Auto Sync: Automatically synchronizes GitHub issues.
  • FaunaDB Cloud Storage: Stores TODO functionalities like post liking.
  • Article View Statistics: Tracks the number of times an article is viewed.
  • Tags Classification: Allows articles to be categorized under different tags.
  • Comments Functionality: Enables users to leave comments on articles.
  • Summary Field Extraction from MDX Files: Automatically retrieves and displays the summary field from MDX files.
  • Image Zoom Feature: Enables users to preview enlarged images by clicking on them.
  • Optimized Sync Process: Syncs only the most recently updated issues.

Installation:

To install and set up the giscafer.com theme, follow these steps:

  1. Modify the variables in scripts/github/syncPost.js.
  2. Change the environment variables GH_USER and GH_PROJECT_NAME when running the blog locally.
  3. Configure GitHub Action Secrets with GH_USER and GH_PROJECT_NAME to ensure proper CI execution.
  4. Optionally adjust the WeChat Official Account ID: giscafergiscafer.com for additional functionalities.

Summary:

The giscafer.com website/blog leverages Next.js/Typescript for its frontend and is hosted on Vercel. It automatically syncs content from GitHub issues, allowing for a seamless update process. With features like FaunaDB integration for task management, article view statistics, and user commenting, giscafer.com provides a comprehensive blogging experience. Additionally, the theme supports tags classification, image zoom, and optimized synchronization for a user-friendly and efficient blog setup.