本文施工中🚧

特别感谢innei大佬开源mix-space和Shiro，让我一个完全不懂Node.js和CSS的人也能有一个个人网站

本指北主要按照官方文档，社区教程以及DeepSeek大人的指导和我个人的实践经验编写

请做好准备，本文档只是一个指引，即使你完全按照本文档执行，也有很大可能遇到报错

请善用ai辅助你克服它们

重要声明

由于本人并无任何Node.js和CSS甚至HTML的学习经历，本指南仅供参考且仅适用于如何将其从零部署下来，

后续的更新和维护请参考官方文档和社区教程

也非常欢迎任何访客指正我的任何错误

前期准备

硬件上

一台个人电脑 -> 用于链接服务器和本地预览 ~~总不能在手机上链接吧(也不是不行)~~
以及一个会问ai和举一反三的脑子

软件上

安装Git -> 用于Clone GitHub仓库的内容以本地预览，如果不准备本地预览的话可以不用
FEDORA43
sudo dnf install git
需要安装pnpm -> 用于本地运行前端预览，如果不准备本地预览的话可以不用
FEDORA43
sudo dnf install pnpm
需要准备一个个人的GitHub账号 -> 用于Fork 前端Shiro的仓库并部署在Vercel上

其他主要是要花钱的

一台云端轻量应用服务器 -> 用于部署后端

请至少保证你的服务器的系统满足以下要求：

liunx且内核为Linux 内核版本 >= 4.19
Memory >= 1G

我选用的为宝塔liunx面板

一个域名

Mix-space 后端部署

进入服务器安装docker

--- 根据个人经验，在首次进入宝塔面板时，可能会出现一个选择安装的界面，选择安装docker即可

--- 如果没有，可以参考官方文档：

使用以下命令测试或者验证docker是否安装:
docker -v
docker compose version
如果没有安装好，可以使用以下方法进行安装：当服务器在国内时，可以使用阿里云的脚本安装：
curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun
如果在国外，则可以使用官方脚本安装:
curl -fsSL https://get.docker.com | bash -s docker
运行完安装脚本后，请再次运行验证命令以验证docker是否安装成功

拉取后端docker配置文件

参考官方文档，使用以下命令：

LIUNX

cd && mkdir -p mx-space/core && cd $_

# 拉取 docker-compose.yml 文件
wget https://fastly.jsdelivr.net/gh/mx-space/core@master/docker-compose.yml

配置core启动配置文件

官方文档内的复制配置的功能已经足够方便与清晰，因此不在此赘述

~~绝对不是我懒得在这个界面上也实现这个功能~~

本部分请去参考官方文挡完成

启动core

来自官方文档：如果你的服务器在国内，无法拉取镜像或拉取速度过慢可自行使用代理或在docker-compose.yml里的image前添加镜像域名，比如docker.1panel.top/innei/mx-server:latest。镜像域名可参考国内Docker服务状态 & 镜像加速监控

进入服务器的mx-space/core文件夹下，运行以下命令

docker compose up -d

配置反向代理

以宝塔面板为例

进入宝塔面板后，选择网站->反向代理->添加反代进行配置

在配置界面......

~~施工中~~

至此，后端部署完毕，访问你的域名/proxy/qaqdmin来初始化和访问后端

前端部署

前提

后端已经部署完毕且可以正常访问
如果你选择使用Vercel部署前端，你需要拥有一个已经注册好的Github账号

配置后端

1、进入后端，在附加功能->配置与云函数界面添加配置~~找加号点就是了~~

2、在弹出的配置界面填写如下配置：

名称：shiro
引用：theme
数据类型：JSON

3、随后选中新建的文件（一般为/theme/shiro），在右侧进行编辑

初始配置如下，来自官方文档：

以下配置仅供参考，请根据你的实际要求进行修改，否则很可能无法达到你预期的效果配置详情请参考官方文档#配置页面

JSON

{
  "footer": {
    "otherInfo": {
      "date": "2020-{{now}}",
      "icp": {
        "text": "萌 ICP 备 20236136 号",
        "link": "https://icp.gov.moe/?keyword=20236136"
      }
    },
    "linkSections": [
      {
        "name": "关于",
        "links": [
          {
            "name": "关于本站",
            "href": "/about-site"
          },
          {
            "name": "关于我",
            "href": "/about"
          },
          {
            "name": "关于此项目",
            "href": "https://github.com/innei/Shiro",
            "external": true
          }
        ]
      },
      {
        "name": "更多",
        "links": [
          {
            "name": "时间线",
            "href": "/timeline"
          },
          {
            "name": "友链",
            "href": "/friends"
          },
          {
            "name": "监控",
            "href": "https://status.innei.in/status/main",
            "external": true
          }
        ]
      },
      {
        "name": "联系",
        "links": [
          {
            "name": "写留言",
            "href": "/message"
          },
          {
            "name": "发邮件",
            "href": "mailto:i@innei.ren",
            "external": true
          },
          {
            "name": "GitHub",
            "href": "https://github.com/innei",
            "external": true
          }
        ]
      }
    ]
  },
  "config": {
    "color": {
      "light": [
        "#33A6B8",
        "#FF6666",
        "#26A69A",
        "#fb7287",
        "#69a6cc",
        "#F11A7B",
        "#78C1F3",
        "#FF6666",
        "#7ACDF6"
      ],
      "dark": [
        "#F596AA",
        "#A0A7D4",
        "#ff7b7b",
        "#99D8CF",
        "#838BC6",
        "#FFE5AD",
        "#9BE8D8",
        "#A1CCD1",
        "#EAAEBA"
      ]
    },
 
    "bg": [
      "/static/images/F0q8mwwaIAEtird.jpeg",
      "/static/images/IMG_2111.jpeg.webp.jpg"
    ],
    "custom": {
      "css": [],
      "styles": [],
      "js": [],
      "scripts": []
    },
    "site": {
      "favicon": "/innei.svg",
      "faviconDark": "/innei-dark.svg"
    },
    "hero": {
      "title": {
        "template": [
          {
            "type": "h1",
            "text": "Hi, I'm ",
            "class": "font-light text-4xl"
          },
          {
            "type": "h1",
            "text": "Innei",
            "class": "font-medium mx-2 text-4xl"
          },
          {
            "type": "h1",
            "text": "👋。",
            "class": "font-light text-4xl"
          },
          {
            "type": "br"
          },
          {
            "type": "h1",
            "text": "A NodeJS Full Stack ",
            "class": "font-light text-4xl"
          },
          {
            "type": "code",
            "text": "<Developer />",
            "class": "font-medium mx-2 text-3xl rounded p-1 bg-gray-200 dark:bg-gray-800/0 hover:dark:bg-gray-800/100 bg-opacity-0 hover:bg-opacity-100 transition-background duration-200"
          },
          {
            "type": "span",
            "class": "inline-block w-[1px] h-8 -bottom-2 relative bg-gray-800/80 dark:bg-gray-200/80 opacity-0 group-hover:opacity-100 transition-opacity duration-200 group-hover:animation-blink"
          }
        ]
      },
      "description": "An independent developer coding with love."
    },
    "module": {
      "activity": {
        "enable": true,
        "endpoint": "/fn/ps/update"
      },
      "donate": {
        "enable": true,
        "link": "https://afdian.net/@Innei",
        "qrcode": [
          "/static/images/20191211132347.png",
          "/static/images/0424213144.png"
        ]
      },
      "bilibili": {
        "liveId": 1434499
      }
    }
  }
}

部署前端

以使用Vercel为例

1、登录你的github账号后进入Shiro仓库，点击Fork将其克隆到你的仓库中

2、进入Vercel，点击Sart Deploying，

3、

本网站的部署