電子內容管理
使用Git 與 Github
By Alan Tsai 2017-07-04
人人都要會的技能,如何對電子內容做好版管理
可不是只有程式設計師才需要GIT
關於我
2
▰Alan Tsai 蔡孟玹
▰後端(攻城獅)工程師
▻Web Developer - 主要使用 .Net/C# 和 Asp .Net Mvc
▰看小說
▰找到我 – contact@alantsai.net
▻http://blog.alantsai.net - Alan Tsai 的學習筆記
▻{服務}.alantsai.net
▻http://fb.alantsai.net - fb
▻http://ln.alantsai.net – linkedin
▻http://ss.alantsai.net - slideshare
為什麼要有版控 – 文件撰寫
3
需求
撰寫
檢閱修正
完成
▰問題點
▻撰寫和那個需求有關?
▻送出檢閱是那個版本?
▻修正過後和檢閱版本差異在哪裡?
▻階段性完成和下個需求差距有多
少?
▻協同合作 – 誰修改了什麼?
為什麼要有版控
4
▰問題點
▻請問那個版本是最新的?
▻請問送出的版本是哪一個?
▻假設送出之後又有來調整,那個
是修改過的?
▻每一個修改之間的原因是什麼?
▻是誰修改的?
為什麼要有版控
5
Agenda
6
▰版控基本介紹
▰環境準備
▰開始使用
▻版本記錄
▻查看歷史
▻打標籤
介紹篇
7
沒有版控 – 無法協同工作
8
第一代 – 一個人的時代
9
▰沒版控最大問題是,同時修改怎麼辦?
▰使用Lock技術
▻同時只能一個人來
▰軟體都是由少數個人寫出來的
▰不能協同工作?
▰大型軟體怎麼辦? 來源:Pro Git P28 Figure1-1
第二代 – CVCS(Centralized) 集中式版控
10
▰有個中央Server記錄版本
▻可以多人使用
▰第一代問題是容易雙方互等
▻在commit(提交)的時候針對有重複的去做修正
▰典型程式有
▻Subversion (SVN),
Team Foundation Server (TFS),
CVS, SourceSafe,
來源:Pro Git P29 Figure1-2
第三代 – D(Distributed)VCS – 分散式版控系統
11
▰不再只有一個中央系統
▻任何人裡面有記錄就是一個Repository
▻隨時可以commit
▻merge before commit
來源:Pro Git P30
Figure1-3
黑暗時代 – 沒有版控的世界
12
▰遊戲世界來說就像
黑暗時代 – 沒有版控的世界
13
▰遊戲世界來說就像
第二代 – 問題
14
▻沒網路要開發怎麼辦?
▻不同團隊如何並行開發?
▻Server掛掉怎麼辦?
第三代
15
▰模擬器
▰遊戲外面可以存檔
為什麼選git
16
▰隨時存檔 – 不用擔心影響別人
▰速度快
▻建立分支變態的快
▰不需要任何其他裝備就可以開始使用
▰可以接其他的版控
▻git svn - 開始使用git - 用git操作svn repo
▻Git tfs
為什麼選git
17
https://insights.stackoverflow.com/survey/2017#technology
為什麼選git
18
▰微軟的Windows Code轉git
▰世界上最大的repo
▻300GB
▰2周後的survey
https://blogs.msdn.microsoft.com/bharry/2017/05/24/th
e-largest-git-repo-on-the-planet/
Git 適合什麼類型的檔案
19
▰任何類型的專案
▰純文字類型的檔案較好
▻比對比較容易
▻Word就比較不適合
▻Markdown的崛起
▰預設不適合(但是有額外套件幫忙處理)
▻大型檔案、Binary(exe)、圖片
版控 VS Google doc
20
▰版控 vs 一般文件
版控 Google Doc 評價
歷史記錄 永久 有時間限制 版控
隨時回復版本 永久 有時間限制 版控
任意版本比對修改 可以 不可以 版控
記錄修改的目的和版號 可以 不可以 版控
及時協同作業 非及時 及時 Google Doc
Gitbook – 打造電子書
21
▰https://www.gitbook.com/
▰Markdown撰寫
▰柯文哲【柯P新政】市政白皮書
▻https://www.gitbook.com/book/doctorkowj/kppolicy/details
gist – 打造自己的snippet管理器
22
▰Github 的服務
▻https://gist.github.com/
▰例如 用powershell排序資料夾
▻排序的片段程式碼
▰Gistbox
準備篇
23
準備篇
24
▰ 需要了解
▻ 安裝git
▻ CLI – 指令(命令提示窗)
▻ Gui
▻ 設定Git
▻ 必須的設定
▻ 常見設定
準備篇
安裝Git
25
安裝git
26
▰Git 本身是CLI工具
▰安裝內容
▻CLI工具 – 必要
▻Posh-git – 讓Powershell作為CLI界面 – 非必要
▻GUI界面 – 非必要
Git的功能(相對值)
27
▰CLI
▻100%功能
▰GUI
▻60%~80%
▰IDE類型整合
▻Visual Studio Code
▻Eclipse
▻40%~60%
使用組合
28
▰ CLI (powershell) + TortoiseGit
▻ CLI做一般操作
▻ TortoiseGit 做 歷史查詢(log),檔案比對(diff)和處理
conflict
▰ Source Tree + TortoiseGit
▻ Source Tree有點ide的感覺
▻ TortoiseGit在歷史查詢比較清楚
安裝git – CLI工具
29
▰Git for Windows
▰包含git.exe、git bash、 git gui 、git lfs、git flow和Windows Credential Manager
▻https://git-scm.com/download/win
▻chocolate
#沒安裝過choclate 用 admin開啟 cmd 然後執行
@powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((New-Object
System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))"
&& SET "PATH=%PATH%;%ALLUSERSPROFILE%chocolateybin"
choco install git.install -params ‘“/NoShellIntegration”'
Git for Windows 安裝1
30
▰Windows Explorer Integration
▻建議不要勾,因為其他Gui工具就有提供
Git for Windows 安裝2
31
▰Use Git from Git Bash only
▻只有Git Bash能夠跑Git
▰Use Git from the Windows Command prompt(建議)
▻在Path上面加git – cmd就可以執行git
▰Use Git and optional Unix tools from Windows Command
Prompt
▻在Path加上git 和 安裝一些Unix工具
Git for Windows 安裝3
32
▰Windows 斷行吃 CRLF 而Unix吃 LF
▻Windows建議選第一個
▻Unix建議選第二個
▰這邊是設定版控儲存的斷行方式
▰這個可以安裝完成之後透過 git config設定
git config --system core.autocrlf “true” #第一個選項
git config --system core.autocrlf ”input” #第二個選項
git config --system core.autocrlf ”false” #第三個選項
powershell作為替代工具(非必要)
33
▰我是powershell和gui交叉使用
▻Gui用來看log和做diff(比對)和merge(合併)
▻Powershell 用來做其他操作
▰Posh-git (https://github.com/dahlbyk/posh-git )
▻對git的一些指令有tab completion
▻Prompt提供詳細資訊
posh-git安裝方式 1(非必要)
34
▰Chocolate
▰或
▰Powershell Gallery
▻預設Windows 10 有安裝 – 其他需要到Powershell Gallery做下載
choco install poshgit
Set-ExecutionPolicy RemoteSigned
Install-Module posh-git -Scope CurrentUser
posh-git安裝方式 2(非必要)
35
▰重開powershell
▰試試看指令
▰是否會自動補全變成fetch
▰如果沒有執行
git fe <tab>
Import-Module posh-git
Add-PoshGitToProfile -AllHosts
Git Gui
36
▰TortoiseGit (俗稱 小烏龜,TortoiseSvn)
▻支援Windows
▻https://code.google.com/p/tortoisegit/
▰SourceTree
▻支援Windows 和 Mac
▻https://www.atlassian.com/software/sourcetree/overview
▰GitHub For Windows
▰ 更多 Gui 工具
▻ https://git-scm.com/downloads/guis
Tortoisegit 1
37
TortoiseGit 2
38
TortoiseGit 3
39
TortoiseGit 4 快速設定
40
TortoiseGit 5
41
TortoiseGit 6
42
準備篇
設定篇
43
設定檔案的層級和位置
44
System 層級
Unix - /etc/gitconfig
Windows – {Git安裝路徑}etcgitconfig
使用者層級
Unix - ~/.gitconfig 或者 ~/.config/git/config
Windows - %userprofile%.gitconfig
專案層級
在專案下的 .git/config
輕
設定檔案修改的方式
45
▰CLI
▻Powershell
設定檔案的層級和位置
46
System 層級
Unix - /etc/gitconfig
Windows – {Git安裝路徑}etcgitconfig
使用者層級
Unix - ~/.gitconfig 或者 ~/.config/git/config
Windows - %userprofile%.gitconfig
專案層級
在專案下的 .git/config
輕git config –-system {參數}
git config –-global {參數}
git config {參數}
設定檔案修改的方式
47
▰CLI
▻Powershell
▰Gui
▻TortoiseGit
▰直接改檔案
▻檔案位置直接改
▻注意 檔案斷行是 LF(Unix系統)
▻Notepad會斷行錯誤
▻新的編輯器就正常:Visual Studio Code 、Notepad++
必設定參數
48
▰姓名和Email為必設欄位
▻Cmd
▻透過TortoiseGit
▻透過直接改檔案
▻路徑 - %userprofile%.gitconfig
git config --global user.name“Alan Tsai“
git config --global user.email “alan@alantsai.net”
基本介紹
49
建立本機Repository
50
▰Repository像是整個版控的資料庫
▻要開始使用git要先建立Repository
▰建立方式
▻使用指令
▻使用TortoiseGit
git init
.git 資料夾
51
▰執行完之後多出一個 .git資料夾
▻如果沒有看到,打開系統檔案和顯示副檔名
▻這個資料夾絕對不能刪掉 – 刪掉就沒任何記錄了
Windows 10 設定
Windows 7 設定
(圖片取自網路)
作業流程
52
沒有任何
修改
修改檔案
準備要上
版的內容
儲存
git status
git diff
git add .
git commit
加入一個檔案到版控 - TortoiseGit
53
▰先在資料夾加一個叫做 ReadMe.md 的檔案
▰[右鍵] -> [Git commit -> “master”]
▰選擇ReadMe.md
▰ 輸入commit訊息
▰[Commit]
基本介紹
檢查修改內容
54
TortoiseGit – Check Modification
55
FAQ 為什麼看不到資料夾修改
56
▰Q
▻為什麼我加入了一個資料夾,但是修改清單沒有列出來呢?
▰A
▻git是管理檔案內容 – 所以假設只是為了建立資料夾結構,可
以在那個資料夾下面建立一個空檔案
▻習慣使用 .gitkeep 作為空檔案
基本介紹
決定那些要做版控
57
TortoiseGit add
58
設定忽略檔案 - .gitignore
59
▰並不是所有檔案都要進入版控
▻原則上能夠重新產生出來都不要進去
▻例如編譯過的dll、exe
▰放在和.git同一個層級,建立.gitignore檔案即可
▰全域可以用
▰gitignore 檔案可以參考:
https://github.com/github/gitignore
git config --global core.excludesfile “{路徑}”
基本介紹
復原修改
60
TortoiseGit revert
61
基本介紹
儲存到版控(commit)
62
如何寫好commit 訊息
63
▰訊息字數
▻標題 每行 50 個字
▻標題和內文空一行
▻內文每行72個字
▰訊息內容
▻寫 為什麼 而不是 做了什麼
▻結合Issue Tracking的號碼 – 例如 fix #211 –表示關掉issue 211
基本介紹
查看歷史
64
Git log –歷史
65
▰用git log指令可以看到歷史記錄
▻這個指令有很多參數
git log
git log --oneline --abbrev-commit --all --graph
用TortoiseGit的Show log
66
比對工具設定
67
TortoiseGit 在對office文件比對
68
▰雖然說git版控office文件容易造成空間大
▰但是以TortoiseGit來說
▰比對的時候會呼叫原生word做比對
▰因此版控office文件變得容易
▻其他gui也可以透過設定達到類型效果
基本操作
建立標籤
69
打版號
70
▰階段性完成可以打個標籤(版號)記住目前位置
▰有了這個標籤未來容易找到
71
▰標籤
▻顯示在log的名稱
▻常見的有 v1.0.0
▰記錄訊息
▻加上一些更詳細說明
▻例如完成什麼,到了什麼階段
▰強制
▻假設要更新標籤的位置才勾選
IDE類型很適合日常的操作
72
▰例如VS Code
▻Commit
▻比對
▻切換分支
進階指令
73
兇手就是你
74
▰有時候要針對當一個檔案每一行修改的時間和誰修
改
▰請使用git blame
▰更進階可以用
▻DeepGit
▰更適合純文字類型
提供檔案給別人
75
▰匯出(Export)
Best Practise
76
多久commit一次
77
▰請記住一個原則
▰每一個commit是minimum working unit
▻意思是最小可運作的單位
▻換句話說,至少能夠build即可
▰請不要一個commit裡面有3~4個不同性質功能的
修改
▰建立好的commit歷史記錄對於未來很有幫助
Commit 訊息很重要
78
▰請參考commit 篇
▰不管用什麼CVS,請記住一定要寫
▻因為太重要了,因此git逼你一定要寫
▰寫的好在3個月回來看你才容易知道什麼時間改了什麼,為什麼
改
▻在debug很有幫助
▰我個人習慣會在前面用先表示是什麼功能
▻例如:[前台][首頁]左邊banner跑版調整
結語
79
版控的重要性
80
▰版控是一切的基石
▰只有版控做好了,其他地方才能夠往下做
▰早幾年提到ALM的時候,版控就是其中一塊,也是
比較容易開始的一塊
https://blogs.msdn.microsoft.com/africaapps/2013/05/2
9/application-lifecycle-management-part-1-of-5/
其他資源
81
▰Git官網 https://git-scm.com/
▻Pro Git https://git-scm.com/book/en/v2
▰Git指令圖解說明
▻http://marklodato.github.io/visual-git-guide/index-en.html
▰連猴子都能夠懂的Git入門指南
▻http://backlogtool.com/git-guide/tw/
▰關注我的部落格 – 特別是git標籤
http://blog.alantsai.net/search/label/Git
▰更詳細的投影片
大家應該都要會的工具 Git 從放棄到會用1-基礎篇
下一次
82
▰使用github
▻建立帳號
▻功能介紹
▰Markdown語法介紹
▻Visual Studio Code工具介紹
▰用github建立一個自己線上履歷頁
▻不懂html也可以做
83
Q&A
感謝大家
任何問題都可以在
contact@alantsai.net
部落格-Alan Tsai 的學習筆記
找到我
CREDITS
Special thanks to all the people who made and
released these awesome resources for free:
▰ Presentation template by SlidesCarnival
▰ Photographs by Startup Stock Photos
84

電子內容管理 使用Git 與 github 1

Editor's Notes

  • #12 2005 問世 2008 年搭配github往上升
  • #52 https://www.google.com.tw/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=0ahUKEwj35dTWkqLVAhVHspQKHRD3CvcQjhwIBQ&url=http%3A%2F%2Freadinginternet-andrew.blogspot.com%2F2012%2F08%2Fwindows-7_31.html&psig=AFQjCNGLPJfJKnUu8HLBZIkbSudj8JA7tQ&ust=1500993259642755 https://www.google.com.tw/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=0ahUKEwjZksmXkqLVAhVEoZQKHRA2DLEQjhwIBQ&url=http%3A%2F%2Fmrtang.tw%2Fblog%2Fpost%2F11068556-windows-vista%25E8%2588%2587xp%25EF%25BC%258C%25E9%25A1%25AF%25E7%25A4%25BA%25E3%2580%258C%25E9%259A%25B1%25E8%2597%258F%25E3%2580%258D%25E6%25AA%2594%25E6%25A1%2588%25E5%258F%258A%25E8%25B3%2587%25E6%2596%2599%25E5%25A4%25BE%25E7%259A%2584&psig=AFQjCNGLPJfJKnUu8HLBZIkbSudj8JA7tQ&ust=1500993259642755