banner
miaoer

miaoer

喵二の小博客 https://www.miaoer.net xLog 分站
tg_channel
telegram
bilibili

Super cute front-end and back-end separated blog Mix-space setup

The blog post version is only a supplementary explanation of the video version, for details please refer to the documentation!

The changes in mx are so significant that everyone can just use it for reference; too many things have changed.

Excerpt from the https://github.com/mx-space/docs documentation repository, with a slightly different order, optimized according to my video method.

Documentation address https://mx-space.js.org




Video Usage:

BGM:

  • Summer Madness-Roa

  • moonlight-Roa

  • Lights-Sappheiros

  • Embrace-Sappheiros



  • Introduction#

    A new way to replace personal space

    An open-source Mix-Space blog developed by a big shot innei during their undergraduate graduation project, adopting a front-end and back-end separation model.

    Mix-Space separates the front-end and back-end, meaning you can deploy them on different servers separately, or you can deploy them all on one server.

    The Core of Mix-Space provides back-end service support, Kami is the author's most frequently updated front-end, and Mx-Yun is a ported version of Cloud Traveler's Hexo-Yun; of course, Kami provides the most comprehensive support, enjoying all the features of Core, with good animations and various cute little Easter eggs!

    This time we are deploying the most complete Kami front-end.

    image

    image


    Preparation#

    You need to prepare a server to run Mix-space.

    • A brain that can think critically
    • Linux kernel version > 4.18 (recommended to use the latest version of Ubuntu)
    • Running memory > 1Gib
    • SSL certificates for both front-end and back-end
    • Properly resolved front-end and back-end addresses
    • Baota panel

    Optional:

    • Ubuntu with Docker images (or Tencent Cloud application image Docker)

    In the Baota panel - Software Store - Runtime Environment, install PM2 manager and Nginx, and install the latest Node version, which is v16.15.1 in this chapter.

    At least Node > 16.X


    Debian / Ubuntu install dependency environment

    sudo apt update && sudo apt install git curl vim wget git-lfs -y
    

    Install Dependency Environment#

    sudo su
    npm install -g pnpm pm2
    
    # If the installation is slow, you can use the following command to switch the mirror source
    npm config set registry http://mirrors.cloud.tencent.com/npm/
    

    Install Docker#

    sudo curl -fsSL https://get.docker.com | bash -s docker
    
    # If the installation is slow, it is recommended to use the following command
    sudo curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun
    

    Install Docker-compose#

    # Download docker-compose
    
    wget https://github.com/docker/compose/releases/download/v2.6.0/docker-compose-linux-x86_64
    
    #(Backup) wget https://download.fastgit.org/docker/compose/releases/download/v2.6.0/docker-compose-linux-x86_64
    
    # Create a new folder (not mandatory), may be needed
    
    sudo mkdir -p /usr/local/lib/docker/cli-plugins/
    
    # Copy to the specified location
    
    sudo cp ./docker-compose-linux-x86_64  /usr/local/lib/docker/cli-plugins/docker-compose
    
    # Grant execution permissions
    
    sudo chmod +x /usr/local/lib/docker/cli-plugins/docker-compose
    

    Check if the installation is complete

    docker compose version
    

    Normal output of the version number is sufficient.

    Deploy Core#

    cd
    
    mkdir -p mx-space/server
    
    cd mx-space/server
    
    wget https://fastly.jsdelivr.net/gh/mx-space/core@master/docker-compose.yml
    
    wget https://fastly.jsdelivr.net/gh/mx-space/core@master/.env.example -O .env
    

    Edit this .env file with Baota or vim, an example of the file is as follows

    # THIS ENV FILE EXAMPLE ONLY FOR DOCKER COMPOSE
    # SEE https://docs.docker.com/compose/environment-variables/#the-env-file
    JWT_SECRET=7294c34e0b28ad282333333          # Fill in a string with a length of no less than 16 characters and no more than 32 characters, for example: the md5 value of hash
    ALLOWED_ORIGINS=miaoer.xyz,www.miaoer.xyz,v6.www.miaoer.xyz  # Fill in the allowed domain names here, usually the domain name of kami, if multiple domain names are allowed to access, separate them with commas
    

    Vim save: Ecs to exit editing, Shift + :(colon) input wq
    Thus :wq

    Pull the Image#

    # Pull the latest image
    
    sudo docker compose pull
    
    # Start the container
    
    sudo docker compose up -d
    

    Reverse Proxy#

    Enter the Baota panel—Website, set the back-end website address to api.miaoer.xyz

    Fill in whatever hostname you like, remember to resolve it.

    Create a new site and go to Settings - Reverse Proxy - Add Reverse Proxy.

    Set the proxy name here for easy management as Back-end.

    Target URL: http://127.0.0.1:2333 Send domain: $host

    image

    After saving, click Configuration File and copy the configuration file text below into it, remember to select all and delete the previous configuration.

    #PROXY-START/
    location /socket.io {
        proxy_http_version 1.1;
        proxy_buffering off;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_pass http://127.0.0.1:2333/socket.io;
    }
    
    
    location /
    {
        proxy_pass http://127.0.0.1:2333/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
    
        add_header X-Cache $upstream_cache_status;
    
        #Set Nginx Cache
    
    
        set $static_fileJsNv8TWb 0;
        if ( $uri ~* "\.(gif|png|jpg|css|js|woff|woff2)$" )
        {
        	set $static_fileJsNv8TWb 1;
        	expires 12h;
            }
        if ( $static_fileJsNv8TWb = 0 )
        {
        add_header Cache-Control no-cache;
        }
    }
    
    #PROXY-END/
    

    Configure SSL Certificate#

    Here we use the free SSL certificate provided by Tencent Cloud, select Nginx when downloading the SSL certificate, open the compressed package, and copy the text of the .key and .pem key and certificate files to

    Site Settings - SSL - Other Certificates, the video has been blurred for privacy reasons.

    Remember to delete the empty line at the end of the .pem file.

    Save here, you can choose to enable forced HTTPS, it is recommended to enable it.

    Initialization#

    Access the back-end address https://server.test.cn/proxy/qaqdmin for initialization.

    Not demonstrated in the video; after the new version of mx is updated, you need to fill in the API address and Gateway address.

    For demonstration, I will fill in here;

    API Address: https://api.miaoer.xyz/api/v2

    Gateway Address: https://api.miaoer.xyz

    Enable persistence.

    Site Settings set the site title and site description.

    Keywords are optional.

    The front-end address needs to be manually changed to your desired address, I set it to https://www.miaoer.xyz.

    The API address is correct by default, such as: https://api.miaoer.xyz/api/v2.

    The back-end address is also correct, it is not recommended to change it here.

    The gateway is also correct by default.

    image


    When it comes to Owner Information, it is recommended to fill everything out.

    Please note that the email refers to the address for receiving friend link and comment notifications, and later set up email reminders in the back-end panel.

    The password here is the password for the back-end panel, confirm the password.

    Set your personal homepage to your front-end address, I set it to https://www.miaoer.xyz.

    Set your avatar address here; you can upload your avatar later through the back-end, it is recommended to set up your own CDN image bed, or use an existing one, I chose to build my own.

    Fill in your personal introduction according to your preference.

    Deploy Front-end#

    cd
    cd mx-space
    
    git clone https://github.com/mx-space/kami.git --depth=1
    
    # In case of poor network, please use the command below.
    
    git clone https://hub.fastgit.xyz/mx-space/kami.git --depth=1
    

    Switch to the stable version branch.

    cd kami && git fetch --tags && git checkout $(git rev-list --tags --max-count=1)
    

    Modify env.

    Edit this .env file with Baota or vim, an example of the file is as follows.

    # API Address
    NEXT_PUBLIC_API_URL=https://api.miaoer.xyz/api/v2
    # GATEWAY Address
    NEXT_PUBLIC_GATEWAY_URL=https://api.miaoer.xyz
    # Configuration item name used by the front-end
    NEXT_PUBLIC_SNIPPET_NAME=kami
    # If using CDN, modify the product prefix
    ASSETPREFIX=
    

    Vim save: Ecs to exit editing, Shift + :(colon) input wq
    Thus :wq

    Install dependencies.

    pnpm i
    

    Build.

    pnpm build
    

    Start the front-end.

    pm2 start
    

    Add a site.


    Enter the Baota panel—Website, set the front-end website address to www.miaoer.xyz.

    Fill in whatever hostname you like, remember to resolve it.

    Create a new site and go to Settings - Reverse Proxy - Add Reverse Proxy.

    Set the proxy name here for easy management as Front-end.

    Target URL: http://127.0.0.1:2323 Send domain: $host.

    image

    After saving, click Configuration File and copy the configuration file text below into it, remember to select all and delete the previous configuration.

    In Kami version v3.15.1 and above, the configuration is different from the previous video, please use the reverse proxy configuration below.

    #PROXY-START/
    
    location ~* \/(feed|sitemap|atom.xml)
    {
        proxy_pass http://127.0.0.1:2333/$1;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
        
        add_header X-Cache $upstream_cache_status;
         
        add_header Cache-Control max-age=60;
    } 
    
    location /
    {
        proxy_pass http://127.0.0.1:2323;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
    
        add_header X-Cache $upstream_cache_status;
    
        #Set Nginx Cache
    
    
        set $static_fileSw1Jy3nG 0;
        if ( $uri ~* "\.(gif|png|jpg|css|js|woff|woff2)$" )
        {
        	set $static_fileSw1Jy3nG 1;
        	expires 12h;
        }
        if ( $static_fileSw1Jy3nG = 0 )
        {
        add_header Cache-Control no-cache;
        }
    }
    #PROXY-END/
    

    Configure SSL Certificate

    Very similar to the front-end and back-end, I hope you can think critically.

    Cloud Functions and Testing#

    The meaning of this video segment is that deployment stops here, and the rest can be improved according to the documentation for Mix-space!

    Therefore, this is only a partial reference demonstration; for specifics, please refer to Getting Started Guide | Mix Space

    Enter the back-end, move to Other · Configuration and Cloud Functions.

    Create a new item:

    • Name: kami
    • Reference: theme
    • Data Type: YAML / JSON
    • Public: Yes

    Refer to the following content, copy it into the right box, and modify it according to your situation. Below is an example in YAML format, which can be modified according to the example.

    There are a lot of jsd links inside, please handle them yourself.

    Configuration Example#

    name: kami
    
    site:
      favicon: https://fastly.jsdelivr.net/gh/mx-space/kami@master/public/favicon.svg
      # Splash screen and logo svg tag, beware of XSS
      logo_svg: <svg height="200px" viewbox="0 0 200 200" version="1.1" shape-rendering="geometricPrecision"><g stroke="none" strokewidth="1" fill="none" fillrule="evenodd"><g id="forest" fill="currentColor" fillrule="nonzero"><path d="M116.799219,176.953125 C112.484375,176.953125 108.986719,180.450781 108.986719,184.765625 L108.986719,192.1875 C108.986719,196.502344 112.484375,200 116.799219,200 C121.114062,200 124.611719,196.502344 124.611719,192.1875 L124.611719,184.765625 C124.611719,180.450781 121.114063,176.953125 116.799219,176.953125 Z" id="Path"></path><path d="M121.456641,150.248047 C121.298828,150.158203 108.089453,142.472656 101.778125,128.767188 C106.058594,127.733594 109.462109,126.055078 112.442578,124.584766 C115.008203,123.319531 116.671094,120.749609 116.787109,117.891406 C116.903125,115.033203 115.441797,112.336328 112.986719,110.867578 C108.091406,107.937891 96.6117187,99.3179688 91.234375,88.9808594 C94.3324219,88.1222656 97.3414062,86.940625 100.255469,85.734375 C102.819922,84.6730469 104.628906,82.3304688 105.007422,79.5808594 C105.385938,76.83125 104.276953,74.0875 102.094531,72.3722656 C82.3632812,56.8691406 70.0417969,20.1820313 69.9210937,19.8171875 C68.8640625,16.6136719 65.8710938,14.4558594 62.5019531,14.4558594 C62.4839844,14.4558594 62.465625,14.4558594 62.4472656,14.4558594 C59.05625,14.4792969 56.0664063,16.690625 55.0484375,19.925 C54.934375,20.2878906 43.3839844,56.3890625 22.3355469,71.8246094 C20.075,73.4824219 18.8757813,76.2242188 19.1933594,79.0097656 C19.5109375,81.7949219 21.2964844,84.196875 23.8722656,85.303125 C26.1265625,86.2714844 29.5851563,87.7554688 34.3464844,89.0640625 C29.0214844,98.8472656 17.2527344,107.819922 12.2683594,110.952734 C9.7640625,112.517969 8.35625,115.360938 8.63007813,118.301563 C8.90390625,121.242188 10.8117188,123.776953 13.5617188,124.852734 C13.9058594,124.9875 14.2785156,125.1375 14.6828125,125.3 C16.8089844,126.154297 19.7445313,127.332031 23.6902344,128.501953 C17.2066406,141.350391 3.68632813,150.395703 3.53671875,150.494141 C1.09140625,152.094922 -0.25625,154.926563 0.044140625,157.833594 C0.34453125,160.740625 2.2421875,163.237109 4.96328125,164.303906 C5.76640625,164.61875 23.6132813,171.474609 55.471875,172.521875 L55.471875,192.1875 C55.471875,196.502344 58.9695313,200 63.284375,200 C67.5992187,200 71.096875,196.502344 71.096875,192.1875 L71.096875,172.544531 C103.353125,171.572656 119.956641,164.517578 120.696484,164.196094 C123.407422,163.016797 125.221094,160.408984 125.382422,157.457031 C125.542578,154.504688 124.023438,151.714844 121.456641,150.248047 Z M63.6742188,157.03125 C46.6414063,157.03125 33.3425781,155.194922 24.325,153.367578 C29.7734375,147.926953 35.75625,140.533203 39.3648438,131.730859 C44.5152344,132.389453 50.4929688,132.8125 57.4242188,132.8125 C61.7390625,132.8125 65.2367188,129.314844 65.2367188,125 C65.2367188,120.685156 61.7390625,117.1875 57.4242188,117.1875 C46.7472656,117.1875 38.8265625,116.116406 32.8878906,114.769531 C33.4640625,114.256641 34.0460937,113.726953 34.63125,113.180859 C42.2988281,106.020703 47.5574219,98.8085938 50.3394531,91.6605469 C51.3,91.7195313 52.2839844,91.7652344 53.2945313,91.7941406 C57.6179688,91.9210938 61.2035156,88.5207031 61.3269531,84.2082031 C61.45,79.8949219 58.0535156,76.2988281 53.740625,76.1757813 C49.2144531,76.0464844 45.3546875,75.5386719 42.0863281,74.8628906 C51.1160156,64.9648438 57.9273437,52.8929688 62.5585937,43.0527344 C67.1378906,52.8117188 73.746875,64.7949219 82.1886719,74.6710938 C81.9644531,74.6675781 81.74375,74.6566406 81.5277344,74.6382813 C79.1414062,74.4355469 76.7910156,75.3363281 75.1546875,77.0871094 C73.5183594,78.8375 72.7753906,81.2421875 73.1398437,83.6105469 C75.0921875,96.3007813 83.7679687,106.876563 91.5785156,114.065234 C89.2605469,114.0125 87.06875,114.98125 85.5433594,116.714844 C83.9519531,118.523438 83.2839844,120.964844 83.7328125,123.33125 C86.2589844,136.650391 93.8433594,146.823047 100.754297,153.641797 C92.2726562,155.367188 79.8890625,157.03125 63.6742188,157.03125 Z" id="Shape"></path><path d="M199.920703,162.187891 C199.623438,160.078516 198.473047,158.178125 196.74375,156.933203 C196.677734,156.885547 190.046094,152.078516 183.367188,144.459375 C178.680469,139.112891 175.16875,133.808203 172.869141,128.615234 C177.176953,127.299219 180.334766,125.896484 182.855078,124.776563 C183.779688,124.365625 184.578125,124.011328 185.239063,123.752344 C187.985938,122.677344 189.889453,120.144141 190.166016,117.207422 C190.442578,114.270703 189.037891,111.426172 186.539844,109.857031 C180.508203,106.06875 165.928516,94.9003906 160.170313,82.8882813 C165.975,81.6109375 170.135938,80.0996094 173.450781,78.6757813 C176.026953,77.5691406 177.8125,75.1675781 178.130078,72.3824219 C178.447656,69.596875 177.248438,66.8550781 174.987891,65.1972656 C150.69375,47.3816406 137.426172,5.89023438 137.296484,5.47773438 C136.282422,2.23945312 133.294141,0.02578125 129.900781,0 C129.880469,0 129.860938,0 129.840625,0 C126.471875,0 123.479297,2.1609375 122.422266,5.36484375 C122.345703,5.59726563 114.594141,28.8386719 101.137891,48.2902344 C98.6832031,51.8386719 99.5699219,56.7050781 103.118359,59.1597656 C106.666016,61.6144531 111.532813,60.7277344 113.987891,57.1796875 C120.606641,47.6113281 125.908984,37.3730469 129.771094,28.9074219 C135.158203,40.7210938 143.499219,55.9507812 154.835547,68.0292969 C148.182031,69.3046875 138.466406,70.365625 124.221094,70.365625 C119.90625,70.365625 116.408594,73.8632812 116.408594,78.178125 C116.408594,82.4929687 119.90625,85.990625 124.221094,85.990625 C131.989844,85.990625 138.586719,85.7003906 144.237891,85.2101562 C147.194141,93.6328125 153.265625,102.16875 162.363672,110.664453 C163.722266,111.933203 165.067578,113.123437 166.365234,114.225781 C160.423047,115.830469 152.078516,117.127344 139.455469,117.127344 C135.140625,117.127344 131.642969,120.625 131.642969,124.939844 C131.642969,129.254687 135.140625,132.752344 139.455469,132.752344 C146.397656,132.752344 152.275391,132.379297 157.298828,131.778516 C160.196094,139.490625 164.986719,147.194531 171.617578,154.758984 C173.749219,157.191406 175.869141,159.373437 177.836328,161.269531 C171.480469,162.880469 160.966797,164.453125 144.142969,164.453125 C139.828125,164.453125 136.330469,167.950781 136.330469,172.265625 L136.330469,192.1875 C136.330469,196.502344 139.828125,200 144.142969,200 C148.457813,200 151.955469,196.502344 151.955469,192.1875 L151.955469,179.966016 C166.112109,179.546484 177.524219,177.948828 185.952344,175.201562 C193.906641,172.608203 197.119922,169.648438 198.327734,168.114453 C199.645703,166.441016 200.217969,164.297266 199.920703,162.187891 Z" id="Path"></path></g></g></svg>
      # Random Images
      figure:
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/qsNmnC2zHB5FW41.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/GwJzq4SYtClRcZh.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/6nOYcygRGXvpsFd.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/Qr2ykmsEFpJn4BC.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/KiOuTlCzge7JHh3.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/sM2XCJTW8BdUe5i.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/18KQYP9fNGbrzJu.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/rdjZo6Sg2JReyiA.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/X2MVRDe1tyJil3O.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/EDoKvz5p7BXZ46U.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/EGk4qUvcXDygV2z.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/5QdwFC82gT3XPSZ.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/KPyTCARHBzpxJ46.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/7TOEIPwGrZB1qFb.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/Ihj5QAZgVMqr9fJ.jpg
        - https://fastly.jsdelivr.net/gh/Innei/fancy@master/2021/KZ6jv8C92Vpwcih.jpg
      # Background Image
      background:
        src:
          # Light background
          light: https://fastly.jsdelivr.net/gh/mx-space/docs-images@master/assets/background.png
          # Dark background
          dark: https://fastly.jsdelivr.net/gh/mx-space/docs-images@master/assets/background-night.png
        position: top center fixed
      # Define the website top bar
      header:
        menu:
          - title: Source
            path: /
            type: Home
            icon: faDotCircle
            subMenu: []
          - title: Literature
            path: /posts
            type: Post
            subMenu: []
            icon: faGlasses
          - title: Notes
            type: Note
            path: /notes
            icon: faFeatherAlt
          - title: Sayings
            path: /says
            icon: faComments
          - title: Timeline
            icon: faHistory
            path: /timeline
            subMenu:
              - title: Life
                icon: faFeatherAlt
                path: /timeline?type=note
              - title: Blog
                icon: faBookOpen
                path: /timeline?type=post
              - title: Memories
                icon: faCircle
                path: /timeline?memory=1
          - title: Friends
            icon: faUserFriends
            path: /friends
          - title: Recent
            icon: faComment
            path: /recently
          - title: Favorites
            icon: faCircleNotch
            path: /favorite/music
            subMenu:
              - title: Listen to Music
                icon: faMusic
                type: Music
                path: /favorite/music
          - title: ""
            icon: faSubway
            path: "https://travellings.link"
      # Define social IDs under the avatar
      social:
        - url: "https://github.com/Innei"
          title: GitHub
          icon: faGithub
          color: var(--black)
        - url: "https://jq.qq.com/?_wv=1027&k=5t9N0mw"
          title: QQ
          icon: faQq
          color: "#12b7f5"
        - url: "https://twitter.com/__oQuery"
          title: Twitter
          icon: faTwitter
          color: "#02A4ED"
      # Define the website footer
      footer:
        background:
          src:
            dark: |-
            light: https://fastly.jsdelivr.net/gh/mx-space/docs-images@master/assets/footer.png
          position: top/cover
        # Default return address
        home_page: https://innei.ren
        # Footer motto
        motto:
          content: Stay hungry. Stay foolish.
          author: Steve Jobs
        # ICP filing
        icp:
          enable: false
          label: "浙ICP备 20028356 号"
          link: http://beian.miit.gov.cn/
        # Custom footer text and links
        navigation:
          - name: About
            path: "/about"
          - name: Message
            path: "/message"
          - name: Friend Links
            path: "/friends"
          - name: RSS Subscription
            path: "/feed"
            newtab: true
          - name: Sitemap
            path: "/sitemap"
            newtab: true
          - name: Go to
            path: https://travellings.link/
            newtab: true
      # Custom scripts, styles, and JS (supports external link introduction, no need for script tags)
      custom:
        # Custom scripts
        script: |-
          console.log('Hello')
        # Custom styles
        style: |-
          .foo {
            color: red
          }
        # Introduce external JS, no need for script tags
        js:
          - https://fastly.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js
        # Introduce external CSS 
        css:
          - https://fastly.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css
    # Define functions, such as playlists, tracking
    function:
      player:
        # Default playlist
        # Only supports NetEase Cloud
        id:
          - 563534789
          - 1447327083
          - 1450252250
      # Analysis, Google OR Baidu OR umami
      analyze:
        enable: false
        ga: ""
        baidu: ""
        umami: ""
      # Donations
      donate:
        enable: false
        link: https://afdian.net/@Innei
      # Whether to disable developer tools (visitors)
      ban_devtool:
        enable: false
    

    Test Front-end#


    After configuring the front-end cloud function configuration, you can now access it by entering https://www.miaoer.xyz.

    I have rolled back to the normal back-end, so I have articles here; by default, there are no articles. If there are no issues, you can try writing and publishing an article in the back-end for testing.

    image


    Settings#

    In the back-end panel under Settings - System, there are:

    • Website Settings
    • SEO Optimization
    • Additional Back-end Settings
    • Text Settings
    • Email Notification Settings
    • Comment Settings
    • Bark Notification Settings
    • Friend Link Settings
    • Backup
    • Baidu Push Settings
    • Algolia Search
    • Terminal Settings

    I won't explain each one here.

    Please refer to the content in the Getting Started Guide | Mix Space documentation.

    Also, regarding configuration and cloud functions, due to space constraints, I will not explain here; you can check the documentation for this part Cloud Functions.

    Upgrading and Backing Up#

    1. Custom Upgrade - Front-end#

    Rename the mx-space/kami folder to any name, here I change it to kami.d.

    Then pull the kami front-end repository and update to the stable version.

    cd
    cd mx-space
    
    git clone https://github.com/mx-space/kami.git --depth=1
    
    cd kami && git fetch --tags && git checkout $(git rev-list --tags --max-count=1)
    

    Then copy the files that were modified during the configuration before the update, such as in mx-space/kami.d

    the .env and public folders to mx-space/kami.

    Assuming that the friend link page source code has been updated, replace the updated files one by one.

    If the friend link page source code has updates, replacing the files from before the update may lead to build errors.

    After replacing, install dependencies, build, and start the front-end.

    pnpm i
    
    pnpm build
    
    pm2 start
    
    # For safety: pnpm i && pnpm build && pm2 start
    

    2. Forced Sync - Front-end#

    Directly execute git pull origin master in the mx-space/kami folder.

    Install dependencies, build, and start the front-end.

    pnpm i
    
    pnpm build
    
    pm2 start
    
    # For experienced users: pnpm i && pnpm build && pm2 start
    

    This method is suitable for lazy users who have not made changes to the Kami source code.

    Back-end Upgrade#

    Since the Mix-space back-end uses Docker-compose, upgrading is very convenient.

    cd
    cd mx-space/server
    

    Enter the server folder and execute

    docker compose pull && docker compose up -d
    

    Backup and Rollback#

    Backup#

    In the back-end under Other - Backup, click Immediate Backup, which backs up to the absolute directory:

    /root/mx-space/server/data/mx-space/backup/20xx-xx-xx_xx:xx:xx/backup-20xx-xx-xx_xx:xx:xx.zip

    If you haven't modified anything, refer to the back-end panel under Settings - System - Backup.

    Rollback#

    In the back-end under Other - Backup, click Immediate Backup, upload the previously downloaded backup.zip to the newly generated backup directory and rename it to replace.

    tip
    For example, if the recently generated backup is backup-2022-09-01_23:33:33.zip, rename the backup package you want to roll back, backup-2022-01-14_05:14:19.zip, to the same name as the recently generated backup.

    mv /root/mx-space/server/data/mx-space/backup/2022-01-14_05:14:19/backup-2022-01-14_05:14:19.zip backup-2022-09-01_23:33:33.zip
    

    ⚠️ This operation involves modifying the database, please back up several working days' worth of backups, data is invaluable, please operate with caution!

    Generally, rolling back will only result in the loss of IP & PV data on the analyze data page.

    After the replacement is complete, a prompt will indicate that the database has changed, and the page will reload in x seconds.

    Reload to check if articles, comments, etc., have been lost.


    To synchronize with the video version, the blog can only be updated to this point; for details, refer to Docs.

    Feel free to leave comments, tips, and support for the video; be sure to like and comment, this blog is still being updated!

    This article is synchronized and updated to xLog by Mix Space. The original link is https://www.miaoer.net/posts/blog/mx-install

    Loading...
    Ownership of this post data is guaranteed by blockchain and smart contracts to the creator alone.