Astro作品集博客

ziteox-blog — Astro 作品集模板

作者 LakiXd

基于 Astro 的博客与作品集站点模板,使用 Vitesse 主题,支持 Markdown/MDX 与 Vue 3 组件。

看看你的网站会是什么样

浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。

3 个预览视图
桌面端首页1 / 3
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 3

截图用于了解视觉与布局,交互效果请以实际项目为准。

采集于 2026-10-12查看来源

值得关注的模板亮点

从已有项目资料中,快速了解它的特点。

01

基于 Astro 构建,使用 Vitesse 主题(astro-theme-vitesse)并做了定制维护

02

支持 Markdown 与 MDX 内容,同时可在页面中使用 Vue 3 组件

03

使用 UnoCSS 进行样式编写,提供明暗主题切换

04

README 称包含 meta 标签、sitemap 与 RSS 等 SEO 相关配置

05

响应式移动优先布局,README 标注部署于 Netlify

06

采用 MIT 许可证,README 列出 Headless CMS、标签、动画等后续计划

模板详细介绍

Ziteox Blog 是一个用 Astro 构建的博客与作品集网站模板,基于 @kevinwong865 的 Vitesse 主题(astro-theme-vitesse)做了定制与维护。README 说明其定位为简洁、快速且对 SEO 友好的博客与作品集站点,并给出线上地址 blog.ziteox.com。

功能方面,README 列出:响应式移动优先布局、明暗主题切换、Markdown 与 MDX 支持、Vue 3 组件支持、UnoCSS 样式方案,以及包含 meta 标签、sitemap 和 RSS 的 SEO 配置;部署方式标注为 Netlify。README 还提到“Perfect Lighthouse scores”,这属于项目自述的声明,本介绍不对其做验证或背书。

模板仍处于演进中,README 的 Future Improvements 列出后续计划:接入 Headless CMS、作者支持与内容标签、性能监控、增强 SEO 与分享卡片预览、更多动画与页面过渡。这些均为计划项,不代表当前已具备。

使用方式上,README 给出克隆仓库、npm install、npm run dev 的本地启动流程,开发服务器端口为 1977;构建与预览使用 npm run build 和 npm run preview,产物输出到 dist 目录。项目采用 MIT 许可证。README 未提供依赖清单、具体框架版本号、内容目录结构或 CMS、评论、搜索等集成说明。

Astro作品集博客

适合你的项目吗?

适用场景

  • 搭建个人博客并发布 Markdown/MDX 文章
  • 同时展示个人作品集与博客内容的站点
  • 需要明暗主题切换与移动端适配的阅读型站点
  • 希望用 Vue 3 组件扩展页面交互的 Astro 项目

适合人群

  • 熟悉 npm 与 Astro 基本工作流的前端开发者
  • 需要博客与作品集合一站点的个人开发者
  • 偏好 Markdown/MDX 写作、并希望使用 Vue 组件的内容作者

上手与定制指南

结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。

  1. 1

    README 提供的本地启动流程:git clone 仓库、cd 进入目录、npm install、npm run dev

  2. 2

    开发服务器默认访问 http://localhost:1977

  3. 3

    构建与预览命令为 npm run build 和 npm run preview,产物在 dist 目录

  4. 4

    README 标注部署平台为 Netlify,但未给出具体部署配置步骤

  5. 5

    README 未提供依赖清单、内容目录结构与 CMS 等集成说明,需自行查看仓库文件

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供;担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-12。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料较完整 · 79 / 100
技术栈
Astro
网站类型
作品集 · 博客
这个分数如何计算

本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2025-07-30
截图检查日期
2026-10-12

已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Astro。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

审核声明: codex-user-requested-batch-review-20261015 · 2026-10-15

查看当时使用的来源资料

SHA-256: 47fc153f39e64ac5733df895b0336980967fc8e61655433280c3e94f47f868ea

2026-10-12T20:22:53.120Z

来源文件 / 仓库
# Ziteox Blog — Astro-Powered Portfolio & Blog

A minimal, fast, and SEO-friendly blog & portfolio site built with [Astro](https://astro.build), using the **Vitesse** theme by [@kevinwong865](https://github.com/kevinwong865). Currently live at 👉 [**blog.ziteox.com**](https://blog.ziteox.com)

> This is a customized and maintained version of the [astro-theme-vitesse](https://github.com/kevinwong865/astro-theme-vitesse) template.

---

## 🚀 Live Preview

![Preview](./public/preview.jpg)

Explore the blog: [**blog.ziteox.com**](https://blog.ziteox.com)

---

## ⚡ Features

- Perfect Lighthouse scores
- Fully responsive, mobile-first layout
- SEO-optimized with meta tags, sitemap, and RSS
- Dark & light theme toggle
- Markdown & MDX support
- Vue 3 component support
- UnoCSS for fast and utility-first styling
- Deployed on Netlify

---

## 📈 Future Improvements

Ziteox Blog is still evolving. Upcoming upgrades include:

- Headless CMS integration for easier content management  
- Author support & content tagging  
- Better performance monitoring  
- Enhanced SEO and share card previews  
- More animations & page transitions

Stay tuned and feel free to fork or contribute.

---

## 🛠️ Quick Start

Clone & run locally:

```bash
git clone https://github.com/ziteox/ziteox-blog
cd ziteox-blog
npm install
npm run dev
```

Then open `http://localhost:1977`

---

## 🧱 Build & Preview

```bash
npm run build
npm run preview
```

Production files will be in the `dist` folder.


---

## 📄 License

MIT License © [Ziteox](https://github.com/ziteox)  
Original base: [astro-theme-vitesse](https://github.com/kieranwv/astro-theme-vitesse) by [@kevinwong865](https://github.com/kieranwv)
反馈内容错误

看看同类模板

对比同技术栈与用途的模板,找到更适合的视觉与内容结构。