intro
github로 간단하게 깃허브 페이지를 호스팅 할 수 있어서 기록으로 남겨보고자 합니다. 간단한 깃 + 깃허브 이용하는 방법은 알고 계신다고 가정하고 진행하려합니다. (모르신다면 참고자료에 튜토리얼 링크를 보시길 권장합니다.)
과정
먼저 https://github.com/ 에서 새로운 repository 를 생성합니다.
그리고 해당 repo를 local로 받아옵니다.
git clone {copy 한 url}
그 다음 아래와 같은 html 파일을 index.html 이름으로 root 디렉토리에 만들고 remote의 main 브랜치에 push 합니다.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>👨💻 Portfolio</title>
</head>
<body>
<h2>👨💻 Portfolio</h2>
</body>
</html>git commands
git add index.html
git commit -m "Add index.html"
git push origin main
그리고 gh-pages 브랜치를 새로 체크아웃 하여 remote 로 push 합니다.
gh-pages 브랜치는 깃허브가 자동으로 외부 배포될 수 있도록 인식하는 브랜치입니다.
git checkout -b gh-pages
git push origin gh-pages
만약 배포하고 싶은 브랜치를 바꾸고 싶으시면, 만드신 repository 에서 settings > options > GitHub Pages 탭에서 변경하실 수 있습니다.
그러면 앞으로 해당 브랜치로 커밋 후 푸쉬하시면 페이지가 갱신되어 자동으로 배포되는 것을 확인하실 수 있습니다.
배포되는 url은 https://{계정ID}.github.io/{repository이름} 으로 배포됩니다.
간단한 포트폴리오는 깃허브 페이지로 호스팅하시면서 테스트해보실 수 있습니다~~
(node gh-pages 패키지라는 것도 있어요~)
그럼 오늘도 행복한 코딩 되세요~ 🤯
참고자료
- 깃 + 깃허브 참고자료
'dev-log > html-css' 카테고리의 다른 글
| [HTML5] video tag 크롬(chrome) autoplay + muted 버튼 음소거 해제 삽질기 (1) | 2020.10.11 |
|---|
