I. Why Choose Shiro

I started deploying my own blog in June 2024. Typecho became my first blog system thanks to its lightweight nature and ease of deployment, but over time I found that Typecho relies heavily on the plugin ecosystem for the editor and content customization, and storage is limited to local (other storage locations also depend on plugins, which makes migration and content management troublesome). This is quite a dilemma for blogs that are not purely text-based.

1. For media library management, I also developed a corresponding plugin:

2. For article subscription, I also wrote a plugin:

However, Shiro’s backend system Mx-Space provides an editor, file management, email subscription, and the various developers are all top-notch, so you don’t need to worry about deployment issues (compared with PHP, which may be unfriendly to beginners).

Shiro-Related Projects

II. Local Deployment Process

Prerequisites:

• This deployment uses a single domain name, server may need 4G RAM, 1Panel + OpenResty, backend deployed with Docker
• To cover all situations in a trial deployment, I’ll try to write a more general tutorial

1. Related Environment

Update and install necessary packages and tools

Install NVM

Run the source ~/.profile command to reload environment variables into the current session

Install Node.js

Install pnpm and pm2

Install sharp (optional)

2. Backend Core Deployment

Use the command line to pull the files

Modify some of the content in docker-compose.yml: domain name, JWT secret, encryption-related configuration (false by default)

Start Core

Set up reverse proxy (single domain). In 1Panel, choose static website and then just modify the location section; other panels are similar.

Visit https://your-domain/proxy/qaqdmin to configure the frontend, backend, and API

Shiro Configuration and Build

Refer to the official documentation: Backend theme configuration

Pull Shiroi

To be continued...

Misjudged root directory, there is a yarn.lock file under the /root directory

Problems Encountered

During local build, the following occurred:

Solution: Move the following in the src/app/[locale]/thinking/item.tsx file:

Move it to the top of the file (module scope), placing it after the import ... and before export const ThinkingItem ...

References

Thanks to the tutorials from the pros, I was able to deploy successfully very quickly. This article is almost entirely based on their commands and ideas, and is only for future troubleshooting use. The referenced articles are listed below:

• Mix-Space deployment of the latest frontend Shiro - Huashuiyun Cottage
• mx-space + Shiro: A new blog as pure as paper • Arthals' ink
• Use 1Panel to deploy Mix-Space and the frontend Shiro theme - Star’s Dwelling