블로그에 글을 쓰면 자동으로 커밋되는 걸 설정해보고 싶어서 도전하는 포스팅!
이러면 좀 더 쓰고 싶은 마음이 들지 않을까 하는.. ;)
사실 원래 쓰던 tistory-readme-stats 서비스 가 있었는데 이제 티스토리에서 open api 서비스를 종료해서 사라져버렸다.
아무튼 GitAction 을 활용하는 방법이 있길래 이걸로 해볼까 한다. 차근차근 해보자!
RSS 설정
먼저 티스토리 블로그 관리 > 블로그로 들어간다
위 처럼 설정해주고 변경사항을 저장한다
그리고 [본인 블로그 주소]/rss 주소로 접속해서 잘 나오는지 한번 확인해보기
ex: https://dawonny.tistory.com/rss
GitAction
최신 글 목록 5개를 보여주는 부분을 README에 추가하려고 한다.
깃허브에 처음 들어가면 보이는 소개 페이지가 되겠다.
로컬에 이 레포지터리를 clone 해보자
git clone 한 폴더를 열어주고, 다음과 같은 명령어를 입력한다.
npm init 을 하고 rss-parser 를 설치하기 위함이다.
npm init -y
npm i rss-parser
그리고 package.json 파일에 들어가 type 과 start 를 추가해준다. 코드는 아래와 같다.
{
...
"main": "index.js",
"type": "module", // 추가
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"start" : "node readmeUpdate.js" // 추가
},
...
}
이번에는 readmeUpdate.js 를 아래와 같이 작성해보자.
RSS 피드 가져오기에 있는 블로그 주소를 본인의 블로그 주소로 바꿔줘야한다.
import { readFileSync, writeFileSync } from "node:fs";
import Parser from "rss-parser";
// 기존 README.md 파일 읽기
const readmePath = "README.md";
let readmeContent = readFileSync(readmePath, "utf8");
// RSS 파서 생성
const parser = new Parser({
headers: {
Accept: "application/rss+xml, application/xml, text/xml; q=0.1",
},
});
// 최신 블로그 포스트 추가하는 함수
(async () => {
// RSS 피드 가져오기
const feed = await parser.parseURL("https://dawonny.tistory.com/rss"); // 수정
// 최신 5개의 글의 제목과 링크를 추가할 텍스트 생성
let latestPosts = "### Latest Blog Posts\n\n";
for (let i = 0; i < 5 && i < feed.items.length; i++) {
const { title, link } = feed.items[i];
latestPosts += `- [${title}](${link})\n`;
}
// 기존 README.md에 최신 블로그 포스트 추가
const newReadmeContent = readmeContent.includes("### Latest Blog Posts")
? readmeContent.replace(
/### Latest Blog Posts[\s\S]*?(?=\n\n## |\n$)/,
latestPosts
)
: readmeContent + latestPosts;
if (newReadmeContent !== readmeContent) {
writeFileSync(readmePath, newReadmeContent, "utf8");
console.log("README.md 업데이트 완료");
} else {
console.log("새로운 블로그 포스트가 없습니다. README.md 파일이 업데이트되지 않았습니다.");
}
})();
Github Actions 를 이용해서 주기적으로 readmeUpdate.js 를 실행해서 README.md 파일을 업데이트하게 해보자.
.github 폴더 안에 workflows 폴더를 만들고 그 안에 update-readme.yml 파일을 생성한다.
이제 update-readme.yml 파일을 작성해줄 것이다. 그 전에 토큰을 만들어줘야한다.
나는 GH_PERSONAL_TOKEN 이라는 이름의 토큰을 만들어주었다.
토큰 권한은 workflow scope 권한을 포함해서 필요한 권한을 선택해주면 된다.
해당 레포지터리 페이지의 setting > secrets and variables > actions 로 이동해서 새로운 시크릿을 추가하는 것도 잊지 말자.
복사해두었던 토큰 값으로 설정해주면 된다.
update-readme.yml 파일은 다음과 같이 작성한다.
cron 을 원하는 대로 설정하고(나는 1시간에 한 번씩 업데이트가 되도록 했다) github 이메일과 github 사용자 이름, 그리고 방금 만들었던 토큰 이름을 수정하면 된다.
name: Update README
on:
schedule:
- cron: "0 */1 * * *" # 매 시간 정각에 실행
push:
branches:
- main
jobs:
update-readme:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v3
- name: Set up Node.js
uses: actions/setup-node@v3
with:
node-version: "16"
- name: Install dependencies
run: npm ci
- name: Run update script
run: npm start
- name: Commit README
run: |
git config --local user.name 'your-name' # 수정
git config --local user.email 'your-email' # 수정
if [ -n "$(git status --porcelain)" ]; then
git add README.md
git commit -m 'Update README with latest blog posts'
git push
else
echo "No changes to commit"
fi
env:
GH_PERSONAL_TOKEN: ${{ secrets.GH_PERSONAL_TOKEN }} # 수정
변경 사항이 있을 때만 commit 을 하도록 먼저 git status --porcelain 명령어를 사용해서 변경사항을 확인하도록 했다.
이제 모두 끝났다! git push 을 해서 반영해주자.
참고)
나는 분명 토큰에 workflow 권한을 주었는데도 자꾸 아래와 같은 오류가 났다.
답답해서 찾던 중 Mac 의 키체인 접근에서 문제를 해결해보라는 글을 보았다.
확인해보니까 내가 새로 생성한 토큰 값이 아닌 다른 토큰으로 채워져 있는 것 같았다.
새로운 토큰 값으로 수정하고 다시 push를 시도해보았다.해결! 🥳
아래처럼 잘 반영되는 것을 확인할 수 있다.
나는 토큰이 잘 반영되지 않는 문제 때문에 시간을 좀 잡아먹었지만,
과정 자체는 단순해서 다른 분들은 트러블 슈팅없이 완성하셨으면 좋겠다!
+추가)
최근 글이 업데이트 되지 않았는데도 README 가 수정되는 이슈
위처럼 http, https 가 의미없이 계속 반대로 바뀌며 README 에 commit 되고 있는 이슈가 발생했다.
불러온 블로그 주소가 http 일 때에는 무조건 https 로 보이도록 수정을 한다음, 기존 컨텐츠와 비교할 수 있도록 코드를 수정해봤다.
// 최신 5개의 글의 제목과 링크를 추가할 텍스트 생성
let latestPosts = "### Latest Blog Posts\n\n";
for (let i = 0; i < 5 && i < feed.items.length; i++) {
let { title, link } = feed.items[i]; // const -> let 으로 수정
link = link.startsWith('http://') ? 'https://' + link.slice(7) : link; // 추가
latestPosts += `- [${title}](${link})\n`;
}
이제 이런 의미없는 README commit 이 일어나지 않길 바라며 ...
+추가)
GITHUB_TOKEN 사용
댓글로 알려주신 내용을 추가한다.
위에서 내가 설명한 내용에서는 별도의 개인 액세스 토큰을 생성하고 시크릿에 등록을 하는 내용이었다.
하지만 Github Actions 에서 자동으로 제공하는 GITHUB_TOKEN 을 사용하면 그 과정을 생략할 수 있다.
예를 들어 아래와 같이 사용할 수 있다.
github_token: ${{ secrets.GITHUB_TOKEN }}
GITHUB_TOKEN 은 해당 워크플로우에 필요한 최소한의 권한만 가지고 있어 보안성이 향상된다.
또한 개인 액세스 토큰과 달리 만료 걱정이 없고, 레포지터리마다 별도로 설정할 필요가 없다.
도움이 되셨다면 좋아요 한 번만 부탁드립니다! :-)