[ Do it ] 깃&깃허브 입문 _06. 깃허브에서 개발자와 소통하기

 

 

 

 06-1. 깃허브 프로필 관리하기 

 

프로필 둘러보기

 

프로필 작성하기

1. https://github.com/아이디

2. [ Edit - Upload a photo ]

3. [ Set new profile picture ]

4. [ Update profile ]

5. 완료

 

+) 깃허브 설정 항목

1. profile : 프로필 정보 입력 및 수정

2. account : 사용자 이름(username) 수정 및 계정 삭제

3. security : 비밀번호 변경 및 이중 인증

4. emails : 사용자 메일주소 추가, 주메일-백업메일 주소 지정

5. notifications : 깃허브 알림방법 설정

6. billing : 유료계정 전환

7. SSH and GPG keys : SSH키, GPG키 입력

8. blocked users : 특정 사용자 차단

9. repositories : 저장소 관리, 삭제

10. organizations : 해당 계정이 속한 조직 

11. saved replies : 반복 댓글 저장

12. applications : 깃허브 앱, 인증관련 앱

13. developer settings : 깃허브 관련 앱 등록, 정보 참고

 

컨트리뷰션 살펴보기

contribution graph, 사용자가 1년동안 깃허브를 얼마나 활용했는지

 

 06-2. README 파일 작성하기 

README 파일 만들기

마크다운 문법, .md

1. README 파일 생성

[ Add a README ]

2. 편집기에서 작성

[ Enter ] 를 두 번 눌러야 줄바뀜      

3. 미리보기

 [ Edit new file ] - [ Preview ]

4. 커밋메시지 작성

[ Commit new file ]

5. README 확인

6. 수정

7. 수정내용확인

[ Preview changes ]

8. 수정내용 깃허브에 등록

 [ Commit changes ] 

 

마크다운 문법 알아보기

.md : 마크다운 형식

사용이 쉽고 비교적 간단, 마크다운을 지원하는 프로그램에서만 사용가능

- 제목

# 제목 ~ ###### 제목

#을 1개부터 6개까지 폰트사이즈 지정

 

- 텍스트 단락 줄 바꾸기

[ ENTER ] 2회

 

- 가로줄

---, === 등 추가

 

- 순서있는 목록

[ENTER] 한번으로 줄바꿈가능

1, 2, 3.. 순서대로 작성하지않아도 순서대로 정렬됨

 

- 순서없는 목록

+, -, " 를 붙이면 자동 글머리 기호

[Tab} : 단계별 목록

 

- 텍스트 강조

**굵게**, __굵게__

*기울임체*, _기울임체_

***굵은 기울임체***, ___굴은 기울임체___

~~취소선~~

 

- 인용

> 인용문

>> 인용문 안의 인용문

 

- 소스코드

한 줄짜리 코드는 ` function add(x, y) { return x + y; } ` 처럼 사용합니다.

▽ ` 백틱으로 구분

한 줄짜리 코드는 function add(x, y) { return x + y; } 처럼 사용합니다.

 

- 링크

1. <링크주소> : url 나타남

2. [링크텍스트](링크주소) : 링크텍스트로 사이트 이동

3. [링크텍스트](링크주소, "부가설명") : 링크텍스트로 사이트 이동, 설명보여짐

 

- 이미지

! [ 대체텍스트 ] ( 이미지경로 )

 

깃허브에 이미지 올리고 README에 삽입하기

1. 이미지를 모아둘 디렉터리 생성, 이미지 저장

2. [Upload files]

3. 이미지 디렉터리 끌어 옮기기

4. [Commit changes]

5. 깃허브에 이미지 디렉터리 생성 확인

6. README 파일에 이미지 파일 넣기 - 수정

7. 

8. 커밋

9. 이미지확인 가능

 

 06-3 오픈 소스 프로트에 기여하기 

컨트리뷰션의 종류

README 파일 번역, 이해하기 - 코드 수정, 제안

 

오픈 소스 저장소 복제하기

소스를 수정하기 위해서는 다른 저장소의 소스를 내 저장소에 복제 _ 포크(fork)하기

1. 오픈소스 계정의 저장소에서 [Fork]

2. 복제

3. forked from peacein/doit : -에서 fork했다

   소스, README 수정 가능

 

포크한 저장소를 지역 저장소로 클론하기

1. [Clone or download] - 복사

2. 깃배시 프로그램의 터미널 창, 저장소 복제하기

$ git clone 복사한주소 복사할 디렉터리이름

3.  복사한 디렉터리로 이동하여 README, demo.txt 파일 확인하기

$ cd doit
$ ls -al

4. demo.txt 파일 수정, 저장

5. 'add my text' 메시지로 커밋

$ git commit -am "add my text"

6. 원격 저장소에 푸시

$ git push

7. 웹브라우저의 원격저장소에서 확인 가능, 파일 수정o, 저장소반영x

 

오픈 소스 프로젝트로 풀 리퀘스트 보내기

원본 저장소에 내 소스 반영 요청하기 : 풀 리퀘스트(pull request)

1. [ New pull request ] 

2. 원본 저장소와 복제된 저장소의 차이를 보여줌

3. [Create pull request]

4. 수정내용 설명 메시지와 커밋 

5. 원본 소스 개발자와 수정 반영여부 대화

 

+) 내가 만든 소스를 누군가 수정한다면

[Pull requests] 목록에서 확인가능 - 수정할 경우 [ Merge pull request ]

 

 06-4 깃허브에 개인 블로그 만들기 

GitHub Pages 알아보기

게시판, 회원가입 등이 없고 서버에 업로드된 파일을 수정하는 페이지에 적합

.github.io

 

GitHub Pages를 사용하는 두가지 방법

- HTML / CSS/ JS 등의 홈페이지 파일이 있는 경우

- 깃허브 지원 지킬테마를 사용하는 경우  

 

홈페이지 파일이 있을 때 GitHub Pages 사용하기

홈페이지 파일 저장소로 올리기

1. [+] [New repository]

2. Repository name : 계정.github.io / v Initialize this repository with a README / Create repository

3. [Upload files]

4. 드래그(하위 파일이 있는 경우), 파일 선택으로 업로드

5. [Commit changes]

6. 새로운 저장소 파일 확인 가능

홈페이지 확인하기

1. 깃허브 저장소 화면 [Settings]

2. 사이트 생성 메시지와 홈페이지 주소 확인

3. 주소로 홈페이지 확인 가능

 

홈페이지 파일이 없을 때 GitHub Pages 사용하기

디자인 스타일 모음 지킬테마

지킬테마 알아보고 선택하기

온라인 이력서 역할, 블로그 게시물 업로드 등 목적에 따라 디자인 선택

1. jekyll의 관련 소스 찾기

2. 적용할 소스 선택

3. 선택한 테마의 데모사이트 링크 접속

4. 사이트 미리보기 가능

5. ex. barryclark 사용해보기

 

+) Jekyll Themes 사이트

디자인으로 먼저 확인가능한 jekyll 테마사이트, 데모보기, 깃허브 이동, 다운로드 가능

 

블로그 만들고 기본 환경 설정하기

- 지킬테마소스 그대로 포크해서 사용하기 : 게시물 포스팅 목적일 때 편리

- 다운받아 사용하기 : 파일자체 수정에 용이

1. jekyll-now 테마 소스 저장소를 자신의 저장소로 포크

2. github pages로 사용하기 위해서 '계정.github.io'로 저장소 이름을 수정해야함 - [Settings]

3. 계정.github.io - [Rename]

4. 환경설정 , _config.yml

5. [수정]

6. name, description, footer links의 url 수정 - [Commit]

7. 수정된 사이트 확인가능

 

블로그에 포스트 작성하기

포스트는 _posts디렉터리에 저장

1. 기본포스트파일 '2014-3-3-Hello.World.md'

2. [수정]

3. ---에서 ---는 모든 포스트에 들어가야하는 내용- 복사

layout:post는 수정x, 

4. 디렉터리 화면으로 돌아오기 [Create new file]

5. 복사한 내용 옮기기, title 수정

6. [commit new file]

7. 디렉터리에서 포스트 파일 확인하기

 

포스트에 이미지 삽입하기

1. images디렉터리에 이미지파일 업로드

2. _posts 디렉터리에서 수정할 파일 선택

3. [수정]

4. 삽입할 이미지 형식 지정


5. [Preview changes] 에서 이미지 확인

6. [Commit changes] 커밋

7. 이미지 삽입 확인