
Jigsaw를 사용하여 블로그 만들기
1ocate • 2022-09-01
현재 이 웹사이트는 Jigsaw로 만들었다.
왜 많은 정적 사이트 생성기(Static Site Generator)중에 Jigsaw를 골랐는가?
Jamstack.com에 보면 정적 사이트를 만들 수 있는 여러가지 프로젝트가 있다. 업무 외의 상황에서도 PHP 숙련도를 높히기 위해 PHP기반의 Jigsaw를 사용해서 블로그를 시작하게 되었다.
그뿐만 아니라 라라벨 Blade 구문으로 레이아웃과 포스팅을 작성할 수 있고, Md(Mark Down) 문법으로 포스팅을 작성 할 수 있기 때문에 후에 정적 사이트 생성기 프로젝트를 바꾸게 되더라도 수월하게 마이그레이션 할 수 있을거라 생각한다.
*참고: Jigsaw를 사용하여 만든 사이트들
Jigsaw를 사용하여 Github Page로 배포하기
Jigsaw에 관한 설명은 여기에 전반적으로 설명이 되어있으나, 헤멨던 부분을 정리하고자 한다.
1. 로컬 개발 환경 생성
빠르게 로컬에서 띄워보기:
# 로컬 경로 생성
mkdir my-jigsaw-blog
# Jigsaw 설치
cd my-jigsaw-blog
composer require tightenco/jigsaw
# 스타터 탬플릿 스캐폴딩(공식문서에는 다른 탬플릿 존재)
vendor/bin/jigsaw init blog
# 로컬환경에서 실행
npm run watch
2. Github Page로 배포하기
최상위 경로에 ".github/workflows/main.yml" 파일을 생성한 후 아래의 내용을 넣고 배포가 이루어졌을때 깃헙 페이지 내에서 페이지를 빌드하도록 한다.
name: Build & Publish
on:
push:
branches:
- master
jobs:
build-site:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Install Composer Dependencies
run: composer install --no-ansi --no-interaction --no-scripts --no-suggest --no-progress --prefer-dist
- name: Install NPM Dependencies
run: npm install
- name: Build Site
run: npm run prod
- name: Stage Files
run: git add -f build_production
- name: Commit files
run: |
git config --local user.email "actions@github.com"
git config --local user.name "GitHub Actions"
git commit -m "Build for deploy"
- name: Publish
run: |
git subtree split --prefix build_production -b gh-pages
git push -f origin gh-pages:gh-pages