Publishing on Github (Github Desktop)

 

GITHUB

Creating a Github Repository

---

 

레파지토리를 만드는 방법은 여러가지가 있다

컴퓨터에 폴더를 만든 다음 그 폴더를 github에 올리는 방식,

아니면 처음부터 github 내에 repository를 만들어주는 방법이 있다.

​

​

github 데스크톱은 초보자들이 github과 작업을 하기 위한 도구이다

어떻게 작동되는지 이해하기가 매우 쉽게 되어있다.

 

 

Clone a repository from the internet (인터넷에 있는 repositoy 복제하기) 를 누르면

깃헙에서 생성했던 repository를 찾을 거다

Local Path(경로)에서 경로를 바꿔줄 수 있다.

​

clone을 클릭하고나서 지저된 경로에 가면

paintjs라는(내가 만든 repository)가 생성된 걸 볼 수 있다,

​

새로 생성한 repository라면 비어져있을 것이고

이미 만들어서 commit들을 한 repository라면

안에 있던 파일들이 함께 들어있을 것이다

​

 

 

 

 

 

GITHUB

Making Commits

---

 

 

1. README.MD

git은 파일들을 항상 주시하고 있다

​

vscode로 해당 폴더를 열고

README 파일을 만드는 경우도 있는데

README 파일의 확장자는 markdown으로 해줘야 한다

README.md

markdown은 서식이 있는 문서를 작성하는 것이다

readme 파일은 모든 git repository가 가지고 있어야 되는 파일이다,

​

"#" 이 부호는 마크다운에서 제목을 만들 때 사용한다

이렇게 앱에 관한 설명을 넣어준다

 

이렇게 파일을 만들고 깃헙 데스크톱을 보면

README 파일에 +와 텍스트가 추가된 것을 볼 수 있다.

​

​

​

​

2. Publish

생성하거나 수정한 파일을 선택해주고 해당 파일에 commit을 할 것이다,

​

commit은 이 repository의 저전을 저장하는 시점이다,

지금 이 시점의 파일 버전을 저장하는 것이다

​

commit을 하려면 commit의 타이틀이 필요하다

설명은 따로 필요없지만 타이틀은 작성해 줘야한다.

​

다 적어줬으면 Commit to master 버튼을 눌러준다

​

이렇게 하고 우리 깃헙 페이지를 들어가보면 아무 것도 변한게 없다

publish를 안해줬기 때문이다,

​

이제 위에 있는 publish branch를 클릭하면 된다.

​

​

3. Edit

파일 내용을 변경하고 github desktop을 보면

바뀐 내용을 -, +로 볼 수 있다.

다시 commit 버튼을 누른다

그리고 push를 누른다

​

​

파일 저장 -> 파일 선택 -> Commit 타이틀 -> Commit -> Push

​

​

​

​

​

​

​

​

​

​

​

GITHUB

Branches on Git

---

 

1. branch

git에서 branch라는 개념을 알아보자

Git에서 branch는 코드들의 평행세계라고 볼 수 있다

동그란 건 모두 commit이고, 여기서 중앙에 있는 branchrk master branch이다.

(지금은 master 말고 main 으로 변경됨)

Git은 어떤 commit이라도 받을 수 있게 해준다

​

어떤 commit이라도, 거기서부터 다른 프로젝트를 시작할 수 있다.

master branch와는 또 다른 프로젝트를 말이다!

​

대부분 사람들은, master branch에는 stable한(잘 작동하는 것으로, 어느정도 검증이 된) code를 올린다

그리고 실험하고 싶은 거나 새로운 기능을 추가할 때, 새로운 branch를 만든다

​

그림에서 보면 'Branch1'과 'Branch2'가 같은 commit에서 시작한다

​

Branch(가지)라고 불리는 이유는 나무같이 생겨서인데,

같은 베이스에서 시작하지만 한 부분에서 완전 달라진다

​

원하면 branch를 만들었다가 다시 합칠 수 있다

새로운 branch를 만들어서 부수고 때리고 수정하고 오만짓을 다하다가

다시 돌아와서 merge하면 끝이당!

​

우리가 만든 하나의 branch에서 작업한 걸 publish 할 수 있다.

 

 

2. Create a Branch

experimental이라는 새로운 branch를 만들어보았다.

​

experimental을 들여다 보면 master와 똑같은 기록을 가지고 있다,

​

experimental 브런치에서 파일을 수정하고 commit 해보자

master에는 없는 commit이 experimental에만 생겼을 것이다

master와 experimental을 바꿔가면서 vscode를 보면

수정된 부분만 바껴있을 것이다!

다른 코드는 다 똑같은데, Git은 똑똑해서 변화된 것만 찾아준다!

​

각각의 branch들을 바꿔가면서 보면 브라우저에서도 바뀐 부분을 확인할 수 있다.

​

vscode에서만 파일을 수정하면

이건 Changes에 기록되고 experimental에 적용할 지, master에 적용할 지 선택할 수 있다.

​

git으로 버전만 왔다갔다 거리면 된다!

이제 우린 버전이 달라도 파일 하나만 가지고 있으면 된당!😆

​

​

​

3. Mergy

이제 master branch에 가서 맨위 Branch 탭을 누르고 Mergy into Current Branch를 누른다

​

새 창이 뜨고 experimental을 클릭하면

experimental에서 master로 commit을 mergy한다고 쓰여있다.

(This will merge 1 commit from experimental into master)

즉, experimental에서 master로 하나의 commit을 가져오는 것이다.

​

​

 

 

 

​

​

​

GITHUB

Publishing on Github Pages

---

 

1. gh-pages

github에서 branch를 가지고 있으면 ,

특별한 이름이 붙여진 branch를 가지고 있으면

Github에서 공짜로 static 호스팅을 할 수 있도록 해준다

​

누구나 자신의 웹사이트를 무료로 업로드할 수 있고

Github이 공짜 URL을 제공해 줄 것이다.

​

static website는 그냥 HTML, CSS, JavaScript로만 이루어진 사이트를 의미한다

물론 front-end만 가능하고, back-end는 다룰 수 없다

​

무료 호스팅을 받으려면 몇가지 룰이 있다

첫째로, 가장 중요한 것은 우리가 branch를 만들어야 한다는 것이다.

이 branch 이름은 gh-pages 라고 해야한다

해당 branch를 만들어준 후

위의 Pubish branch 를 클릭해준다

​

이제 해당 코드들은 온라인으로 업로드 되어서 브라우저로 볼 수 있게 되었다.

​

이제 레파지토리 주소로 들어가보자

​

github.com/아이디/레파지토리이름

​

 

이렇게 branch가 두개 존재할 것이다.

 

 

하나는 main(master) 이고 하나는 gh-pages이다

gh-pages를 클릭해서 오른쪽을 보면 environments가 있고,

github-pages를 눌러보면 오른쪽에 view deployment가 있다.

클릭해보자!

​

​

https://eee0930.github.io/paintjs/

이렇게 무료 호스팅을 볼 수 있다.

​

 

 

 

 

 

​

​

GITHUB

Updating Github Pages

---

 

이제 Github 페이지를 어떻게 업데이트 하는지 알아볼 것이다.

​

잘못 따라하면 문제가 많이 발생하고 구글링을 많이 해야하니깐 제대로 해야한당😇😇😇😇

​

1. master(main)에서

어떤 수정사항이 있다면 우리가 먼저 해야할 일이 있다,

먼저 master(main) brunch로 가야한다

​

master에 있을 땐, 바꾸고 싶은 건 뭐든 바꿀 수 있다.

master brunch에서 파일을 수정했고, master brunch 상에서 commit을 할 것이다!

그리고 push도 눌러준다

​

모든 수정은 master brunch에서 할 것이다.

 

 

2. update from main

그리고 우리는 웹사이트를 업데이트 하고싶으니

github-pages branch도 업데이트 해야한다.

​

이제 gh-pages로 가서

Branch 탭을 누르고 update from main을 누를 것이다,

이건, master에 있는 모든 commit들을 가져오겠다는 뜻인데,

gh-pages로 모든 commit을 가져오는 것이다.

​

이제 gh-pages에 master가 merge되었다고 뜬다.

​

이제 우리는 gh-pages branch를 github.com에 올리기 위해 push를 해야한다.

​

위의 Push origin을 클릭한다.

​

​

​

​

​

main(master)로 이동 -> vscode에서 코드 수정 후 저장 -> master에서 commit -> Pushing to origin -> gh-pages로 이동 -> branch 탭에서 Update from main 클릭 -> 변경사항 Publish

​