diff --git a/README.md b/README.md index 3d1247a..da5bb8c 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,15 @@ -# Fuwari +# 🍥Fuwari -Fuwari is a static blog template built with [Astro](https://astro.build), a refactored version of [hexo-theme-vivia](https://github.com/saicaca/hexo-theme-vivia). +A static blog template built with [Astro](https://astro.build). -[**🖥️Live Demo (Vercel)**](https://fuwari.vercel.app) +[**🖥️Live Demo (Vercel)**](https://fuwari.vercel.app)   /   [**🌏中文 README**](https://github.com/saicaca/fuwari/blob/main/README.zh-CN.md)   /   [**📦Old Hexo Version**](https://github.com/saicaca/hexo-theme-vivia) ![Preview Image](https://raw.githubusercontent.com/saicaca/resource/main/fuwari/home.png) ## ✨ Features -- [x] **Built with [Astro](https://astro.build) and [Tailwind CSS](https://tailwindcss.com)** -- [x] **View Transitions between pages** - - [is not supported by Firefox and Safari yet](https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API#browser_compatibility) +- [x] Built with [Astro](https://astro.build) and [Tailwind CSS](https://tailwindcss.com) +- [x] Smooth animations and page transitions - [x] Light / dark mode - [x] Customizable theme colors & banner - [x] Responsive design @@ -20,10 +19,12 @@ Fuwari is a static blog template built with [Astro](https://astro.build), a refa ## 🚀 How to Use -1. [Generate a new repository](https://github.com/saicaca/fuwari/generate) from this template. -2. Edit the config file `src/config.ts` to customize your blog. -3. Run `npm run new-post -- ` or `pnpm run new-post ` to create a new post and edit it in `src/content/posts/`. -4. Deploy your blog to Vercel, Netlify, GitHub Pages, etc. following [the guides](https://docs.astro.build/en/guides/deploy/). +1. [Generate a new repository](https://github.com/saicaca/fuwari/generate) from this template or fork this repository. +2. To edit your blog locally, clone your repository, run `pnpm install` AND `pnpm add sharp` to install dependencies. + - Install [pnpm](https://pnpm.io) `npm install -g pnpm` if you haven't. +3. Edit the config file `src/config.ts` to customize your blog. +4. Run `pnpm new-post ` to create a new post and edit it in `src/content/posts/`. +5. Deploy your blog to Vercel, Netlify, GitHub Pages, etc. following [the guides](https://docs.astro.build/en/guides/deploy/). ## ⚙️ Frontmatter of Posts @@ -43,12 +44,12 @@ draft: false All commands are run from the root of the project, from a terminal: -| Command | Action | -|:------------------------------------------------------------------|:-------------------------------------------------| -| `npm install` | Installs dependencies | -| `npm run dev` | Starts local dev server at `localhost:4321` | -| `npm run build` | Build your production site to `./dist/` | -| `npm run preview` | Preview your build locally, before deploying | -| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | -| `npm run astro -- --help` | Get help using the Astro CLI | -| `npm run new-post -- `
`pnpm run new-post ` | Create a new post | +| Command | Action | +|:------------------------------------|:-------------------------------------------------| +| `pnpm install` AND `pnpm add sharp` | Installs dependencies | +| `pnpm dev` | Starts local dev server at `localhost:4321` | +| `pnpm build` | Build your production site to `./dist/` | +| `pnpm preview` | Preview your build locally, before deploying | +| `pnpm new-post ` | Create a new post | +| `pnpm astro ...` | Run CLI commands like `astro add`, `astro check` | +| `pnpm astro --help` | Get help using the Astro CLI | diff --git a/README.zh-CN.md b/README.zh-CN.md new file mode 100644 index 0000000..803a557 --- /dev/null +++ b/README.zh-CN.md @@ -0,0 +1,55 @@ +# 🍥Fuwari + +基于 [Astro](https://astro.build) 开发的静态博客模板。 + +[**🖥️在线预览（Vercel）**](https://fuwari.vercel.app)   /   [**🌏English README**](https://github.com/saicaca/fuwari)   /   [**📦旧 Hexo 版本**](https://github.com/saicaca/hexo-theme-vivia) + +![Preview Image](https://raw.githubusercontent.com/saicaca/resource/main/fuwari/home.png) + +## ✨ 功能特性 + +- [x] 基于 Astro 和 Tailwind CSS 开发 +- [x] 流畅的动画和页面过渡 +- [x] 亮色 / 暗色模式 +- [x] 自定义主题色和横幅图片 +- [x] 响应式设计 +- [ ] 评论 +- [x] 搜索 +- [ ] 文内目录 + +## 🚀 使用方法 + +1. 使用此模板[生成新仓库](https://github.com/saicaca/fuwari/generate)或 Fork 此仓库 +2. 进行本地开发，Clone 新的仓库，执行 `pnpm install` 和 `pnpm add sharp` 以安装依赖 + - 若未安装 [pnpm](https://pnpm.io)，执行 `npm install -g pnpm` +3. 通过配置文件 `src/config.ts` 自定义博客 +4. 执行 `pnpm new-post ` 创建新文章，并在 `src/content/posts/` 目录中编辑 +5. 参考[官方指南](https://docs.astro.build/zh-cn/guides/deploy/)将博客部署至 Vercel, Netlify, GitHub Pages 等 + +## ⚙️ 文章 Frontmatter + +```yaml +--- +title: My First Blog Post +published: 2023-09-09 +description: This is the first post of my new Astro blog. +image: /images/cover.jpg +tags: [Foo, Bar] +category: Front-end +draft: false +--- +``` + +## 🧞 指令 + +下列指令均需要在项目根目录执行： + +| Command | Action | +|:----------------------------------|:----------------------------------| +| `pnpm install` 并 `pnpm add sharp` | 安装依赖 | +| `pnpm dev` | 在 `localhost:4321` 启动本地开发服务器 | +| `pnpm build` | 构建网站至 `./dist/` | +| `pnpm preview` | 本地预览已构建的网站 | +| `pnpm new-post ` | 创建新文章 | +| `pnpm astro ...` | 执行 `astro add`, `astro check` 等指令 | +| `pnpm astro --help` | 显示 Astro CLI 帮助 |