|
1 | 1 | # Shiro |
2 | 2 |
|
3 | | -一个极简主义的个人网站,纸的纯净和雪的清新。 |
| 3 | +> **重要声明:** 由于个人精力有限,开源版本的 Shiro 后续将不再积极维护,仅会在发现重要安全漏洞时进行修复。我将把主要精力投入到赞助版 [白い](https://github.com/innei-dev/Shiroi) 的维护和功能迭代中。开源版本依然可以正常使用,感谢大家的理解和支持。 |
4 | 4 |
|
5 | | -为 [Mix Space](https://github.com/mx-space) 服务的个人站点前端。 |
| 5 | +一个极简主义的个人网站主题,如纸的纯净,似雪的清新。 |
6 | 6 |
|
7 | | -以下是一些使用 Shiro 的示例站点: |
| 7 | +专为 [Mix Space](https://github.com/mx-space) 生态系统设计的现代化个人站点前端。 |
| 8 | + |
| 9 | +## :sparkles: 示例站点 |
| 10 | + |
| 11 | +以下是一些使用 Shiro 主题的精美站点: |
8 | 12 |
|
9 | 13 | - [静かな森](https://innei.in) |
10 | 14 | - [可愛い松](https://blog.wibus.ren/) |
11 | 15 | - [启动台の博客](https://www.launchpadx.top/) |
12 | 16 |
|
13 | | -欢迎你来体验 Shiro 的魅力! |
| 17 | +欢迎体验 Shiro 带来的极简之美! |
| 18 | + |
| 19 | +## :rocket: 核心特性 |
14 | 20 |
|
15 | | -## :sparkles: 特征 |
| 21 | +- **:zap: 极致性能**:在 LightHouse 测试中表现卓越,Performance 和 Best Practice 均超过 90% |
| 22 | +- **:art: 现代设计**:简洁而不简单的用户界面,提供流畅优雅的用户体验 |
| 23 | +- **:gem: 细节至上**:采用符合物理学的 Spring 弹性动画,每一帧都如自然般舒适 |
| 24 | +- **:bell: 实时通知**:通过 WebSocket 连接,访客可实时接收最新文章推送 |
| 25 | +- **:computer: 活动状态**:结合 [ProcessReporter](https://github.com/Innei/ProcessReporter),在主页展示实时活动状态 |
| 26 | +- **:pencil: 扩展语法**:支持丰富的 Markdown 扩展语法,满足多样化写作需求 |
| 27 | +- **:wrench: 轻量管理**:内置轻量级管理面板,便于内容管理 |
16 | 28 |
|
17 | | -1. :rocket: **SEO 100%,性能优秀**:在 LightHouse 中表现优秀,Performance > 90%,Best practice > 90%。 |
18 | | -2. :art: **UI 现代化,简洁不简单**:用户界面设计现代化,简洁而不简单,让你的体验更加流畅。 |
19 | | -3. :gem: **注重细节,UX 极致**:注重每一个细节,所有的动画都使用符合物理的 Spring 弹性动画,每一帧都是大自然的感觉。 |
20 | | -4. :bell: **接入 WebSocket,实时获取最新的文章通知**:通过 WebSocket,访客能够实时获取最新的文章通知。 |
21 | | -5. :computer: **实时活动状态展示**:配合 [ProcessReporter](https://github.com/mx-space/ProcessReporterMac),可以在主页上显示实时活动状态。 |
22 | | -6. :pencil: **Markdown 的扩展语法**:支持更多的 Markdown 扩展语法,等待你的发掘和使用。 |
23 | | -7. :zap: **轻量级管理面板**:可以在管理面板中管理文章、评论等。 |
| 29 | +## :gear: 技术架构 |
24 | 30 |
|
25 | | -## :wrench: 技术栈 |
| 31 | +基于现代化的前端技术栈构建: |
26 | 32 |
|
27 | | -- NextJS (App Router) |
28 | | -- Jotai |
29 | | -- Framer motion |
30 | | -- Radix UI |
31 | | -- Socket.IO |
32 | | -- TailwindCSS |
| 33 | +- **NextJS** (App Router) - React 全栈框架 |
| 34 | +- **Jotai** - 原子化状态管理 |
| 35 | +- **Framer Motion** - 流畅动画库 |
| 36 | +- **Radix UI** - 无障碍组件库 |
| 37 | +- **Socket.IO** - 实时通信 |
| 38 | +- **TailwindCSS** - 原子化 CSS 框架 |
33 | 39 |
|
34 | | -## 📄 使用文档 |
| 40 | +## 📖 部署指南 |
35 | 41 |
|
36 | | -前往:https://mx-space.js.org/docs/themes/shiro/deploy |
| 42 | +详细的部署教程请参考:https://mx-space.js.org/docs/themes/shiro/deploy |
37 | 43 |
|
38 | | -感谢 @wibus-wee 和 @wuhang2003 等其他社区贡献者编写。 |
| 44 | +感谢 @wibus-wee、@wuhang2003 等社区贡献者编写的详细文档。 |
39 | 45 |
|
40 | | -## :camera: 截图 |
| 46 | +## :camera: 界面预览 |
41 | 47 |
|
42 | 48 | <img width="1471" alt="Live Demo" src="https://github.com/Innei/Shiro/assets/41265413/bf8af4ec-0f0c-441a-8c06-4b44e1649597"> |
43 | 49 |
|
44 | | -轻管理面板: |
| 50 | +**轻量级管理面板:** |
45 | 51 |
|
46 | | - |
47 | | - |
| 52 | + |
| 53 | + |
48 | 54 |
|
49 | 55 | <details> |
50 | 56 | <summary> |
51 | | -点击查看部分完整页面截图 |
| 57 | +点击查看更多完整页面截图 |
52 | 58 | </summary> |
53 | 59 |
|
54 | 60 |  |
55 | 61 |  |
56 | 62 |
|
57 | 63 | </details> |
58 | 64 |
|
59 | | -## :zap: 性能 |
| 65 | +## :zap: 性能测试 |
60 | 66 |
|
61 | | -在 M2 Macbook Air 环境中对逻辑最重的页面进行了测试。 |
| 67 | +在 M2 MacBook Air 环境下对重负载页面的性能测试结果: |
62 | 68 |
|
63 | | - |
| 69 | + |
64 | 70 |
|
65 | | -## :rocket: 部署 |
| 71 | +## :whale: 快速开始 |
66 | 72 |
|
67 | | -[看这里](https://mx-space.js.org/docs/themes/shiro/deploy). |
| 73 | +### :package: 预构建版本 |
68 | 74 |
|
69 | | -## :whale: 运行 |
| 75 | +从 [Releases](https://github.com/Innei/Shiro/releases) 页面下载最新的 `release.zip` 压缩包并解压: |
70 | 76 |
|
71 | | -### :hammer: 通过预构建运行 |
72 | | - |
73 | | -首先在 `https://github.com/Innei/Shiro/releases` 中下载预构建好的 `release.zip`。然后解压它。 |
74 | | - |
75 | | -```sh |
| 77 | +```bash |
76 | 78 | cd standalone |
77 | | -vim .env # 修改你的 ENV 变量 |
| 79 | +vim .env # 配置环境变量 |
78 | 80 | export PORT=2323 |
79 | 81 | node server.js |
80 | 82 | ``` |
81 | 83 |
|
82 | | -### :books: 推荐使用 Docker Compose |
| 84 | +### :docker: Docker Compose(推荐) |
83 | 85 |
|
84 | | -```sh |
85 | | -mkdir shiro |
86 | | -cd shiro |
| 86 | +```bash |
| 87 | +mkdir shiro && cd shiro |
87 | 88 | wget https://raw.githubusercontent.com/Innei/Shiro/main/docker-compose.yml |
88 | 89 | wget https://raw.githubusercontent.com/Innei/Shiro/main/.env.template .env |
89 | 90 |
|
90 | | -vim .env # 修改你的 ENV 变量 |
| 91 | +vim .env # 配置环境变量 |
91 | 92 | docker compose up -d |
92 | 93 |
|
93 | | -docker compose pull # 后续更新镜像 |
| 94 | +# 后续更新 |
| 95 | +docker compose pull |
94 | 96 | ``` |
95 | 97 |
|
96 | | -## Markdown 扩展语法 |
| 98 | +## :memo: Markdown 扩展 |
| 99 | + |
| 100 | +了解更多 Markdown 扩展语法,请访问:https://shiro.innei.in/#/markdown |
97 | 101 |
|
98 | | -请阅读 https://shiro.innei.in/#/markdown |
| 102 | +## :heart: 致谢与许可 |
99 | 103 |
|
100 | | -## :heart: 鸣谢 & 许可 |
| 104 | +**© 2024 Innei** - 本项目采用 AGPLv3 许可证,并附加特定的商业使用条件。 |
101 | 105 |
|
102 | | -2024 © Innei,本软件遵循 AGPLv3 许可证,附加特定的商业使用条件。此外,使用本项目还需要遵循[附加条款和条件](ADDITIONAL_TERMS.md)。 |
| 106 | +使用本项目需要遵循 [附加条款和条件](ADDITIONAL_TERMS.md)。 |
103 | 107 |
|
104 | | -部分代码参考自 GPT-4 和 [cali.so](https://github.com/CaliCastle/cali.so)。 |
| 108 | +**特别鸣谢:** |
| 109 | +- 部分代码参考了 GPT-4 和 [cali.so](https://github.com/CaliCastle/cali.so) |
| 110 | +- 感谢 Mix Space Team 和社区贡献者们的持续支持 |
105 | 111 |
|
106 | | -感谢 Mix Space Team 和广大社区朋友们的贡献。 |
| 112 | +**赞助版本:** [白い (Shiroi)](https://github.com/innei-dev/Shiroi) - 获得更多功能和持续更新 |
107 | 113 |
|
108 | | -[赞助版](https://github.com/sponsors/Innei):[白い](https://github.com/innei-dev/Shiroi) |
| 114 | +--- |
109 | 115 |
|
110 | 116 | > [个人网站](https://innei.in/) · GitHub [@Innei](https://github.com/innei/) |
0 commit comments