Skip to content

rownix101/Blog

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

166 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

merox-erudite

License

merox-erudite is a customized version of the astro-erudite theme, enhanced with additional features and modifications for a more complete blogging experience.

📖 Want to learn more about the original theme?
This theme is based on astro-erudite by @jktrn. For detailed documentation, architecture details, and the original design philosophy, visit the official astro-erudite repository.

🧩 二改说明

这是基于 astro-erudite 的二次改造版本,核心差异如下:

  • 内容统一收敛到 src/content/(避免旧 content/ 目录造成内容漂移)
  • OG 图片路由使用 src/pages/og/[...route].ts
  • 运行时统一使用 Bun(bun install / bun run dev / bun run build
  • Cloudflare Pages 静态输出配置已适配(见 astro.config.tswrangler.jsonc

🎯 What's Different from astro-erudite?

This theme includes several enhancements and customizations:

✨ New Features

  • Newsletter Integration - Brevo (formerly Sendinblue) newsletter subscription with GDPR-compliant consent
  • Giscus Comments - Integrated comment system powered by GitHub discussions
  • Google AdSense - Built-in AdSense component with view transition support
  • Analytics Support - Google Analytics and Umami Analytics integration
  • SEO Enhancements - FAQ Schema and HowTo Schema components for better search visibility
  • Enhanced Homepage - Custom hero section with experience timeline and skills showcase
  • Improved Typography - Geist font family integration
  • Better Accessibility - Enhanced focus indicators and screen reader support

🎨 Design Improvements

  • Custom color palette optimized for readability
  • Improved contrast ratios for better accessibility
  • Enhanced dark mode support
  • Modern hero section with background image support
  • Experience timeline component
  • Skills showcase with animated tech badges

🔧 Technical Enhancements

  • Updated dependencies to latest versions
  • Improved error handling and error boundaries
  • Better view transition support
  • Optimized performance with lazy loading
  • Enhanced TypeScript types

📋 Features

All features from astro-erudite plus:

  • Astro's Islands architecture
  • shadcn/ui with Tailwind styling
  • Expressive Code for code blocks
  • Blog authoring with MDX and $\LaTeX$ math rendering
  • Astro View Transitions
  • SEO optimization with granular metadata
  • RSS feed and sitemap generation
  • Subpost support for series content
  • Author profiles and multi-author support
  • Project tags and categorization
  • Newsletter subscription (Brevo integration)
  • Giscus comments (optional)
  • Google AdSense support (optional)
  • Analytics (Google Analytics & Umami)

🚀 Getting Started

  1. Use this template - Click the "Use this template" button to create a new repository

  2. Clone the repository:

    git clone https://github.com/[YOUR_USERNAME]/[YOUR_REPO_NAME].git
    cd [YOUR_REPO_NAME]
  3. Install dependencies:

    bun install
  4. Configure environment variables (optional): Create a .env file with:

    # Newsletter (Brevo)
    BREVO_API_KEY=your-api-key
    BREVO_LIST_ID=your-list-id
    BREVO_TEMPLATE_ID=5
    
    # Analytics
    PUBLIC_GOOGLE_ANALYTICS_ID=your-ga-id
    PUBLIC_UMAMI_WEBSITE_ID=your-umami-id
    
    # Giscus Comments
    PUBLIC_GISCUS_REPO=your-username/your-repo
    PUBLIC_GISCUS_REPO_ID=your-repo-id
    PUBLIC_GISCUS_CATEGORY=General
    PUBLIC_GISCUS_CATEGORY_ID=your-category-id
  5. Start the development server:

    bun run dev
  6. Open your browser and visit http://localhost:1234

⚙️ Configuration

Site Configuration

Edit src/consts.ts to customize:

export const SITE: Site = {
  title: 'Your Site Name',
  description: 'Your site description',
  href: 'https://yourdomain.com',
  author: 'your-author-id',
  locale: 'en-US',
  featuredPostCount: 2,
  postsPerPage: 6,
}

export const NAV_LINKS: SocialLink[] = [
  { href: '/blog', label: 'Blog' },
  { href: '/about', label: 'About' },
]

export const SOCIAL_LINKS: SocialLink[] = [
  { href: 'https://github.com/username', label: 'GitHub' },
  // ... more links
]

Newsletter Setup

  1. Sign up for Brevo (free tier available)
  2. Get your API key from Settings → API Keys
  3. Create a list and get the List ID
  4. Add environment variables to .env

Giscus Setup

  1. Install the Giscus app on your GitHub repository
  2. Enable discussions on your repository (Settings → General → Features)
  3. Visit giscus.app to generate configuration
  4. Add the environment variables to .env:
    • PUBLIC_GISCUS_REPO: Your GitHub repository (username/repo)
    • PUBLIC_GISCUS_REPO_ID: Repository ID (provided by Giscus)
    • PUBLIC_GISCUS_CATEGORY: Discussion category (usually "General")
    • PUBLIC_GISCUS_CATEGORY_ID: Category ID (provided by Giscus)

AdSense Setup

  1. Edit src/components/AdSense.astro
  2. Replace ca-pub-XXXXX with your AdSense publisher ID
  3. Replace data-ad-slot with your ad slot ID

📝 Adding Content

Blog Posts

Add MDX files to src/content/blog/:

---
title: 'Your Post Title'
description: 'A brief description'
date: 2024-01-01
tags: ['tag1', 'tag2']
image: './image.png'
authors: ['author-id']
draft: false
---

Authors

Add author files to src/content/authors/:

---
name: 'Author Name'
pronouns: 'they/them'
avatar: 'https://gravatar.com/avatar/...'
bio: 'Author bio'
website: 'https://example.com'
github: 'https://github.com/username'
---

🎨 Customization

Colors

Edit src/styles/global.css to customize the color palette:

:root {
  --primary: hsl(214 95% 52%);
  /* ... more colors */
}

[data-theme='dark'] {
  --primary: hsl(214 95% 62%);
  /* ... more colors */
}

Fonts

The theme uses Geist font family. Font files are in public/fonts/. To change fonts:

  1. Replace font files in public/fonts/
  2. Update @font-face declarations in src/styles/global.css
  3. Update --font-sans and --font-mono in the theme configuration

📄 License

This project is open source and available under the MIT License.

💻 Development Transparency

Important Note: This theme was developed exclusively using Cursor (an AI-powered code editor) with paid subscription. I am not a programmer by profession—I'm a System Administrator with a passion for sharing knowledge through blogging.

The development process involved:

  • Iterative conversations with Cursor's AI assistant
  • Learning and understanding code through AI explanations
  • Testing and refining features with AI guidance
  • Building on the excellent foundation of astro-erudite

This transparency is important because:

  1. Honesty - You should know how this theme was created
  2. Accessibility - It demonstrates that you don't need to be a professional developer to create useful tools
  3. AI-Assisted Development - Shows the potential of AI coding assistants for non-programmers

While the code was written with AI assistance, all decisions about features, design, and implementation were made by me based on my needs as a blogger. The theme has been tested and is fully functional.

🙏 Credits

Original Theme

This theme is a fork and customization of astro-erudite by @jktrn.

For comprehensive documentation, detailed feature explanations, and the original theme's design philosophy, please visit the official astro-erudite repository.

Additional Credits

📚 Resources

Official Theme Documentation

Technology Documentation


Built with ❤️ by merox

Developed using Cursor AI coding assistant

About

No description, website, or topics provided.

Resources

Contributing

Stars

Watchers

Forks

Releases

Sponsor this project

Packages

Contributors

Languages