در جلسات قبل یک پروژه ساده را با استفاده از گیت مدیریت کردیم. در این جلسه قصد داریم تا با مفاهیم اساسی ساخت شاخه ها و ترکیب کردن آن با شاخه اصلی پروژه توضیحاتی را خدمت شما عزیزان عرض کنیم.
کنترل ورژن گیت دارای یک تنه اصلی به نام master است. همانطور که قبلا اشاره شد ساختار گیت مثل یک درخت است. هر درختی شامل یک تنه اصلی و شاخ و برگ است. به شاخ و برگ های گیت branch گفته می شود. ممکن است این سوال پیش آید که خوب branch چیست ؟
شاخه یا همان branch یک پروژه در واقع نسخه ای کپی شده از پروژه اصلی هستند. شما با ایجاد یک شاخه می توانید یک کپی از پروژه اصلی را داشته باشید و تغییرات مد نظر خودتان را بر روی آن شاخه انجام دهید بدون اینکه برای شاخه اصلی مشکلی به وجود آید. در نهایت شما می توانید تغییرات را به شاخه اصلی انتقال دهید و در واقع پروژه خودتان را merge کنید. در ادامه با یک مثال کاربردی این موارد را همراه با دستورات آن به سرانجام می رسانیم.
ابتدا در صفحه ویندوز یک پوشه به نام git-test ایجاد می کنیم. در درون این فولدر راست کلیک کرده و فایل های index.html و aboutus.html را ایجاد می کنیم.
در ادامه یک پوشه به نام style را نیز ایجاد می کنیم و در درون آن یک فایل به نام style.css را قرار می دهیم. سپس در قسمت خالی صفحه راست کلیک کرده و مانند شکل زیر git bash here را انتخاب می کنیم.
با باز شدن قسمت دستورات git برای نصب و راه اندازی گیت دستور زیر را وارد کنید.
$ git init
بعد از ساختن فولدر گیت با استفاده از دستور بالا یک بار git status می گیریم. و در خروجی داریم.
$ git status
On branch master
No commits yet
Untracked files:
(use "git add <file>..." to include in what will be committed)
aboutus.html
index.html
style/
nothing added to commit but untracked files present (use "git add" to track)
فایل index.html را باز کنید و اطلاعات زیر را که قطعه کدی ساده از html است را در درون آن paste می کنیم.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
</body>
</html>
حالا دوباره اگر git status بگیریم داریم:
$ git status
On branch master
No commits yet
Untracked files:
(use "git add <file>..." to include in what will be committed)
aboutus.html
index.html
style/
nothing added to commit but untracked files present (use "git add" to track)
حالا می بایست موارد اضافه شده را به حالت stage ببریم. بدین منظور دستور git add . را وارد می کنیم. در مرحله بعد می خواهیم تغییرات را commit کنیم. دستور git commit –m “first step of project” را وارد می کنیم و سپس دوباره git status می گیریم.
$ git status
On branch master
nothing to commit, working tree clean
درخت کاری خالی است. با این فرآیند کاری تا اینجا در جلسات اول و دوم آشنا شده بودیم. در ادامه این جلسه می خواهیم یک شاخه یا همان branch ایجاد نمائیم.
برای اینکه این آموزش به پروژه های واقعی خیلی نزدیک تر شود قبل از اینکه به مرحله بعد برویم بهتر چند تا commit دیگر بسازیم. بر روی aboutus.html تمرکز می کنیم و قطعه کد html زیر را توی آن وارد می کنیم.
aboutus.html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<header>
<h1>aboutus</h1>
</header>
</body>
</html>
سپس با استفاده از git commit –a –m “aboutus.html updated” آن را commit می کنیم و سپس در نهایت یک فایل دیگر به نام contactus.html اضافه می کنیم و در درون آن کد زیر را قرار می دهیم و آن را commit می کنیم.
contactus.html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<header>
<h1>contactus</h1>
</header>
</body>
</html>
ساختن branch از پروژه اصلی
نمی دونم تا به حال به این موضوع دقت کردید که کلمه master همواره تا اینجای آموزش در جلوی دستورات گیت قرار می گرفته است؟ در زیر به خوبی این کلمه در درون پرانتز مشخص است.
asascript@DESKTOP-L4FK899 MINGW64 ~/Desktop/git-test (master)
$
در واقع این عبارت درون پرانتز نشان دهنده شاخه ای که الان برای شما فعال است. به صورت پیشفرض در هنگام ساخته شدن هر پروژه گیت با استفاده از دستور git init همواره یک شاخه اصلی در گیت که به آن تنه اصلی (master) نیز می شود ایجاد می گردد. شما هر تغییراتی را که تا اینجا انجام می دادید در درون این شاخه اصلی نگهداری می شد. این تغییرات شامل stage ها و commit های پروژه است. ممکن است بخواهید تغییراتی را در درون قسمتی از کد انجام دهید بدون اینکه بر روی پروژه اصلی شما تاثیر گذار باشد. برای انجام این تغییرات می توانید یک شاخه یا همان branch ایجاد نمائید. برای ساختن یک شاخه کافی است دستور زیر را وارد نمائید. در این جا عبارت development نام شاخه جدیدی است که قرار است ساخته شود.
$ git branch development
حالا می توانید به راحتی با استفاده از دستور زیر وارد شاخه development شوید.
$ git checkout development
Switched to branch 'development'
اگر دقت کنید master به development تغییر نام داده است. محیط دستوری گیت به شکل زیر در آمده است.
asascript@DESKTOP-L4FK899 MINGW64 ~/Desktop/git-test (development)
$
حالا در شاخه development قرار داریم و می خواهیم تغییراتی را بر روی پروژه ایجاد کنیم.
در ادامه تغییراتی دلخواه را به index.html و aboutus.html اضافه می کنیم. ما پاراگراف Lorem ipsum را می افزائیم.
Index.html && aboutus.html
<p>Lorem Ipsum</p>
حالا بر روی شاخه یکبار git status می گیریم. خروجی به صورت زیر است:
$ git status
On branch development
Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git restore <file>..." to discard changes in working directory)
modified: index.html
modified: aboutus.html
modified: style/style.css
no changes added to commit (use "git add" and/or "git commit -a")
نکته: هر بار که خواستیم از هر شاخه خارج شویم و به شاخه دیگری برویم می بایست همواره قبل از خروج تغییرات را commit کنیم تا شاخه به صورت کامل پاکسازی شود.
با استفاده از دستور git add . و سپس دستور git commit –m “index.html and aboutus.html updated with Lorem” تغییرات را commit می کنیم. در خروجی بر روی شاخه developer یکبار git status می گیریم.
$ git status
On branch development
nothing to commit, working tree clean
حالا دوباره کد زیر را به contactus.html اضافه می کنیم و commit می کنیم.
Contactus.html
<p>Lorem Ipsum</p>
همانطور که در بالا گفته شد با استفاده از دستور git checkout master می توانیم به شاخه master نقل مکان کنیم. به شاخه master می رویم. یکبار git status از شاخه master می گیریم.
$ git status
On branch development
nothing to commit, working tree clean
شاخه به طور کامل پاک است. اگر یکبار git log نیز بگیریم داریم:
$ git log
commit b28fddc362c2bb32785ae80cfd59d890d8e4cb75 (HEAD -> master)
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 11:01:10 2021 +0430
contactus.html updated and created
commit b155e806145579a1225578327e35baa3560042e5
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 10:57:31 2021 +0430
aboutus.html updated
commit b51606b0597a3ff7c0596f7c952d96212f7f1834
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 10:56:23 2021 +0430
first step of project
همانطور که مشاهده می کنید خبری از commit که در شاخه development گرفته بودیم نیست. در همین شاخه اگر به فایل aboutus.html مراجعه کنید می بینید که خبری از Lorem Iposum نیست! این یکی از بزرگترین مزایای استفاده از گیته که می توانیم بر روی پروژه شاخه بندی داشته باشیم. ممکن است این سوال پیش آید که این کار به چه دردی می خورد. خوب همه این تغییرات را روی فایل اصلی انجام دهیم ؟
در جواب به این سوال باید گفت که این کار چند مزیت دارد:
- اگر مشکل یا باگی در سیستم به وجود آید شما می توانید به سادگی با ایجاد کردن یک شاخه اقدام به رفع آن باگ نمائید و در صورتی که همه چیز بدون مشکل بود این تغییرات را به تنه اصلی انتقال دهید.
- شما می توانید با شاخه سازی قسمت های مختلف، یک پروژه را بین برنامه نویس ها تقسیم کنید و در نهایت بعد از اعمال تمامی تغییرات آن را بر روی شاخه اصلی ترکیب کنید.
- شاخه سازی یکی از روش های ایجاد و کنترل ورژن در پروژه های مختلف است که می بایست حتما از این ویژگی در کنترل ورژن استفاده کرد.
در شاخه master یک commit دیگر به contactus.html اضافه می کنیم. جهت انجام این کار code style زیر را وارد می کنیم.
<link rel="stylesheet" href="style.css">
و سپس آن را commit می کنیم.
Merge کردن پروژه
بعد از اینکه تمامی کدی نویسی های دلخواه بر روی پروژه را براساس قابلیت شاخه ای انجام دادیم می خواهیم تغییرات موجود بر روی شاخه development را به تنه اصلی master اضافه کنیم بدین منظور از دستور merge برای انجام این کار بهره می بریم.
همواره جهت merge کردن یک پروژه بر روی هر شاخه می بایست ابتدا به آن شاخه بروید. در اینجا ما می خواهیم شاخه development را بر روی تنه master ترکیب کنیم. به همین خاطر ابتدا با استفاده از دستور checkout به master می رویم. و دستور زیر را برای انجام merge شاخه development بر روی master وارد می کنیم.
$ git merge development
بعد از وارد کردن دستور فوق در خروجی داریم:
$ git merge development
Updating 72e7bbf..946d9eb
Fast-forward
aboutus.html | 16 ++++++++++++++++
index.html | 5 ++++-
2 files changed, 20 insertions(+), 1 deletion(-)
حالا اگر git log بر روی master بگیریم خروجی شامل تمامی commit ها است.
$ git log
commit 66df7acc053365ecf3f7e6facb59fa559eb14d03 (HEAD -> master)
Merge: 76fa3cd 5e98cf3
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 11:37:51 2021 +0430
Merge branch 'development' into master
commit 76fa3cd0e965e58268658cf382f16ecf15d08915
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 11:37:30 2021 +0430
link style added to cotactus.html
commit 5e98cf333b3f62a52676c98b1426d16fe8324d55 (development)
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 11:16:17 2021 +0430
contactus.html updated with Lorem ipsum
commit 38cc28c9425799d543962368b6c83c8a5cff6e3e
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 11:07:57 2021 +0430
index.html and aboutus.html updated with Lorem
commit b28fddc362c2bb32785ae80cfd59d890d8e4cb75
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 11:01:10 2021 +0430
contactus.html updated and created
commit b155e806145579a1225578327e35baa3560042e5
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 10:57:31 2021 +0430
aboutus.html updated
commit b51606b0597a3ff7c0596f7c952d96212f7f1834
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 10:56:23 2021 +0430
first step of project
حالا اگر بخواهیم این log را به صورت شاخه ای ببینیم کافی است که دستور git log –graph را وارد کنیم. خروجی به صورت زیر در می آید.
git log --graph
* commit 66df7acc053365ecf3f7e6facb59fa559eb14d03 (HEAD -> master)
|\ Merge: 76fa3cd 5e98cf3
| | Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
| | Date: Wed Mar 31 11:37:51 2021 +0430
| |
| | Merge branch 'development' into master
| |
| * commit 5e98cf333b3f62a52676c98b1426d16fe8324d55 (development)
| | Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
| | Date: Wed Mar 31 11:16:17 2021 +0430
| |
| | contactus.html updated with Lorem ipsum
| |
| * commit 38cc28c9425799d543962368b6c83c8a5cff6e3e
| | Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
| | Date: Wed Mar 31 11:07:57 2021 +0430
| |
| | index.html and aboutus.html updated with Lorem
| |
* | commit 76fa3cd0e965e58268658cf382f16ecf15d08915
|/ Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
| Date: Wed Mar 31 11:37:30 2021 +0430
|
| link style added to cotactus.html
|
* commit b28fddc362c2bb32785ae80cfd59d890d8e4cb75
| Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
| Date: Wed Mar 31 11:01:10 2021 +0430
|
| contactus.html updated and created
|
* commit b155e806145579a1225578327e35baa3560042e5
| Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
| Date: Wed Mar 31 10:57:31 2021 +0430
|
| aboutus.html updated
|
* commit b51606b0597a3ff7c0596f7c952d96212f7f1834
Author: asa.web.script@gmail.com <asa.web.script@gmail.com>
Date: Wed Mar 31 10:56:23 2021 +0430
first step of project
در ابتدا ما commit هایی را بر روی تنه اصلی داشتیم. سپس شاخه development را اضافه کردیم و در درون آن مواردی را commit کردیم و دوباره به شاخه اصلی برگشتیم و مورد دیگری را در آنجا commit کردیم. تمامی این مراحل به صورت درخت وار در log graph مشخص است.
جمع بندی
در این جلسه تلاش کردیم تا یک پروژه را براساس شاخه بندی از صفر تا صد انجام دهیم. در ابتدا پروژه ای را با استفاده از فایل های ساده html ایجاد کردیم و کد هایی ابتدائی را در درون آن وارد کمردیم و سپس تغییرات را در چندین مرحله commit کردیم. در ادامه آموزش یک شاخه به نام development ایجاد کردیم و در درون این شاخه نیز کامیت هایی را افزودیم و در نهایت آن را با تنه ی اصلی master ترکیب کرده و پروژه اصلی را به سر انجام رساندیم. در جلسه آینده قصد داریم تا بر روی conflict ها بحث کنیم و conflict های ایجاد شده را برطرف کنیم.