使用GithubPages开发学术主页
一. GithubPages简介
GithubPages是Github提供的一项服务，可以让用户免费创建一个静态网站。
用户可以通过GithubPages展示自己的项目、博客、学术主页等。本文将介绍如何使用GithubPages开发学术主页。
二. 开发过程
1. 创建Github仓库
首先，我们需要在Github上创建一个仓库，用于存放学术主页的代码。
登录Github，点击右上角的“+”按钮，选择“New repository”，填写仓库名称，选择公开。
简单写一下Readme.md文件，选择一个License，然后点击“Create repository”。
2. clone到本地
接着，我们需要将仓库克隆到本地。
在仓库页面，点击“Code”按钮，复制仓库地址。
打开终端，执行以下命令：
git clone 仓库地址
3. 基于Bootstrap开发项目主页
Bootstrap是一个流行的前端框架，可以帮助我们快速开发网页。
Bootstrap提供了丰富的组件和样式，可以让我们的网页看起来更加美观。
在本地仓库中创建一个文件夹docs，,然后创建一个index.html文件，之后我们将在这个文件中编写学术主页的代码（可以参考一下现有模板）。
此处使用的模板为 Brain-ControlledHandExoskeleton。
4. 构建Action
在项目中创建一个.github/workflows文件夹，然后创建一个static.yml文件，用于自动部署网站。
在static.yml文件中添加以下内容：
# Simple workflow for deploying static content to GitHub Pages
name: Deploy static content to Pages
on:
# Runs on pushes targeting the default branch
push:
branches: ["main"]
# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
contents: read
pages: write
id-token: write
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
group: "pages"
cancel-in-progress: false
jobs:
# Single deploy job since we're just deploying
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4
- name: Setup Pages
uses: actions/configure-pages@v5
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
# Upload entire repository
path: './docs'
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
5. 上传云端github
将本地仓库的代码推送到Github仓库：
git add .
git commit -m "Initial commit"
git push --force
之后，我们可以在Github仓库的Actions页面查看部署进度，等待部署完成后，我们就可以访问学术主页了。
6. 添加个人域名（可选）
如果你有个人域名，可以将域名解析到GithubPages的网址，这样就可以通过个人域名访问学术主页。
在Github仓库的Settings页面，找到“Pages”选项，输入你的域名，然后保存即可。
添加域名解析，此处以腾讯云域名为例：
- 登录腾讯云，进入域名解析页面。
- 点击“添加记录”，选择“CNAME”，填写主机记录和记录值。
- 主机记录填写你的域名，记录值填写GithubPages的网址（如
username.github.io）。
三. 相关工具
1. Bootstrap可视化设计
如果开发复杂的界面，可以使用Bootstrap可视化设计工具，帮助我们快速设计页面。
有很多在线工具可以帮助我们设计Bootstrap页面，比如：
https://www.bootcss.com/p/layoutit/
TOP3款最好用的 Bootstrap 可视化开发工具，我想要的BT知识点都整理好了_bootstrap开发工具-CSDN博客
2. VSCode 代码格式化快捷键
在VSCode中，可以使用快捷键Shift+Alt+F对代码进行格式化，使代码更加整洁。
3. Docsify
Docsify是一个轻量级的文档生成工具，可以帮助我们快速生成文档网站。
