Astro启动器

astro-news — Astro 启动器模板

作者 Mrahmani71

基于 Astro 构建的新闻网站启动器，内置 Keystatic CMS、分页、搜索、RSS、站点地图与深色模式，采用 Tailwind CSS 与 DaisyUI，MIT 许可。

打开源站下载源码 ZIP

看看你的网站会是什么样

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

2 个预览视图

桌面端首页1 / 2

访问演示网站在新标签页打开

桌面端截图首屏预览

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

全部页面与视图 2

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

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

值得关注的模板亮点

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

使用 Astro 构建的新闻网站启动器，含桌面端与手机端首页截图

已实现 Keystatic CMS、Content Layer、分页、搜索、RSS Feed 与站点地图

采用 Tailwind CSS 与 DaisyUI，提供响应式布局和深色模式

使用 TypeScript 与 MDX 编写内容与组件

MIT 许可，允许免费使用、修改、商用和分发该版本代码

模板详细介绍

astro-news 是一个用 Astro 构建的新闻网站启动器，作者将其定位为现代、响应式的新闻阅读体验。仓库提供桌面端与手机端首页截图，演示站部署在 Vercel。

内容与功能方面，项目已实现 Content Layer、Keystatic CMS、导航、响应式设计、分页、搜索、RSS Feed、站点地图、深色模式，并标注 SEO 优化仍在完善中；Open Graph 图片生成列为后续计划。技术栈包括 Astro、Keystatic、Tailwind CSS、DaisyUI、TypeScript、MDX、Bun 与 HugeIcons，部署平台为 Vercel。设计参考了 BBC News 及两个 Dribbble 新闻类页面，分页与静态搜索的实现参考了公开文章。

作者在 README 中说明这是其第一个开源项目，可能存在 bug 或问题，会尽快处理。项目采用 MIT 许可，免费范围限于该版本代码；演示图片、字体、图标等第三方素材需按各自许可核对，域名、托管等外部服务可能另外收费。

Astro启动器

适合你的项目吗？

适用场景

搭建以新闻或文章列表为主的静态内容站点
需要可视化内容编辑入口（Keystatic CMS）的 Astro 项目
希望直接获得分页、搜索、RSS 与站点地图等基础能力的站点
在 Vercel 上部署 Astro 静态站点并需要响应式与深色模式

适合人群

熟悉 Astro 与 TypeScript 的前端开发者
需要新闻类站点起步模板并接受自行排查问题的个人或团队
希望使用 Keystatic 管理内容的静态站点项目
以 MIT 许可代码为基础进行二次开发的使用者

上手与定制指南

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

1
克隆仓库后使用 bun install 安装依赖，bun dev 启动开发服务器
2
启用 Keystatic CMS 需将 .env.example 重命名为 .env，并设置 RUN_KEYSTATIC=true
3
Keystatic 管理界面位于 http://localhost:4321/keystatic
4
作者说明这是其首个开源项目，可能存在 bug 或问题
5
演示图片、字体、图标等第三方素材需按各自许可核对，外部服务可能另外收费

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

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

使用时需要遵守

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

额外费用与待核对事项

演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 MIT 许可判断。
域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
作者声明这是其首个开源项目，可能存在 bug 或问题，使用前需自行评估稳定性并承担排查成本。
启用 Keystatic CMS 需将 .env.example 重命名为 .env 并设置 RUN_KEYSTATIC=true，属于本地环境配置要求。
Keystatic 管理界面仅在本地开发服务器地址 http://localhost:4321/keystatic 访问，需先启动开发服务器。
README 将 SEO 优化标注为带波浪号的未完成状态，说明该能力尚不完整，不应视为已完全实现。
Open Graph 图片生成被列为后续计划功能，当前版本不包含该能力。

查看原文依据

Permission is hereby granted, free of charge
许可证原文

Astro news is my first open-source project, so there may be some bugs or issues. I’ll address them as quickly as possible.
README 原文

1. Rename `.env.example` to `.env`. 2. Set `RUN_KEYSTATIC=true`.
README 原文

Open `http://localhost:4321/keystatic` in your browser.
README 原文

SEO Optimization (~)
README 原文

### Upcoming Features - Open Graph (OG) Image Generation
README 原文

https://github.com/Mrahmani71/astro-news/blob/master/LICENSE.md https://github.com/Mrahmani71/astro-news/blob/master/README.md

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

项目核对记录与介绍依据

模板资料

来源平台: Astro Themes
资料与维护参考分: 资料较完整 · 85 / 100
技术栈: Astro
网站类型: 启动器

这个分数如何计算

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

这个项目需要核对什么

记录的仓库更新时间: 2025-08-15
截图检查日期: 2026-10-05

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

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

查看具体选型方法 →

介绍的制作与核对状态

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

审核声明: [email protected] · 2026-10-05

查看当时使用的来源资料

SHA-256: eaa5d63dd1e0491f97d972212a8b6df37884db14064a724348e0f123f13ff432

2026-10-05T08:50:26.829Z

来源文件 / 仓库

# Astro News 📰

A news website built with Astro, designed to provide a modern and responsive news reading experience.

> **ℹ️ Info**  
> Astro news is my first open-source project, so there may be some bugs or issues. I’ll address them as quickly as possible.

![Astro News](./src/assets/images/screenshot-astronews.png "Astro News")

![performances](./src/assets/images/Performances.png "Performances")

## 🌐 Demo

Explore the live demo here: [**Live Demo**](https://astro-news-six.vercel.app/)

## 🚀 Installation

Follow the steps below to set up and run the project locally:

### Clone the Repository

```bash
git clone https://github.com/Mrahmani71/astro-news.git
```

### Install Dependencies

``` bash
bun install
```

### Run Development Server

```bash
bun dev
```

### Running Keystatic CMS

1. Rename `.env.example` to `.env`.

2. Set `RUN_KEYSTATIC=true`.

3. Start the development server:

 ```bash
    bun dev 
  ```

4. Open `http://localhost:4321/keystatic` in your browser.

## ✨ Features

### Implemented Features

- Content Layer
- Keystatic CMS
- Navigation
- Responsive Design
- Pagination
- Search Functionality
- RSS Feed
- Sitemap
- Dark Mode
- SEO Optimization (~)

### Upcoming Features

- Open Graph (OG) Image Generation

## 💻 Technologies

This project leverages cutting-edge web technologies:

- [Astro V5.7](https://astro.build) - Modern static site builder
- [KeyStatic](https://keystatic.com) - Headless content-management system
- [Tailwind CSS](https://tailwindcss.com) - Utility-first CSS framework
- [DaisyUI](https://daisyui.com/) - Tailwind CSS component library
- [TypeScript](https://typescriptlang.org) - Typed JavaScript
- [MDX](https://mdxjs.com) - Markdown with JSX support
- [Bun V1.2.10](https://bun.sh) - Fast JavaScript runtime
- [Vercel](https://vercel.com) - Deployment platform
- [HugeIcons](https://hugeicons.com) - Icon library

## 💡  Inspirations and Code Concepts

This project draws inspiration from the following sources:

### Designs

- [BBC News](https://www.bbc.com)
- [NewsHub - News Website](https://dribbble.com/shots/21678041-NewsHub-News-Website)
- [Let'sread - News Landing Page](https://dribbble.com/shots/24675325-Let-sread-News-Landing-Page)

### Articles

- [Creating A Pagination Component With Astro](https://rimdev.io/creating-a-pagination-component-with-astro)
- [Adding search to static Astro sites](https://website-thomas-astro.vercel.app/blog/search-static-astro-website)

## 📄 License

Open sourced under the [MIT license](LICENSE.md).

## 🤝 Contributing

Contributions, issues, and feature requests are welcome! Feel free to check the [issues page](https://github.com/Mrahmani71/astro-news/issues).

反馈内容错误