LiveTerm 可以用來在幾分鐘時間內(nèi)構(gòu)建一個終端風(fēng)格的網(wǎng)站，由 Next.js 開發(fā)的高度可定制、易于使用和最小的終端樣式網(wǎng)站模板。

使用 LiveTerm 構(gòu)建一個簡單的網(wǎng)站只需幾分鐘，而且你只需要使用一個 config.json 文件即可。克隆項目代碼倉庫后，只需運(yùn)行 yarn install && yarn dev 并開始編輯 config.json 即可構(gòu)建你的網(wǎng)站了!LiveTerm 可以被用來構(gòu)建各種類型的網(wǎng)站：個人網(wǎng)站、啟動頁、項目頁等等，如下所示：

構(gòu)建網(wǎng)站

LiveTerm 需要使用 yarn 包管理器，所以需要提前安裝，然后直接在終端中執(zhí)行下面的命令：

sh -c "$(curl -fsSL https://raw.github.com/Cveinnt/LiveTerm/main/install/install.sh)"

這會將 LiveTerm 安裝到當(dāng)前目錄，然后就可以通過以下方式開始構(gòu)建你的網(wǎng)站：

cd LiveTerm && yarn dev

然后開始編輯 config.json 文件并保存查看更改結(jié)果!此外也可以將此存儲庫克隆到你選擇的位置：

git clone https://github.com/Cveinnt/LiveTerm.git && cd LiveTerm

然后安裝依賴并開始構(gòu)建：

yarn install && yarn dev

就是這么簡單!

如果你習(xí)慣使用 Docker 的話，那么同樣可以使用 Docker 來進(jìn)行構(gòu)建網(wǎng)站，同樣克隆項目代碼然后根據(jù)自己的需求編輯 config.json 文件，然后執(zhí)行下面的命令啟動容器即可：

docker-compose up -d

配置

基本配置

LiveTerm 90% 的配置都是通過 config.json 文件完成的，該文件的內(nèi)容如下所示：

{
  "readmeUrl": // create a Github README and link it here!
  "title": // title of the website
  "name": // your name, included in 'about' command
  "ascii": // ascii art to display
  "social": {
    "github": // your handle
    "linkedin": // your handle
  },
  "email": // your email
  "ps1_hostname": "liveterm" // hostname in prompt
  "ps1_username": "visitor", // username in prompt
  "resume_url": "../resume.pdf", // path to your resume
  "non_terminal_url": "W",
  "colors": {
    "light": {
      ...
    },
    "dark": {
      ... // you can use existing templates in themes.json or use your own!
    }
  }
}

可以按照自己的想法隨意修改該文件即可。

主題

你可以在 themes.json 文件中找到幾個預(yù)先配置好的主題，可以將 config.json 中的顏色替換為你喜歡的主題顏色!主題基于網(wǎng)站 https://glitchbone.github.io/vscode-base16-term/#/ 上配置的。

我們可以查看 demo 目錄中的圖片來預(yù)覽這些主題。

Favicons

網(wǎng)站圖標(biāo)與要上傳到網(wǎng)站的其他文件一起位于 public/ 中，推薦大家使用 https://www.favicon-generator.org/ 這個網(wǎng)站來生成網(wǎng)站圖標(biāo)。

Banner

你可能還想更改 Banner，只需將生成的 Banner 粘貼到 src/utils/bin/commands.ts 中即可，推薦使用 https://manytools.org/hacker-tools/ascii-banner/ 這個網(wǎng)站來生成Banner。

部署到 Vercel

部署 Next.js 應(yīng)用程序的最簡單方法是使用 Next.js 創(chuàng)建者提供的 Vercel(https://vercel.com/) 平臺。你可以將你的 github 帳戶連接到 vercel，并讓 vercel 自動為你部署 github 代碼倉庫。

Git 倉庫：https://github.com/Cveinnt/LiveTerm。