【DevOps】Git 命令实战：一个简单的 Web 开发项目示例

Git 命令实战：一个简单的 Web 开发项目示例

1.项目初始化
2.开发流程
- [2.1 第一次提交](#2.1 第一次提交)
- [2.2 创建新功能分支](#2.2 创建新功能分支)
- [2.3 处理紧急修复](#2.3 处理紧急修复)
- [2.4 继续开发功能](#2.4 继续开发功能)
- [2.5 合并功能到主分支](#2.5 合并功能到主分支)
3.远程仓库操作
4.其他常用操作

让我们通过一个具体的 Web 开发项目来讲解 Git 的常用命令。假设我们要开发一个简单的个人博客网站。

1.项目初始化

创建项目并初始化 Git 仓库

bash 复制代码

mkdir my-blog
cd my-blog
git init

创建基础文件

bash 复制代码

touch index.html style.css README.md

2.开发流程

2.1 第一次提交

检查状态

bash 复制代码

git status

添加文件到暂存区

bash 复制代码

git add index.html style.css README.md
# 或者使用
git add .

提交更改

bash 复制代码

git commit -m "Initial commit: created basic project structure"

2.2 创建新功能分支

创建并切换到新分支

bash 复制代码

git checkout -b feature/homepage

在index.html中添加内容

html 复制代码

<!-- 编辑index.html -->
<!DOCTYPE html>
<html>
<head>
    <title>My Blog</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        <h1>Welcome to My Blog</h1>
    </header>
</body>
</html>

提交更改

bash 复制代码

git add index.html
git commit -m "Add basic homepage structure"

2.3 处理紧急修复

切换回主分支

bash 复制代码

git checkout main

创建修复分支

bash 复制代码

git checkout -b hotfix/readme-typo

修复 README.md 中的错误

bash 复制代码

# 编辑 README.md 文件
git add README.md
git commit -m "Fix typo in README"

合并修复到主分支

bash 复制代码

git checkout main
git merge hotfix/readme-typo

删除临时分支

bash 复制代码

git branch -d hotfix/readme-typo

2.4 继续开发功能

回到功能分支

bash 复制代码

git checkout feature/homepage

添加更多内容到CSS

css 复制代码

/* 编辑style.css */
body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

header {
    background: #333;
    color: #fff;
    padding: 1rem;
    text-align: center;
}

提交CSS更改

bash 复制代码

git add style.css
git commit -m "Add basic styling for homepage"

2.5 合并功能到主分支

切换回主分支

bash 复制代码

git checkout main

合并功能分支

bash 复制代码

git merge feature/homepage

解决可能的冲突

(如果有冲突，Git 会提示你解决)

删除功能分支

bash 复制代码

git branch -d feature/homepage

3.远程仓库操作

添加远程仓库

bash 复制代码

git remote add origin https://github.com/yourusername/my-blog.git

推送更改到远程

bash 复制代码

git push -u origin main

从远程拉取更新

bash 复制代码

git pull origin main

4.其他常用操作

查看提交历史

bash 复制代码

git log --oneline --graph

撤销工作区更改

bash 复制代码

git checkout -- style.css  # 丢弃style.css的未暂存更改

修改最后一次提交

bash 复制代码

git commit --amend -m "New commit message"

暂存当前工作

bash 复制代码

git stash  # 临时保存未提交的更改
git stash pop  # 恢复暂存的更改

这个示例展示了 Git 在 Web 开发项目中的典型工作流程，包括分支管理、提交、合并和远程操作等核心功能。