0%

[Steem Project] Travis-CI를 이용한 Gatsby 블로그 자동 배포하기

이전 글 [개츠비(gatsby)로 스팀잇 블로그 만들기]에서는 Travis-CI 자동 배포에 실패했었습니다. 이번에는 Travis-CI 에서 자동 배포에 성공하여 다시 포스팅합니다.

Travis-CI 는 깃허브에 사이트를 배포할 수 있습니다. 그리고 Cron Jobs 기능을 제공합니다. 저는 이 두 가지 기능 때문에 Netlify 보다는 Travis-CI 를 사용할 것 같습니다.


연관글


* * *

빌드 과정에서 오류가 발생하는 플러그인을 제거하였다. gatsby-config.js 파일을 수정하였다.

1
2
3
4
5
6
7
8
9
10

resolve: 'gatsby-transformer-remark',
options: {
plugins: [
// {
// resolve: 'gatsby-remark-images',
// options: {
// maxWidth: 960
// }
// },

gatsby-remark-images 은 마크다운에서 이미지를 처리하는 플러그인이다. 나는 스팀잇에 업로드한 이미지를 사용하기 때문에 해당 플러그인은 없어도 된다.



GITHUB_TOKEN 발급 받기


GitHub에서 Developer settings 메뉴의 Personam access toknes 페이지에 접속한다.

Personal access tokens: https://github.com/settings/tokens

Generate new token 버튼을 클릭한다.

repo 권한을 모두 선택한다. 그리고 Generate token 버튼을 클릭한다.


깃허브 access token 발급이 완료되었다. 참고로 이 페이지를 닫고 나면 access token은 다시 확인 할 수 없다.



Travis-ci를 이용하여 자동 배포하기


.travis.yml 파일을 생성한다. 설정에 대한 자세한 내용은 [공식 메뉴얼]을 참고한다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
language: node_js

node_js:
- "8"

cache:
directories:
- node_modules

# 배포 설정
deploy:
provider: pages
skip-cleanup: true
keep-history: true
github-token: $GITHUB_TOKEN
local_dir: public
on:
branch: master

before_install:
- npm install -g gatsby-cli

install:
- npm install

script:
- gatsby build --prefix-paths

Travis-CIRepositories에서 blog 프로젝트를 검색하여 활성화한다.

Travis-CI Repositories: https://travis-ci.org/account/repositories

Settings 버튼을 선택한다. 그리고 Environment Variables에 발급 받은 GITHUB_TOKEN 를 등록한다.

주기적으로 자동 배포를 실행하려면, Cron Jobs 을 활성화한다.

빌드(build)를 실행하면 아래와 같이 로그에서 과정을 볼 수 있다.

배포까지 끝나면 아래와 같이 완료되었다는 메세지를 볼 수 있다.

이제 24시간마다 블로그가 깃허브 페이지에 자동 배포가 될 것이다. 그리고 깃허브에 코드를 업데이트를 해도 자동 배포가 실행된다. 또는 Travis-CI 에서 강제로 빌드를 실행해도 된다.


* * *

이제 제가 원했던 스팀잇 블로그의 자동 배포 환경이 셋팅되었어요. Travis-CI 를 이용하면 24시간마다 자동 배포가 됩니다. 나중에는 스팀잇에 글 작성을 인지하고 자동 배포가 실행되도록 구현할 예정입니다.

이제부터 시간날때마다 블로그에 필요한 기능을 붙여나갈 예정입니다. 우선 구글 통계와 구글 광고 부터 삽입해봐야겠습니다.

여기까지 읽어주셔서 감사합니다.


Sponsored ( Powered by dclick )

dclick-imagead


Originally posted on http://steemit.com