개발/GitHub

npm을 이용해서 gh-pages 배포하기

gh-pages로 호스팅을 하는 방법에는 여러가지가 있다. GitHub Desktop을 사용해도 되고 직접 gh-pages 브랜치를 만들어도 된다. 물론, 모듈을 이용해 VSCode에서 직접 올리는 방법도 있다. npm i gh-pages 우선 위의 명령어를 통해 배포하고자 하는 프로젝트에 gh-pages 모듈을 설치한다. 설치된 후 npm run build 명령어를 입력하면 작성한 코드들이 build라는 폴더 안에 압축되어 빌드되는 것을 확인할 수 있다. 추가적으로 package.json의 하단에 아래 코드를 추가한다 "homepage": "https://사용자이름.github.io/레포지토리이름" 예시는 아래와 같다. { "name": "어쩌구", "version": "0.1.0", "private"..

깃허브(GitHub) 로컬 폴더 레포지토리 올리기

개발을 하다보면 로컬에서 작업한 결과물을 깃허브에 올리고 싶은 경우가 있다. 1️⃣ 새로운 레포지토리를 하나 만든다 2️⃣ 생성한 레포지토리의 주소를 복사한다 3️⃣ 로컬에서 작업하던 폴더에서 git init을 입력한다 git init 4️⃣ git add . 을 통해 올리고 싶은 코드들을 스테이징 한다 git add . // .은 모든 파일을 의미. 특정 파일을 원한다면 특정 파일의 이름을 작성 (4.1. git status 명령어를 통해 변경 사항들에 대한 내용을 확인해본다) 생략해도 문제는 없지만 git add .가 작동했는지 확인 및 현재 브랜치 이름을 확인하기 위한 단계 git status 5️⃣ git commit -m "커밋 메시지"를 작성해서 커밋한다 Gitmoji를 사용하는 경우에는 gi..

(GitHub Desktop 이용)GitHub gh-pages로 호스팅하기

GitHub에서 특별한 이름을 가진 branch(코드들의 평행세계)를 가지고 있으면 공짜로 static 호스팅을 할 수 있도록 해준다. (Branch를 통해 GitHub에서 다양한 버전 관리와 새로운 기능을 추가해보는 시도를 해볼 수 있다. branch는 서로 영향을 미치지 않기 때문에 독립적으로 여러 작업을 할 수 있다. branch에 관한 자세한 내용은 아래 글 참고) 브랜치란? 【브랜치 (Branch)】 | 누구나 쉽게 이해할 수 있는 Git 입문~버전 관리를 완벽하게 이용해보자~ | Backlog 누구나 쉽게 이해할 수 있는 Git 입문~버전 관리를 완벽하게 이용해보자~ | Backlog 누구나 쉽게 알 수 있는 Git에 입문하신 것을 환영합니다. Git을 사용해 버전 관리를 할 수 있도록 함께 ..

GitHub Desktop을 이용해 로컬 폴더 깃허브에 올리기

프로젝트 시작을 할 때 repo를 만들어서 시작한 경우가 아닌, 로컬에서 작업을 한 후 해당 폴더를 통째로 Git에 업로드를 하는 경우도 있다. GitHub와 연동하여 사용하기 쉽도록 GUI 환경을 제공하는 GitHub Desktop을 사용한다. (터미널 창에서 직접 commit/push를 하는 것 보다 GUI라 확실히 직관적이고 편하다) 우선 GitHub Desktop을 설치해서 실행한다. 위와 같은 화면이 나온다. (본인은 여러번 사용했기 때문에 화면의 구성은 다를 수 있다) 이제 로컬 폴더를 새로운 repository를 만들면서 GitHub에 업로드 해보자. File > New repository에 들어간다. 위와 같은 창이 나오게 되는데 주의할 점이 있다. Name의 경우 프로젝트 폴더 명(ind..