GitHub에서 사용자 이름(username)과 동일한 이름으로 public 레포지토리를 생성하고 RRADME.md 파일을 추가하면 프로필 페이지 상단에 README 내용이 표시된다. 프로필 페이지엔 주로 자신이 소개하고 싶은 프로젝트, 기술 스택 등을 기재한다. 카테고리별로 주목할만한 프로필 페이지를 모아둔 사이트도 있다.

@mokkapps

@mokkapps

대부분의 개발자들이 블로그를 운영하고 있어서 그런지 Latest Blog Posts 헤더에 최근 글 목록을 보여주는 프로필이 많다. 이 기능은 rss-parser 같은 라이브러리를 통해 RSS 피드 목록을 불러오고 README.md에 반영하는 방식으로 구현되는데, 이 작업을 GitHub Actions를 통해 정기적으로 수행하도록 만들 수 있다.

RSS 설정


먼저 자신의 블로그 혹은 웹사이트에 RSS 설정을 해야 한다. RSS는 웹사이트에 올라온 정보를 간편하게 제공하기 위한 XML 기반의 포맷이다. 사용자가 직접 웹사이트를 방문하지 않아도 최신 콘텐츠를 자동으로 받을 수 있는 장점이 있다.

대부분의 콘텐츠 서비스는 RSS를 지원한다. 티스토리 블로그는 관리 → 블로그 → 기타 설정에서 RSS 기능을 켤 수 있다. RSS 피드는 일반적으로 도메인 주소 뒤에 /rss를 붙이는 방식으로 접근할 수 있다.

Untitled

파싱 스크립트


<aside> <img src="/icons/search_gray.svg" alt="/icons/search_gray.svg" width="40px" /> 아래 가이드에선 pnpm 패키지 매니저를 사용했다.

</aside>

프로젝트 초기화

GitHub 프로필 레포지토리를 클론한 후 아래 명령어로 프로젝트를 초기화한다.

pnpm init -y

명령어를 실행하면 package.json 파일이 생성된다. Node.js는 기본적으로 CommonJS(require 구문)이므로 익숙한 import 구문을 사용할 수 있도록 "type": "module"을 추가한다. 스크립트 실행을 위해 scripts 속성에 명령어도 등록해둔다.

{
	"name": "username",
	"version": "1.0.0",
	"description": "",
	"main": "index.js",
	"type": "module", // 추가
	"scripts": {
		"test": "echo \\"Error: no test specified\\" && exit 1",
		"rss-to-readme": "node rss-to-readme.js" // 추가
	},
	"keywords": [],
	"author": "",
	"license": "ISC",
}

RSS 피드 목록을 불러오고 자바스크립트 객체로 변환하기 위해 rss-parser 라이브러리를 설치한다.

pnpm add rss-parser

스크립트 작성

rss-to-readme.js 파일에 아래 내용을 붙여넣고 TODO 주석 부분을 수정한다. 기본값은 최근 5개 글을 불러와서 Latest Blog Posts 헤더(레벨2) 아래 불릿 목록으로 추가한다. 목록은 프로필 페이지 가장 하단에 위치한다.