Twilight

A CMS integrated static blog template built with Astro framework.

 

🖥️ Live Demo 📝 Documentation

---

English | 中文

✨ Features

Content

• CMS Functionality: Easy content management with Decap CMS integration
• Data Visualization: Visualized personal data like projects, skills etc.
• Table of Contents: Automatic generation of post navigation

Components

• Analytics Support: Umami analytics integration for visitor insights
• Comment System: Twikoo-powered comment functionality
• Music Player: Background music support with playlist management
• PIO Widget: Interactive live2d character support

VFX

• Code Highlighting: Beautiful syntax highlighting for code blocks
• Customizable Theme Colors: Realtime customizable color schemes
• Dynamic Wallpaper System: Carousel support with multiple display modes
• Immersive Particle Effects: Highly customizable animated particles

Compability

• Modern & Responsive Design: Fully optimized for desktop and mobile devices
• Multilingual Capability: Built-in translation functionality for global accessibility

📦 Installation

1. Clone the repository:

   git clone https://github.com/Spr-Aachen/Twilight.git
   cd Twilight

2. Install dependencies:

   # Install bun if not already installed
   npm install -g bun
   
   # Install project dependencies
   bun install

3. Configure your blog:

   • Customize blog settings inside src/config.ts
   • Support CMS functionality inside .env
   • Support Umami analytics inside .env
   • Update site information inside src/data

4. Start the development server:

   bun dev

🚀 Deployment

Deploy your blog to any static hosting platform

⚡ Commands

Command	Action
bun lint	Check and fix code issues
bun format	Format code with Biome
bun check	Run Astro error checking
bun dev	Start local dev server
bun build	Build site to ./dist/
bun preview	Preview build locally
bun astro ...	Run Astro CLI commands
bun new-post <filename>	Create a new blog post

🙏 Acknowledgements

• Prototype - Fuwari
• Inspiration - Yukina & Mizuki
• CMS - astro-decap-cms-oauth
• translation - translate

🤝 Support

This project is supported by Alibaba Cloud ESA for accelerated delivery, compute, and protection.